/* SimKai font - Two-phase loading strategy */ /* Priority: 1.52 MB (preload) | Extended: 3.39 MB (prefetch) | Total: 4.91 MB */ /* Preload priority.woff2 in HTML for instant loading */ /* Prefetch extended.woff2 in HTML for background loading */ @font-face { font-family: 'KaiTi'; src: url(/simkai-subsets/priority.woff2) format('woff2'); font-weight: normal; font-style: normal; font-display: block; unicode-range: U+0020-007E, U+00A4, U+00A7-00A8, U+00B0-00B1, U+00B7, U+00D7, U+00E0-00E1, U+00E8-00EA, U+00EC-00ED, U+00F2-00F3, U+00F7, U+00F9-00FA, U+00FC, U+0101, U+0113, U+011B, U+012B, U+0144, U+0148, U+014D, U+016B, U+01CE, U+01D0, U+01D2, U+01D4, U+01D6, U+01D8, U+01DA, U+01DC, U+01F9, U+0251, U+0261, U+02C7, U+02C9-02CB, U+02D9, U+0391-03A1, U+03A3-03A9, U+03B1-03C1, U+03C3-03C9, U+0401, U+0410-044F, U+0451, U+2010, U+2013-2016, U+2018-2019, U+201C-201D, U+2025-2026, U+2030, U+2032-2033, U+2035, U+203B, U+20AC, U+2103, U+2105, U+2109, U+2116, U+2121, U+2160-216B, U+2170-2179, U+2190-2193, U+2196-2199, U+2208, U+220F, U+2211, U+2215, U+221A, U+221D-2220, U+2223, U+2225, U+2227-222B, U+222E, U+2234-2237, U+223D, U+2248, U+224C, U+2252, U+2260-2261, U+2264-2267, U+226E-226F, U+2295, U+2299, U+22A5, U+22BF, U+2312, U+2460-2469, U+2474-249B, U+2500-254B, U+2550-2573, U+2581-258F, U+2593-2595, U+25A0-25A1, U+25B2-25B3, U+25BC-25BD, U+25C6-25C7, U+25CB, U+25CE-25CF, U+25E2-25E5, U+2605-2606, U+2609, U+2640, U+2642, U+2E81, U+2E84, U+2E88, U+2E8B-2E8C, U+2E97, U+2EA7, U+2EAA, U+2EAE, U+2EB3, U+2EB6-2EB7, U+2EBB, U+2ECA, U+2FF0-2FFB, U+3000-3003, U+3005-3017, U+301D-301E, U+3021-3029, U+303E, U+3041-3093, U+309B-309E, U+30A1-30F6, U+30FC-30FE, U+3105-3129, U+3220-3229, U+3231, U+32A3, U+338E-338F, U+339C-339E, U+33A1, U+33C4, U+33CE, U+33D1-33D2, U+33D5, U+3400-4DB5, U+E78D-E796, U+E7C7, U+E816-E818, U+E81E, U+E826, U+E82B-E82C, U+E831-E832, U+E83B, U+E843, U+E854-E855, U+E864, U+F92C, U+F979, U+F995, U+F9E7, U+F9F1, U+FA0C-FA0F, U+FA11, U+FA13-FA14, U+FA18, U+FA1F-FA21, U+FA23-FA24, U+FA27-FA29, U+FE30-FE31, U+FE33-FE44, U+FE49-FE52, U+FE54-FE57, U+FE59-FE66, U+FE68-FE6B, U+FF01-FF5E, U+FFE0-FFE5, U+4E00-57C3; /* 1.52 MB - Most common 2500 characters + ASCII/symbols */ } @font-face { font-family: 'KaiTi'; src: url(/simkai-subsets/extended.woff2) format('woff2'); font-weight: normal; font-style: normal; font-display: block; unicode-range: U+57C4-9FA5; /* 3.39 MB - Rare characters */ } *, ::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: ; } ::-webkit-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: ; } ::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.17 | 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:-ms-input-placeholder, textarea:-ms-input-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; } .pointer-events-auto { pointer-events: auto; } .visible { visibility: visible; } .invisible { visibility: hidden; } .collapse { visibility: collapse; } .static { position: static; } .fixed { position: fixed; } .absolute { position: absolute; } .relative { position: relative; } .sticky { position: -webkit-sticky; position: sticky; } .inset-0 { inset: 0px; } .inset-x-4 { left: 1rem; right: 1rem; } .inset-y-0 { top: 0px; bottom: 0px; } .-bottom-0\.5 { bottom: -0.125rem; } .-bottom-\[13px\] { bottom: -13px; } .-bottom-\[20px\] { bottom: -20px; } .-bottom-\[3px\] { bottom: -3px; } .-left-1 { left: -0.25rem; } .-left-2 { left: -0.5rem; } .-left-3 { left: -0.75rem; } .-left-\[12px\] { left: -12px; } .-left-\[20px\] { left: -20px; } .-left-\[2px\] { left: -2px; } .-left-\[4px\] { left: -4px; } .-left-\[5px\] { left: -5px; } .-left-\[60px\] { left: -60px; } .-left-\[7px\] { left: -7px; } .-left-\[9px\] { left: -9px; } .-right-0\.5 { right: -0.125rem; } .-right-1 { right: -0.25rem; } .-right-3 { right: -0.75rem; } .-right-\[18px\] { right: -18px; } .-right-\[3px\] { right: -3px; } .-right-\[6px\] { right: -6px; } .-top-1 { top: -0.25rem; } .-top-3 { top: -0.75rem; } .-top-5 { top: -1.25rem; } .-top-\[14px\] { top: -14px; } .-top-\[22px\] { top: -22px; } .-top-\[26px\] { top: -26px; } .-top-\[2px\] { top: -2px; } .-top-\[3px\] { top: -3px; } .-top-\[4px\] { top: -4px; } .-top-\[55px\] { top: -55px; } .-top-\[5px\] { top: -5px; } .-top-\[6px\] { top: -6px; } .-top-\[7px\] { top: -7px; } .-top-px { top: -1px; } .bottom-0 { bottom: 0px; } .bottom-1 { bottom: 0.25rem; } .bottom-18 { bottom: 4.5rem; } .bottom-2 { bottom: 0.5rem; } .bottom-28 { bottom: 7rem; } .bottom-3 { bottom: 0.75rem; } .bottom-\[-20px\] { bottom: -20px; } .bottom-\[10px\] { bottom: 10px; } .bottom-\[1px\] { bottom: 1px; } .bottom-\[24px\] { bottom: 24px; } .bottom-\[29px\] { bottom: 29px; } .bottom-\[2px\] { bottom: 2px; } .bottom-\[30px\] { bottom: 30px; } .bottom-\[41px\] { bottom: 41px; } .bottom-full { bottom: 100%; } .bottom-px { bottom: 1px; } .left-0 { left: 0px; } .left-1 { left: 0.25rem; } .left-2 { left: 0.5rem; } .left-3 { left: 0.75rem; } .left-\[0px\] { left: 0px; } .left-\[10px\] { left: 10px; } .left-\[14px\] { left: 14px; } .left-\[21px\] { left: 21px; } .left-\[22px\] { left: 22px; } .left-\[25px\] { left: 25px; } .left-\[28px\] { left: 28px; } .left-\[2px\] { left: 2px; } .left-\[35px\] { left: 35px; } .left-\[3px\] { left: 3px; } .left-\[4px\] { left: 4px; } .left-\[50\%\] { left: 50%; } .left-\[5px\] { left: 5px; } .left-\[6px\] { left: 6px; } .left-\[7px\] { left: 7px; } .left-\[8px\] { left: 8px; } .left-px { left: 1px; } .right-0 { right: 0px; } .right-0\.5 { right: 0.125rem; } .right-1 { right: 0.25rem; } .right-11 { right: 2.75rem; } .right-2 { right: 0.5rem; } .right-3 { right: 0.75rem; } .right-8 { right: 2rem; } .right-\[-2px\] { right: -2px; } .right-\[10px\] { right: 10px; } .right-\[1px\] { right: 1px; } .right-\[22px\] { right: 22px; } .right-\[25px\] { right: 25px; } .right-\[2px\] { right: 2px; } .right-\[8px\] { right: 8px; } .right-px { right: 1px; } .top-0 { top: 0px; } .top-1 { top: 0.25rem; } .top-1\/2 { top: 50%; } .top-10 { top: 2.5rem; } .top-14 { top: 3.5rem; } .top-16 { top: 4rem; } .top-2 { top: 0.5rem; } .top-3 { top: 0.75rem; } .top-32 { top: 8rem; } .top-8 { top: 2rem; } .top-\[-20px\] { top: -20px; } .top-\[-26px\] { top: -26px; } .top-\[-50px\] { top: -50px; } .top-\[140px\] { top: 140px; } .top-\[1px\] { top: 1px; } .top-\[2px\] { top: 2px; } .top-\[37px\] { top: 37px; } .top-\[42px\] { top: 42px; } .top-\[4px\] { top: 4px; } .top-\[5px\] { top: 5px; } .top-\[60px\] { top: 60px; } .top-\[6px\] { top: 6px; } .top-\[76px\] { top: 76px; } .top-\[7px\] { top: 7px; } .top-px { top: 1px; } .isolate { isolation: isolate; } .-z-10 { z-index: -10; } .z-0 { z-index: 0; } .z-10 { z-index: 10; } .z-20 { z-index: 20; } .z-30 { z-index: 30; } .z-40 { z-index: 40; } .z-50 { z-index: 50; } .z-\[-1\] { z-index: -1; } .z-\[100\] { z-index: 100; } .z-\[105\] { z-index: 105; } .z-\[10\] { z-index: 10; } .z-\[120\] { z-index: 120; } .z-\[60\] { z-index: 60; } .z-\[70\] { z-index: 70; } .z-\[90\] { z-index: 90; } .z-\[999\] { z-index: 999; } .z-\[99\] { z-index: 99; } .order-1 { order: 1; } .order-10 { order: 10; } .order-11 { order: 11; } .order-12 { order: 12; } .order-13 { order: 13; } .order-14 { order: 14; } .order-15 { order: 15; } .order-2 { order: 2; } .order-3 { order: 3; } .order-4 { order: 4; } .order-5 { order: 5; } .order-6 { order: 6; } .order-7 { order: 7; } .order-8 { order: 8; } .order-9 { order: 9; } .order-first { order: -9999; } .order-last { order: 9999; } .col-span-2 { grid-column: span 2 / span 2; } .col-span-3 { grid-column: span 3 / span 3; } .col-span-4 { grid-column: span 4 / span 4; } .col-span-5 { grid-column: span 5 / span 5; } .col-span-7 { grid-column: span 7 / span 7; } .row-span-2 { grid-row: span 2 / span 2; } .m-0 { margin: 0px; } .m-6 { margin: 1.5rem; } .mx-1 { margin-left: 0.25rem; margin-right: 0.25rem; } .mx-2 { margin-left: 0.5rem; margin-right: 0.5rem; } .mx-3 { margin-left: 0.75rem; margin-right: 0.75rem; } .mx-6 { margin-left: 1.5rem; margin-right: 1.5rem; } .mx-auto { margin-left: auto; margin-right: auto; } .my-1 { margin-top: 0.25rem; margin-bottom: 0.25rem; } .my-10 { margin-top: 2.5rem; margin-bottom: 2.5rem; } .my-12 { margin-top: 3rem; margin-bottom: 3rem; } .my-14 { margin-top: 3.5rem; margin-bottom: 3.5rem; } .my-2 { margin-top: 0.5rem; margin-bottom: 0.5rem; } .my-20 { margin-top: 5rem; margin-bottom: 5rem; } .my-28 { margin-top: 7rem; margin-bottom: 7rem; } .my-3 { margin-top: 0.75rem; margin-bottom: 0.75rem; } .my-4 { margin-top: 1rem; margin-bottom: 1rem; } .my-6 { margin-top: 1.5rem; margin-bottom: 1.5rem; } .my-8 { margin-top: 2rem; margin-bottom: 2rem; } .-mb-6 { margin-bottom: -1.5rem; } .-mb-7 { margin-bottom: -1.75rem; } .-ml-0\.5 { margin-left: -0.125rem; } .-ml-1 { margin-left: -0.25rem; } .-ml-24 { margin-left: -6rem; } .-ml-3 { margin-left: -0.75rem; } .-ml-4 { margin-left: -1rem; } .-ml-5 { margin-left: -1.25rem; } .-mr-32 { margin-right: -8rem; } .-mt-1 { margin-top: -0.25rem; } .-mt-10 { margin-top: -2.5rem; } .-mt-12 { margin-top: -3rem; } .-mt-20 { margin-top: -5rem; } .-mt-24 { margin-top: -6rem; } .-mt-44 { margin-top: -11rem; } .-mt-5 { margin-top: -1.25rem; } .-mt-6 { margin-top: -1.5rem; } .-mt-7 { margin-top: -1.75rem; } .-mt-8 { margin-top: -2rem; } .-mt-9 { margin-top: -2.25rem; } .mb-0 { margin-bottom: 0px; } .mb-0\.5 { margin-bottom: 0.125rem; } .mb-1 { margin-bottom: 0.25rem; } .mb-10 { margin-bottom: 2.5rem; } .mb-11 { margin-bottom: 2.75rem; } .mb-12 { margin-bottom: 3rem; } .mb-16 { margin-bottom: 4rem; } .mb-2 { margin-bottom: 0.5rem; } .mb-20 { margin-bottom: 5rem; } .mb-24 { margin-bottom: 6rem; } .mb-2px { margin-bottom: 2px; } .mb-3 { margin-bottom: 0.75rem; } .mb-4 { margin-bottom: 1rem; } .mb-5 { margin-bottom: 1.25rem; } .mb-52 { margin-bottom: 13rem; } .mb-6 { margin-bottom: 1.5rem; } .mb-8 { margin-bottom: 2rem; } .mb-\[3px\] { margin-bottom: 3px; } .ml-0 { margin-left: 0px; } .ml-0\.5 { margin-left: 0.125rem; } .ml-1 { margin-left: 0.25rem; } .ml-10 { margin-left: 2.5rem; } .ml-12 { margin-left: 3rem; } .ml-2 { margin-left: 0.5rem; } .ml-20 { margin-left: 5rem; } .ml-2px { margin-left: 2px; } .ml-3 { margin-left: 0.75rem; } .ml-4 { margin-left: 1rem; } .ml-6 { margin-left: 1.5rem; } .ml-8 { margin-left: 2rem; } .ml-\[2px\] { margin-left: 2px; } .ml-\[4px\] { margin-left: 4px; } .ml-\[8px\] { margin-left: 8px; } .ml-auto { margin-left: auto; } .mr-0\.5 { margin-right: 0.125rem; } .mr-1 { margin-right: 0.25rem; } .mr-12 { margin-right: 3rem; } .mr-2 { margin-right: 0.5rem; } .mr-20 { margin-right: 5rem; } .mr-2px { margin-right: 2px; } .mr-3 { margin-right: 0.75rem; } .mr-4 { margin-right: 1rem; } .mr-5 { margin-right: 1.25rem; } .mr-6 { margin-right: 1.5rem; } .mr-8 { margin-right: 2rem; } .mr-\[32px\] { margin-right: 32px; } .mr-\[3px\] { margin-right: 3px; } .mr-\[76px\] { margin-right: 76px; } .mr-\[8px\] { margin-right: 8px; } .mr-auto { margin-right: auto; } .mt-0 { margin-top: 0px; } .mt-1 { margin-top: 0.25rem; } .mt-10 { margin-top: 2.5rem; } .mt-12 { margin-top: 3rem; } .mt-14 { margin-top: 3.5rem; } .mt-16 { margin-top: 4rem; } .mt-18 { margin-top: 4.5rem; } .mt-2 { margin-top: 0.5rem; } .mt-20 { margin-top: 5rem; } .mt-24 { margin-top: 6rem; } .mt-28 { margin-top: 7rem; } .mt-2px { margin-top: 2px; } .mt-3 { margin-top: 0.75rem; } .mt-32 { margin-top: 8rem; } .mt-36 { margin-top: 9rem; } .mt-4 { margin-top: 1rem; } .mt-40 { margin-top: 10rem; } .mt-48 { margin-top: 12rem; } .mt-5 { margin-top: 1.25rem; } .mt-52 { margin-top: 13rem; } .mt-6 { margin-top: 1.5rem; } .mt-64 { margin-top: 16rem; } .mt-72 { margin-top: 18rem; } .mt-8 { margin-top: 2rem; } .mt-\[104px\] { margin-top: 104px; } .mt-\[136px\] { margin-top: 136px; } .mt-\[4px\] { margin-top: 4px; } .mt-\[8px\] { margin-top: 8px; } .mt-auto { margin-top: auto; } .mt-px { margin-top: 1px; } .box-content { box-sizing: content-box; } .block { display: block; } .inline-block { display: inline-block; } .inline { display: inline; } .flex { display: flex; } .inline-flex { display: inline-flex; } .table { display: table; } .grid { display: grid; } .contents { display: contents; } .hidden { display: none; } .h-0 { height: 0px; } .h-1 { height: 0.25rem; } .h-1\.5 { height: 0.375rem; } .h-1\/2 { height: 50%; } .h-10 { height: 2.5rem; } .h-11 { height: 2.75rem; } .h-12 { height: 3rem; } .h-14 { height: 3.5rem; } .h-16 { height: 4rem; } .h-18 { height: 4.5rem; } .h-2 { height: 0.5rem; } .h-2\.5 { height: 0.625rem; } .h-2\/3 { height: 66.666667%; } .h-20 { height: 5rem; } .h-24 { height: 6rem; } .h-28 { height: 7rem; } .h-3 { height: 0.75rem; } .h-3\/4 { height: 75%; } .h-32 { height: 8rem; } .h-4 { height: 1rem; } .h-40 { height: 10rem; } .h-48 { height: 12rem; } .h-5 { height: 1.25rem; } .h-52 { height: 13rem; } .h-6 { height: 1.5rem; } .h-60 { height: 15rem; } .h-7 { height: 1.75rem; } .h-8 { height: 2rem; } .h-80 { height: 20rem; } .h-9 { height: 2.25rem; } .h-96 { height: 24rem; } .h-\[100px\] { height: 100px; } .h-\[104px\] { height: 104px; } .h-\[10px\] { height: 10px; } .h-\[11px\] { height: 11px; } .h-\[128px\] { height: 128px; } .h-\[130px\] { height: 130px; } .h-\[140px\] { height: 140px; } .h-\[14px\] { height: 14px; } .h-\[150px\] { height: 150px; } .h-\[18px\] { height: 18px; } .h-\[196px\] { height: 196px; } .h-\[260px\] { height: 260px; } .h-\[28px\] { height: 28px; } .h-\[2px\] { height: 2px; } .h-\[32px\] { height: 32px; } .h-\[34px\] { height: 34px; } .h-\[36px\] { height: 36px; } .h-\[38px\] { height: 38px; } .h-\[3px\] { height: 3px; } .h-\[40px\] { height: 40px; } .h-\[4px\] { height: 4px; } .h-\[50px\] { height: 50px; } .h-\[51px\] { height: 51px; } .h-\[530px\] { height: 530px; } .h-\[60px\] { height: 60px; } .h-\[66px\] { height: 66px; } .h-\[6px\] { height: 6px; } .h-\[88px\] { height: 88px; } .h-auto { height: auto; } .h-full { height: 100%; } .h-px { height: 1px; } .h-screen { height: 100vh; } .max-h-8 { max-height: 2rem; } .max-h-\[500px\] { max-height: 500px; } .min-h-9 { min-height: 2.25rem; } .min-h-\[180px\] { min-height: 180px; } .min-h-\[500px\] { min-height: 500px; } .min-h-screen { min-height: 100vh; } .w-0 { width: 0px; } .w-1 { width: 0.25rem; } .w-1\.5 { width: 0.375rem; } .w-1\/12 { width: 8.333333%; } .w-1\/13 { width: 7.6923076%; } .w-1\/2 { width: 50%; } .w-1\/4 { width: 25%; } .w-1\/5 { width: 20%; } .w-10 { width: 2.5rem; } .w-11 { width: 2.75rem; } .w-11\/12 { width: 91.666667%; } .w-12 { width: 3rem; } .w-14 { width: 3.5rem; } .w-16 { width: 4rem; } .w-18 { width: 4.5rem; } .w-2 { width: 0.5rem; } .w-2\.5 { width: 0.625rem; } .w-2\/5 { width: 40%; } .w-2\/6 { width: 33.333333%; } .w-20 { width: 5rem; } .w-24 { width: 6rem; } .w-28 { width: 7rem; } .w-3 { width: 0.75rem; } .w-3\/4 { width: 75%; } .w-3\/5 { width: 60%; } .w-32 { width: 8rem; } .w-36 { width: 9rem; } .w-4 { width: 1rem; } .w-4\/5 { width: 80%; } .w-4\/6 { width: 66.666667%; } .w-40 { width: 10rem; } .w-44 { width: 11rem; } .w-48 { width: 12rem; } .w-5 { width: 1.25rem; } .w-52 { width: 13rem; } .w-56 { width: 14rem; } .w-6 { width: 1.5rem; } .w-6\/13 { width: 46.1538461%; } .w-60 { width: 15rem; } .w-7 { width: 1.75rem; } .w-7\/13 { width: 53.8461538%; } .w-72 { width: 18rem; } .w-8 { width: 2rem; } .w-80 { width: 20rem; } .w-9 { width: 2.25rem; } .w-96 { width: 24rem; } .w-\[10\%\] { width: 10%; } .w-\[100px\] { width: 100px; } .w-\[105px\] { width: 105px; } .w-\[10px\] { width: 10px; } .w-\[112px\] { width: 112px; } .w-\[118px\] { width: 118px; } .w-\[11px\] { width: 11px; } .w-\[122px\] { width: 122px; } .w-\[128px\] { width: 128px; } .w-\[130px\] { width: 130px; } .w-\[132px\] { width: 132px; } .w-\[136px\] { width: 136px; } .w-\[13px\] { width: 13px; } .w-\[140px\] { width: 140px; } .w-\[144px\] { width: 144px; } .w-\[146px\] { width: 146px; } .w-\[14px\] { width: 14px; } .w-\[150px\] { width: 150px; } .w-\[15px\] { width: 15px; } .w-\[160px\] { width: 160px; } .w-\[162px\] { width: 162px; } .w-\[180px\] { width: 180px; } .w-\[18px\] { width: 18px; } .w-\[200px\] { width: 200px; } .w-\[212px\] { width: 212px; } .w-\[216px\] { width: 216px; } .w-\[21px\] { width: 21px; } .w-\[228px\] { width: 228px; } .w-\[22px\] { width: 22px; } .w-\[240px\] { width: 240px; } .w-\[258px\] { width: 258px; } .w-\[25px\] { width: 25px; } .w-\[278px\] { width: 278px; } .w-\[28px\] { width: 28px; } .w-\[2px\] { width: 2px; } .w-\[300px\] { width: 300px; } .w-\[314px\] { width: 314px; } .w-\[32px\] { width: 32px; } .w-\[36px\] { width: 36px; } .w-\[38px\] { width: 38px; } .w-\[394px\] { width: 394px; } .w-\[40px\] { width: 40px; } .w-\[46px\] { width: 46px; } .w-\[48px\] { width: 48px; } .w-\[50px\] { width: 50px; } .w-\[60px\] { width: 60px; } .w-\[64px\] { width: 64px; } .w-\[6px\] { width: 6px; } .w-\[70px\] { width: 70px; } .w-\[75px\] { width: 75px; } .w-\[800px\] { width: 800px; } .w-\[80px\] { width: 80px; } .w-\[820px\] { width: 820px; } .w-\[87px\] { width: 87px; } .w-\[90px\] { width: 90px; } .w-\[92px\] { width: 92px; } .w-\[93px\] { width: 93px; } .w-\[calc\(100\%-20px\)\] { width: calc(100% - 20px); } .w-\[calc\(100\%-4px\)\] { width: calc(100% - 4px); } .w-auto { width: auto; } .w-full { width: 100%; } .w-px { width: 1px; } .w-screen { width: 100vw; } .min-w-0 { min-width: 0px; } .min-w-\[122px\] { min-width: 122px; } .max-w-2xl { max-width: 42rem; } .max-w-36 { max-width: 9rem; } .max-w-3xl { max-width: 48rem; } .max-w-4xl { max-width: 56rem; } .max-w-5xl { max-width: 64rem; } .max-w-6xl { max-width: 72rem; } .max-w-7xl { max-width: 80rem; } .max-w-\[100px\] { max-width: 100px; } .max-w-\[140px\] { max-width: 140px; } .max-w-\[1488px\] { max-width: 1488px; } .max-w-\[200px\] { max-width: 200px; } .max-w-\[376px\] { max-width: 376px; } .max-w-\[468px\] { max-width: 468px; } .max-w-\[640px\] { max-width: 640px; } .max-w-\[732px\] { max-width: 732px; } .max-w-\[800px\] { max-width: 800px; } .max-w-lg { max-width: 32rem; } .max-w-md { max-width: 28rem; } .max-w-none { max-width: none; } .max-w-prose { max-width: 65ch; } .max-w-screen-lg { max-width: 1024px; } .max-w-screen-md { max-width: 768px; } .max-w-screen-sm { max-width: 640px; } .max-w-screen-xl { max-width: 1280px; } .max-w-screen-xs { max-width: 475px; } .max-w-sm { max-width: 24rem; } .max-w-xl { max-width: 36rem; } .max-w-xs { max-width: 20rem; } .flex-1 { flex: 1 1 0%; } .flex-shrink-0 { flex-shrink: 0; } .shrink-0 { flex-shrink: 0; } .flex-grow { flex-grow: 1; } .flex-grow-0 { flex-grow: 0; } .grow { flex-grow: 1; } .table-auto { table-layout: auto; } .border-collapse { border-collapse: collapse; } .-translate-x-0\.5 { --tw-translate-x: -0.125rem; 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)); } .-translate-x-1\/2 { --tw-translate-x: -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)); } .-translate-x-3 { --tw-translate-x: -0.75rem; 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)); } .-translate-x-4 { --tw-translate-x: -1rem; 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)); } .-translate-x-48 { --tw-translate-x: -12rem; 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)); } .-translate-x-\[200px\] { --tw-translate-x: -200px; 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)); } .-translate-x-full { --tw-translate-x: -100%; 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)); } .-translate-y-1 { --tw-translate-y: -0.25rem; 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)); } .-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)); } .-translate-y-2 { --tw-translate-y: -0.5rem; 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)); } .-translate-y-3 { --tw-translate-y: -0.75rem; 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)); } .-translate-y-5 { --tw-translate-y: -1.25rem; 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)); } .-translate-y-\[120\%\] { --tw-translate-y: -120%; 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)); } .-translate-y-\[14px\] { --tw-translate-y: -14px; 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)); } .-translate-y-\[20px\] { --tw-translate-y: -20px; 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)); } .-translate-y-\[2px\] { --tw-translate-y: -2px; 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)); } .-translate-y-\[3px\] { --tw-translate-y: -3px; 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)); } .-translate-y-\[5px\] { --tw-translate-y: -5px; 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)); } .-translate-y-\[60px\] { --tw-translate-y: -60px; 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)); } .-translate-y-full { --tw-translate-y: -100%; 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)); } .translate-x-0 { --tw-translate-x: 0px; 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)); } .translate-x-0\.5 { --tw-translate-x: 0.125rem; 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)); } .translate-x-1 { --tw-translate-x: 0.25rem; 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)); } .translate-x-2 { --tw-translate-x: 0.5rem; 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)); } .translate-x-\[50px\] { --tw-translate-x: 50px; 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)); } .translate-x-full { --tw-translate-x: 100%; 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)); } .translate-y-0 { --tw-translate-y: 0px; 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)); } .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)); } .translate-y-20 { --tw-translate-y: 5rem; 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)); } .translate-y-3 { --tw-translate-y: 0.75rem; 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)); } .translate-y-8 { --tw-translate-y: 2rem; 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)); } .translate-y-\[14px\] { --tw-translate-y: 14px; 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)); } .translate-y-\[3px\] { --tw-translate-y: 3px; 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)); } .translate-y-\[5px\] { --tw-translate-y: 5px; 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)); } .translate-y-full { --tw-translate-y: 100%; 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-12 { --tw-rotate: -12deg; 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-90 { --tw-rotate: -90deg; 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-\[42deg\] { --tw-rotate: -42deg; 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-\[45deg\] { --tw-rotate: -45deg; 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-\[46deg\] { --tw-rotate: -46deg; 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-\[60deg\] { --tw-rotate: -60deg; 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-0 { --tw-rotate: 0deg; 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-180 { --tw-rotate: 180deg; 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-45 { --tw-rotate: 45deg; 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-90 { --tw-rotate: 90deg; 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-\[105deg\] { --tw-rotate: 105deg; 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-\[134deg\] { --tw-rotate: 134deg; 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-\[138deg\] { --tw-rotate: 138deg; 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-\[60deg\] { --tw-rotate: 60deg; 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)); } .-skew-x-12 { --tw-skew-x: -12deg; 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)); } .skew-x-12 { --tw-skew-x: 12deg; 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)); } .scale-100 { --tw-scale-x: 1; --tw-scale-y: 1; 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)); } .scale-125 { --tw-scale-x: 1.25; --tw-scale-y: 1.25; 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)); } .scale-75 { --tw-scale-x: .75; --tw-scale-y: .75; 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)); } .scale-95 { --tw-scale-x: .95; --tw-scale-y: .95; 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)); } .transform { 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)); } @-webkit-keyframes ping { 75%, 100% { transform: scale(2); opacity: 0; } } @keyframes ping { 75%, 100% { transform: scale(2); opacity: 0; } } .animate-ping { -webkit-animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; } @-webkit-keyframes pulse { 50% { opacity: .5; } } @keyframes pulse { 50% { opacity: .5; } } .animate-pulse { -webkit-animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } .cursor-grab { cursor: -webkit-grab; cursor: grab; } .cursor-not-allowed { cursor: not-allowed; } .cursor-pointer { cursor: pointer; } .touch-none { touch-action: none; } .select-none { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .resize-none { resize: none; } .resize { resize: both; } .scroll-mt-18 { scroll-margin-top: 4.5rem; } .list-inside { list-style-position: inside; } .list-decimal { list-style-type: decimal; } .list-disc { list-style-type: disc; } .list-none { list-style-type: none; } .appearance-none { -webkit-appearance: none; -moz-appearance: none; appearance: none; } .columns-1 { -moz-columns: 1; columns: 1; } .break-inside-avoid-column { -moz-column-break-inside: avoid; break-inside: avoid-column; } .grid-flow-row { grid-auto-flow: row; } .auto-rows-min { grid-auto-rows: -webkit-min-content; grid-auto-rows: min-content; } .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .grid-cols-13 { grid-template-columns: repeat(13, minmax(0, 1fr)); } .grid-cols-15 { grid-template-columns: repeat(15, minmax(0, 1fr)); } .grid-cols-16 { grid-template-columns: repeat(16, minmax(0, 1fr)); } .grid-cols-18 { grid-template-columns: repeat(18, minmax(0, 1fr)); } .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid-cols-20 { grid-template-columns: repeat(20, minmax(0, 1fr)); } .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));; } .grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));; } .grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));; } .grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr));; } .grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));; } .grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .grid-cols-\[180\] { grid-template-columns: 180; } .grid-cols-\[30\] { grid-template-columns: 30; } .grid-cols-\[365\] { grid-template-columns: 365; } .grid-cols-\[60\] { grid-template-columns: 60; } .grid-cols-\[90\] { grid-template-columns: 90; } .flex-row { flex-direction: row; } .flex-col { flex-direction: column; } .flex-col-reverse { flex-direction: column-reverse; } .flex-wrap { flex-wrap: wrap; } .content-start { align-content: flex-start; } .items-start { align-items: flex-start; } .items-end { align-items: flex-end; } .items-center { align-items: center; } .items-baseline { align-items: baseline; } .items-stretch { align-items: stretch; } .justify-start { justify-content: flex-start; } .justify-end { justify-content: flex-end; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .gap-0 { gap: 0px; } .gap-0\.5 { gap: 0.125rem; } .gap-1 { gap: 0.25rem; } .gap-10 { gap: 2.5rem; } .gap-12 { gap: 3rem; } .gap-14 { gap: 3.5rem; } .gap-16 { gap: 4rem; } .gap-2 { gap: 0.5rem; } .gap-24 { gap: 6rem; } .gap-3 { gap: 0.75rem; } .gap-4 { gap: 1rem; } .gap-6 { gap: 1.5rem; } .gap-8 { gap: 2rem; } .gap-9 { gap: 2.25rem; } .gap-\[1px\] { gap: 1px; } .gap-\[2px\] { gap: 2px; } .gap-\[5px\] { gap: 5px; } .gap-\[6px\] { gap: 6px; } .gap-px { gap: 1px; } .gap-x-3 { -moz-column-gap: 0.75rem; column-gap: 0.75rem; } .gap-y-1 { row-gap: 0.25rem; } .gap-y-2 { row-gap: 0.5rem; } .space-x-2 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.5rem * var(--tw-space-x-reverse)); margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))); } .space-x-3 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.75rem * var(--tw-space-x-reverse)); margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse))); } .space-y-1 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.25rem * var(--tw-space-y-reverse)); } .space-y-2 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); } .space-y-3 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.75rem * var(--tw-space-y-reverse)); } .space-y-4 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(1rem * var(--tw-space-y-reverse)); } .space-y-8 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(2rem * var(--tw-space-y-reverse)); } .space-y-\[2px\] > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(2px * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(2px * var(--tw-space-y-reverse)); } .divide-y > :not([hidden]) ~ :not([hidden]) { --tw-divide-y-reverse: 0; border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); border-bottom-width: calc(1px * var(--tw-divide-y-reverse)); } .divide-gray-200 > :not([hidden]) ~ :not([hidden]) { --tw-divide-opacity: 1; border-color: rgb(229 231 235 / var(--tw-divide-opacity, 1)); } .overflow-auto { overflow: auto; } .overflow-hidden { overflow: hidden; } .overflow-visible { overflow: visible; } .overflow-scroll { overflow: scroll; } .overflow-x-auto { overflow-x: auto; } .overflow-y-auto { overflow-y: auto; } .overflow-x-hidden { overflow-x: hidden; } .overflow-y-scroll { overflow-y: scroll; } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .text-ellipsis { text-overflow: ellipsis; } .whitespace-nowrap { white-space: nowrap; } .break-words { overflow-wrap: break-word; } .break-all { word-break: break-all; } .rounded { border-radius: 0.25rem; } .rounded-2xl { border-radius: 1rem; } .rounded-\[10px\] { border-radius: 10px; } .rounded-\[11px\] { border-radius: 11px; } .rounded-\[14px\] { border-radius: 14px; } .rounded-\[18px\] { border-radius: 18px; } .rounded-\[2px\] { border-radius: 2px; } .rounded-\[3px\] { border-radius: 3px; } .rounded-\[4px\] { border-radius: 4px; } .rounded-\[50\%\] { border-radius: 50%; } .rounded-\[5px\] { border-radius: 5px; } .rounded-\[6px\] { border-radius: 6px; } .rounded-full { border-radius: 9999px; } .rounded-lg { border-radius: 0.5rem; } .rounded-md { border-radius: 0.375rem; } .rounded-sm { border-radius: 0.125rem; } .rounded-xl { border-radius: 0.75rem; } .rounded-b-\[10px\] { border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; } .rounded-b-lg { border-bottom-right-radius: 0.5rem; border-bottom-left-radius: 0.5rem; } .rounded-b-xl { border-bottom-right-radius: 0.75rem; border-bottom-left-radius: 0.75rem; } .rounded-l-\[10px\] { border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .rounded-l-xl { border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem; } .rounded-r-\[10px\] { border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .rounded-r-lg { border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; } .rounded-r-xl { border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem; } .rounded-t-\[10px\] { border-top-left-radius: 10px; border-top-right-radius: 10px; } .rounded-t-md { border-top-left-radius: 0.375rem; border-top-right-radius: 0.375rem; } .rounded-t-xl { border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem; } .rounded-bl-xl { border-bottom-left-radius: 0.75rem; } .rounded-br-3xl { border-bottom-right-radius: 1.5rem; } .rounded-br-\[18px\] { border-bottom-right-radius: 18px; } .rounded-br-xl { border-bottom-right-radius: 0.75rem; } .rounded-tr-2xl { border-top-right-radius: 1rem; } .rounded-tr-xl { border-top-right-radius: 0.75rem; } .border { border-width: 1px; } .border-2 { border-width: 2px; } .border-4 { border-width: 4px; } .border-8 { border-width: 8px; } .border-\[3px\] { border-width: 3px; } .border-x { border-left-width: 1px; border-right-width: 1px; } .border-x-2 { border-left-width: 2px; border-right-width: 2px; } .border-y-2 { border-top-width: 2px; border-bottom-width: 2px; } .border-b { border-bottom-width: 1px; } .border-b-2 { border-bottom-width: 2px; } .border-b-\[2px\] { border-bottom-width: 2px; } .border-l { border-left-width: 1px; } .border-l-2 { border-left-width: 2px; } .border-l-4 { border-left-width: 4px; } .border-l-8 { border-left-width: 8px; } .border-r { border-right-width: 1px; } .border-r-2 { border-right-width: 2px; } .border-r-4 { border-right-width: 4px; } .border-r-\[2px\] { border-right-width: 2px; } .border-t { border-top-width: 1px; } .border-t-2 { border-top-width: 2px; } .border-t-4 { border-top-width: 4px; } .border-dashed { border-style: dashed; } .border-dotted { border-style: dotted; } .border-\[\#0191FF\] { --tw-border-opacity: 1; border-color: rgb(1 145 255 / var(--tw-border-opacity, 1)); } .border-\[\#088466\] { --tw-border-opacity: 1; border-color: rgb(8 132 102 / var(--tw-border-opacity, 1)); } .border-\[\#3faee6\] { --tw-border-opacity: 1; border-color: rgb(63 174 230 / var(--tw-border-opacity, 1)); } .border-\[\#D24E6B\] { --tw-border-opacity: 1; border-color: rgb(210 78 107 / var(--tw-border-opacity, 1)); } .border-\[\#E12F42\] { --tw-border-opacity: 1; border-color: rgb(225 47 66 / var(--tw-border-opacity, 1)); } .border-\[\#ac0145\] { --tw-border-opacity: 1; border-color: rgb(172 1 69 / var(--tw-border-opacity, 1)); } .border-\[\#ca3123\] { --tw-border-opacity: 1; border-color: rgb(202 49 35 / var(--tw-border-opacity, 1)); } .border-\[\#f5c651\] { --tw-border-opacity: 1; border-color: rgb(245 198 81 / var(--tw-border-opacity, 1)); } .border-black { --tw-border-opacity: 1; border-color: rgb(0 0 0 / var(--tw-border-opacity, 1)); } .border-black\/40 { border-color: rgb(0 0 0 / 0.4); } .border-blue { --tw-border-opacity: 1; border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); } .border-blue-200 { --tw-border-opacity: 1; border-color: rgb(191 219 254 / var(--tw-border-opacity, 1)); } .border-blue-brand { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); } .border-blue-brand\/30 { border-color: rgb(66 106 247 / 0.3); } .border-blue-brand\/40 { border-color: rgb(66 106 247 / 0.4); } .border-blue-ltl { --tw-border-opacity: 1; border-color: rgb(0 110 185 / var(--tw-border-opacity, 1)); } .border-blue-neon { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } .border-blue-outlier { --tw-border-opacity: 1; border-color: rgb(53 171 229 / var(--tw-border-opacity, 1)); } .border-gray-100 { --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); } .border-gray-200 { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); } .border-gray-300 { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } .border-gray-400 { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); } .border-gray-500 { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); } .border-gray-600 { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .border-green { --tw-border-opacity: 1; border-color: rgb(6 214 160 / var(--tw-border-opacity, 1)); } .border-orange-imagin8 { --tw-border-opacity: 1; border-color: rgb(241 98 52 / var(--tw-border-opacity, 1)); } .border-purple { --tw-border-opacity: 1; border-color: rgb(171 139 202 / var(--tw-border-opacity, 1)); } .border-red { --tw-border-opacity: 1; border-color: rgb(239 71 111 / var(--tw-border-opacity, 1)); } .border-red\/20 { border-color: rgb(239 71 111 / 0.2); } .border-transparent { border-color: transparent; } .border-white { --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity, 1)); } .border-white\/20 { border-color: rgb(255 255 255 / 0.2); } .border-white\/30 { border-color: rgb(255 255 255 / 0.3); } .border-white\/\[15\%\] { border-color: rgb(255 255 255 / 15%); } .border-yellow { --tw-border-opacity: 1; border-color: rgb(255 209 102 / var(--tw-border-opacity, 1)); } .border-yellow-500 { --tw-border-opacity: 1; border-color: rgb(234 179 8 / var(--tw-border-opacity, 1)); } .border-yellow\/20 { border-color: rgb(255 209 102 / 0.2); } .border-r-gray-500 { --tw-border-opacity: 1; border-right-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); } .border-opacity-30 { --tw-border-opacity: 0.3; } .bg-\[\#0179be\] { --tw-bg-opacity: 1; background-color: rgb(1 121 190 / var(--tw-bg-opacity, 1)); } .bg-\[\#0191FF\] { --tw-bg-opacity: 1; background-color: rgb(1 145 255 / var(--tw-bg-opacity, 1)); } .bg-\[\#3faee6\] { --tw-bg-opacity: 1; background-color: rgb(63 174 230 / var(--tw-bg-opacity, 1)); } .bg-\[\#D24E6B\] { --tw-bg-opacity: 1; background-color: rgb(210 78 107 / var(--tw-bg-opacity, 1)); } .bg-\[\#E12F42\] { --tw-bg-opacity: 1; background-color: rgb(225 47 66 / var(--tw-bg-opacity, 1)); } .bg-\[\#ac0145\] { --tw-bg-opacity: 1; background-color: rgb(172 1 69 / var(--tw-bg-opacity, 1)); } .bg-\[\#f5c651\] { --tw-bg-opacity: 1; background-color: rgb(245 198 81 / var(--tw-bg-opacity, 1)); } .bg-black { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .bg-black\/10 { background-color: rgb(0 0 0 / 0.1); } .bg-black\/20 { background-color: rgb(0 0 0 / 0.2); } .bg-black\/30 { background-color: rgb(0 0 0 / 0.3); } .bg-black\/40 { background-color: rgb(0 0 0 / 0.4); } .bg-black\/5 { background-color: rgb(0 0 0 / 0.05); } .bg-black\/50 { background-color: rgb(0 0 0 / 0.5); } .bg-blue { --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); } .bg-blue-100 { --tw-bg-opacity: 1; background-color: rgb(219 234 254 / var(--tw-bg-opacity, 1)); } .bg-blue-400 { --tw-bg-opacity: 1; background-color: rgb(96 165 250 / var(--tw-bg-opacity, 1)); } .bg-blue-50 { --tw-bg-opacity: 1; background-color: rgb(239 246 255 / var(--tw-bg-opacity, 1)); } .bg-blue-600 { --tw-bg-opacity: 1; background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1)); } .bg-blue-brand { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .bg-blue-brand\/10 { background-color: rgb(66 106 247 / 0.1); } .bg-blue-brand\/20 { background-color: rgb(66 106 247 / 0.2); } .bg-blue-brand\/30 { background-color: rgb(66 106 247 / 0.3); } .bg-blue-brand\/40 { background-color: rgb(66 106 247 / 0.4); } .bg-blue-brand\/5 { background-color: rgb(66 106 247 / 0.05); } .bg-blue-brand\/50 { background-color: rgb(66 106 247 / 0.5); } .bg-blue-brand\/60 { background-color: rgb(66 106 247 / 0.6); } .bg-blue-brand\/70 { background-color: rgb(66 106 247 / 0.7); } .bg-blue-brand\/80 { background-color: rgb(66 106 247 / 0.8); } .bg-blue-brand\/90 { background-color: rgb(66 106 247 / 0.9); } .bg-blue-light { --tw-bg-opacity: 1; background-color: rgb(184 220 232 / var(--tw-bg-opacity, 1)); } .bg-blue-ltl { --tw-bg-opacity: 1; background-color: rgb(0 110 185 / var(--tw-bg-opacity, 1)); } .bg-blue-neon { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .bg-blue-outlier { --tw-bg-opacity: 1; background-color: rgb(53 171 229 / var(--tw-bg-opacity, 1)); } .bg-blue-outlier\/10 { background-color: rgb(53 171 229 / 0.1); } .bg-blue-outlier\/5 { background-color: rgb(53 171 229 / 0.05); } .bg-blue\/30 { background-color: rgb(17 138 178 / 0.3); } .bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .bg-gray-200 { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .bg-gray-300 { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .bg-gray-400 { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .bg-gray-400\/10 { background-color: rgb(156 163 175 / 0.1); } .bg-gray-400\/20 { background-color: rgb(156 163 175 / 0.2); } .bg-gray-400\/30 { background-color: rgb(156 163 175 / 0.3); } .bg-gray-400\/40 { background-color: rgb(156 163 175 / 0.4); } .bg-gray-400\/5 { background-color: rgb(156 163 175 / 0.05); } .bg-gray-400\/50 { background-color: rgb(156 163 175 / 0.5); } .bg-gray-400\/60 { background-color: rgb(156 163 175 / 0.6); } .bg-gray-400\/70 { background-color: rgb(156 163 175 / 0.7); } .bg-gray-400\/80 { background-color: rgb(156 163 175 / 0.8); } .bg-gray-400\/90 { background-color: rgb(156 163 175 / 0.9); } .bg-gray-50 { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .bg-gray-500 { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .bg-gray-600 { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .bg-gray-700 { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .bg-gray-800 { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .bg-green { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .bg-green-100 { --tw-bg-opacity: 1; background-color: rgb(220 252 231 / var(--tw-bg-opacity, 1)); } .bg-green-500 { --tw-bg-opacity: 1; background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1)); } .bg-green\/10 { background-color: rgb(6 214 160 / 0.1); } .bg-green\/20 { background-color: rgb(6 214 160 / 0.2); } .bg-green\/30 { background-color: rgb(6 214 160 / 0.3); } .bg-green\/40 { background-color: rgb(6 214 160 / 0.4); } .bg-green\/5 { background-color: rgb(6 214 160 / 0.05); } .bg-green\/50 { background-color: rgb(6 214 160 / 0.5); } .bg-green\/60 { background-color: rgb(6 214 160 / 0.6); } .bg-green\/70 { background-color: rgb(6 214 160 / 0.7); } .bg-green\/80 { background-color: rgb(6 214 160 / 0.8); } .bg-green\/90 { background-color: rgb(6 214 160 / 0.9); } .bg-orange-100 { --tw-bg-opacity: 1; background-color: rgb(255 237 213 / var(--tw-bg-opacity, 1)); } .bg-orange-imagin8 { --tw-bg-opacity: 1; background-color: rgb(241 98 52 / var(--tw-bg-opacity, 1)); } .bg-purple { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .bg-purple\/10 { background-color: rgb(171 139 202 / 0.1); } .bg-purple\/20 { background-color: rgb(171 139 202 / 0.2); } .bg-purple\/30 { background-color: rgb(171 139 202 / 0.3); } .bg-purple\/40 { background-color: rgb(171 139 202 / 0.4); } .bg-purple\/5 { background-color: rgb(171 139 202 / 0.05); } .bg-purple\/50 { background-color: rgb(171 139 202 / 0.5); } .bg-purple\/60 { background-color: rgb(171 139 202 / 0.6); } .bg-purple\/70 { background-color: rgb(171 139 202 / 0.7); } .bg-purple\/80 { background-color: rgb(171 139 202 / 0.8); } .bg-purple\/90 { background-color: rgb(171 139 202 / 0.9); } .bg-red { --tw-bg-opacity: 1; background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); } .bg-red-50 { --tw-bg-opacity: 1; background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1)); } .bg-red-500 { --tw-bg-opacity: 1; background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1)); } .bg-red\/10 { background-color: rgb(239 71 111 / 0.1); } .bg-red\/50 { background-color: rgb(239 71 111 / 0.5); } .bg-transparent { background-color: transparent; } .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .bg-white\/10 { background-color: rgb(255 255 255 / 0.1); } .bg-white\/20 { background-color: rgb(255 255 255 / 0.2); } .bg-white\/30 { background-color: rgb(255 255 255 / 0.3); } .bg-white\/40 { background-color: rgb(255 255 255 / 0.4); } .bg-white\/5 { background-color: rgb(255 255 255 / 0.05); } .bg-white\/50 { background-color: rgb(255 255 255 / 0.5); } .bg-white\/60 { background-color: rgb(255 255 255 / 0.6); } .bg-white\/70 { background-color: rgb(255 255 255 / 0.7); } .bg-white\/75 { background-color: rgb(255 255 255 / 0.75); } .bg-white\/80 { background-color: rgb(255 255 255 / 0.8); } .bg-white\/90 { background-color: rgb(255 255 255 / 0.9); } .bg-yellow { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .bg-yellow-50 { --tw-bg-opacity: 1; background-color: rgb(254 252 232 / var(--tw-bg-opacity, 1)); } .bg-yellow-500 { --tw-bg-opacity: 1; background-color: rgb(234 179 8 / var(--tw-bg-opacity, 1)); } .bg-yellow\/10 { background-color: rgb(255 209 102 / 0.1); } .bg-yellow\/30 { background-color: rgb(255 209 102 / 0.3); } .bg-opacity-0 { --tw-bg-opacity: 0; } .bg-opacity-10 { --tw-bg-opacity: 0.1; } .bg-opacity-20 { --tw-bg-opacity: 0.2; } .bg-opacity-30 { --tw-bg-opacity: 0.3; } .bg-opacity-40 { --tw-bg-opacity: 0.4; } .bg-opacity-5 { --tw-bg-opacity: 0.05; } .bg-opacity-50 { --tw-bg-opacity: 0.5; } .bg-opacity-60 { --tw-bg-opacity: 0.6; } .bg-opacity-\[20\%\] { --tw-bg-opacity: 20%; } .bg-gradient-to-b { background-image: linear-gradient(to bottom, var(--tw-gradient-stops)); } .bg-gradient-to-bl { background-image: linear-gradient(to bottom left, var(--tw-gradient-stops)); } .bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)); } .bg-gradient-to-l { background-image: linear-gradient(to left, var(--tw-gradient-stops)); } .bg-gradient-to-r { background-image: linear-gradient(to right, var(--tw-gradient-stops)); } .bg-gradient-to-t { background-image: linear-gradient(to top, var(--tw-gradient-stops)); } .from-blue { --tw-gradient-from: #118ab2 var(--tw-gradient-from-position); --tw-gradient-to: rgb(17 138 178 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-blue-400 { --tw-gradient-from: #60a5fa var(--tw-gradient-from-position); --tw-gradient-to: rgb(96 165 250 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-blue-neon { --tw-gradient-from: #4fc3f7 var(--tw-gradient-from-position); --tw-gradient-to: rgb(79 195 247 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-blue-neon\/80 { --tw-gradient-from: rgb(79 195 247 / 0.8) var(--tw-gradient-from-position); --tw-gradient-to: rgb(79 195 247 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-gray-100 { --tw-gradient-from: #f3f4f6 var(--tw-gradient-from-position); --tw-gradient-to: rgb(243 244 246 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-purple { --tw-gradient-from: #AB8BCA var(--tw-gradient-from-position); --tw-gradient-to: rgb(171 139 202 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-red { --tw-gradient-from: #ef476f var(--tw-gradient-from-position); --tw-gradient-to: rgb(239 71 111 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-transparent { --tw-gradient-from: transparent var(--tw-gradient-from-position); --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-white { --tw-gradient-from: #fff var(--tw-gradient-from-position); --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-yellow { --tw-gradient-from: #ffd166 var(--tw-gradient-from-position); --tw-gradient-to: rgb(255 209 102 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .from-yellow-400 { --tw-gradient-from: #facc15 var(--tw-gradient-from-position); --tw-gradient-to: rgb(250 204 21 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .via-blue { --tw-gradient-to: rgb(17 138 178 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), #118ab2 var(--tw-gradient-via-position), var(--tw-gradient-to); } .via-blue-neon { --tw-gradient-to: rgb(79 195 247 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), #4fc3f7 var(--tw-gradient-via-position), var(--tw-gradient-to); } .via-red { --tw-gradient-to: rgb(239 71 111 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), #ef476f var(--tw-gradient-via-position), var(--tw-gradient-to); } .via-transparent { --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), transparent var(--tw-gradient-via-position), var(--tw-gradient-to); } .via-white { --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), #fff var(--tw-gradient-via-position), var(--tw-gradient-to); } .via-yellow { --tw-gradient-to: rgb(255 209 102 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), #ffd166 var(--tw-gradient-via-position), var(--tw-gradient-to); } .to-blue-600 { --tw-gradient-to: #2563eb var(--tw-gradient-to-position); } .to-blue-brand { --tw-gradient-to: #426AF7 var(--tw-gradient-to-position); } .to-gray-100 { --tw-gradient-to: #f3f4f6 var(--tw-gradient-to-position); } .to-gray-200 { --tw-gradient-to: #e5e7eb var(--tw-gradient-to-position); } .to-gray-400 { --tw-gradient-to: #9ca3af var(--tw-gradient-to-position); } .to-green { --tw-gradient-to: #06d6a0 var(--tw-gradient-to-position); } .to-red { --tw-gradient-to: #ef476f var(--tw-gradient-to-position); } .to-red-500 { --tw-gradient-to: #ef4444 var(--tw-gradient-to-position); } .to-transparent { --tw-gradient-to: transparent var(--tw-gradient-to-position); } .to-white { --tw-gradient-to: #fff var(--tw-gradient-to-position); } .to-yellow-400 { --tw-gradient-to: #facc15 var(--tw-gradient-to-position); } .bg-contain { background-size: contain; } .bg-clip-text { -webkit-background-clip: text; background-clip: text; } .bg-bottom { background-position: bottom; } .bg-center { background-position: center; } .bg-no-repeat { background-repeat: no-repeat; } .stroke-current { stroke: currentColor; } .stroke-1 { stroke-width: 1; } .stroke-2 { stroke-width: 2; } .object-contain { -o-object-fit: contain; object-fit: contain; } .p-0 { padding: 0px; } .p-0\.5 { padding: 0.125rem; } .p-1 { padding: 0.25rem; } .p-10 { padding: 2.5rem; } .p-12 { padding: 3rem; } .p-16 { padding: 4rem; } .p-2 { padding: 0.5rem; } .p-2px { padding: 2px; } .p-3 { padding: 0.75rem; } .p-4 { padding: 1rem; } .p-6 { padding: 1.5rem; } .p-8 { padding: 2rem; } .p-\[2px\] { padding: 2px; } .p-\[6px\] { padding: 6px; } .p-px { padding: 1px; } .px-0\.5 { padding-left: 0.125rem; padding-right: 0.125rem; } .px-1 { padding-left: 0.25rem; padding-right: 0.25rem; } .px-10 { padding-left: 2.5rem; padding-right: 2.5rem; } .px-12 { padding-left: 3rem; padding-right: 3rem; } .px-14 { padding-left: 3.5rem; padding-right: 3.5rem; } .px-2 { padding-left: 0.5rem; padding-right: 0.5rem; } .px-2\.5 { padding-left: 0.625rem; padding-right: 0.625rem; } .px-20 { padding-left: 5rem; padding-right: 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; } .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } .px-8 { padding-left: 2rem; padding-right: 2rem; } .px-96 { padding-left: 24rem; padding-right: 24rem; } .px-\[10px\] { padding-left: 10px; padding-right: 10px; } .px-\[6px\] { padding-left: 6px; padding-right: 6px; } .px-\[8px\] { padding-left: 8px; padding-right: 8px; } .px-px { padding-left: 1px; padding-right: 1px; } .py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; } .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; } .py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; } .py-12 { padding-top: 3rem; padding-bottom: 3rem; } .py-16 { padding-top: 4rem; padding-bottom: 4rem; } .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; } .py-20 { padding-top: 5rem; padding-bottom: 5rem; } .py-24 { padding-top: 6rem; padding-bottom: 6rem; } .py-2px { padding-top: 2px; padding-bottom: 2px; } .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; } .py-32 { padding-top: 8rem; padding-bottom: 8rem; } .py-4 { padding-top: 1rem; padding-bottom: 1rem; } .py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; } .py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; } .py-8 { padding-top: 2rem; padding-bottom: 2rem; } .py-\[2px\] { padding-top: 2px; padding-bottom: 2px; } .py-\[3px\] { padding-top: 3px; padding-bottom: 3px; } .py-\[6px\] { padding-top: 6px; padding-bottom: 6px; } .py-px { padding-top: 1px; padding-bottom: 1px; } .pb-1 { padding-bottom: 0.25rem; } .pb-10 { padding-bottom: 2.5rem; } .pb-12 { padding-bottom: 3rem; } .pb-16 { padding-bottom: 4rem; } .pb-2 { padding-bottom: 0.5rem; } .pb-20 { padding-bottom: 5rem; } .pb-24 { padding-bottom: 6rem; } .pb-3 { padding-bottom: 0.75rem; } .pb-32 { padding-bottom: 8rem; } .pb-36 { padding-bottom: 9rem; } .pb-4 { padding-bottom: 1rem; } .pb-6 { padding-bottom: 1.5rem; } .pb-8 { padding-bottom: 2rem; } .pb-\[28px\] { padding-bottom: 28px; } .pb-\[324px\] { padding-bottom: 324px; } .pb-\[6px\] { padding-bottom: 6px; } .pb-\[80px\] { padding-bottom: 80px; } .pl-0 { padding-left: 0px; } .pl-0\.5 { padding-left: 0.125rem; } .pl-1 { padding-left: 0.25rem; } .pl-10 { padding-left: 2.5rem; } .pl-12 { padding-left: 3rem; } .pl-2 { padding-left: 0.5rem; } .pl-3 { padding-left: 0.75rem; } .pl-36 { padding-left: 9rem; } .pl-4 { padding-left: 1rem; } .pl-5 { padding-left: 1.25rem; } .pl-6 { padding-left: 1.5rem; } .pl-7 { padding-left: 1.75rem; } .pl-8 { padding-left: 2rem; } .pl-9 { padding-left: 2.25rem; } .pl-96 { padding-left: 24rem; } .pl-\[10px\] { padding-left: 10px; } .pl-\[3px\] { padding-left: 3px; } .pl-\[6px\] { padding-left: 6px; } .pl-\[7px\] { padding-left: 7px; } .pl-\[92px\] { padding-left: 92px; } .pr-0 { padding-right: 0px; } .pr-1 { padding-right: 0.25rem; } .pr-10 { padding-right: 2.5rem; } .pr-12 { padding-right: 3rem; } .pr-16 { padding-right: 4rem; } .pr-2 { padding-right: 0.5rem; } .pr-20 { padding-right: 5rem; } .pr-2px { padding-right: 2px; } .pr-3 { padding-right: 0.75rem; } .pr-4 { padding-right: 1rem; } .pr-5 { padding-right: 1.25rem; } .pr-6 { padding-right: 1.5rem; } .pr-8 { padding-right: 2rem; } .pr-9 { padding-right: 2.25rem; } .pr-\[2px\] { padding-right: 2px; } .pr-\[72px\] { padding-right: 72px; } .pr-\[80px\] { padding-right: 80px; } .pr-\[84px\] { padding-right: 84px; } .pr-px { padding-right: 1px; } .pt-0\.5 { padding-top: 0.125rem; } .pt-1 { padding-top: 0.25rem; } .pt-10 { padding-top: 2.5rem; } .pt-12 { padding-top: 3rem; } .pt-14 { padding-top: 3.5rem; } .pt-16 { padding-top: 4rem; } .pt-2 { padding-top: 0.5rem; } .pt-20 { padding-top: 5rem; } .pt-24 { padding-top: 6rem; } .pt-3 { padding-top: 0.75rem; } .pt-32 { padding-top: 8rem; } .pt-4 { padding-top: 1rem; } .pt-40 { padding-top: 10rem; } .pt-46 { padding-top: 11.5rem; } .pt-5 { padding-top: 1.25rem; } .pt-6 { padding-top: 1.5rem; } .pt-8 { padding-top: 2rem; } .pt-\[196px\] { padding-top: 196px; } .pt-\[32px\] { padding-top: 32px; } .pt-\[34px\] { padding-top: 34px; } .pt-px { padding-top: 1px; } .text-left { text-align: left; } .text-center { text-align: center; } .text-right { text-align: right; } .text-end { text-align: end; } .align-middle { vertical-align: middle; } .font-inter { font-family: Inter; } .font-source-sans { font-family: Source\ Sans\ Pro; } .font-ubuntu-condensed { font-family: Ubuntu Condensed; } .text-2xl { font-size: 1.5rem; line-height: 2rem; } .text-3xl { font-size: 1.875rem; line-height: 2.25rem; } .text-4xl { font-size: 2.25rem; line-height: 2.5rem; } .text-5xl { font-size: 3rem; line-height: 1; } .text-6xl { font-size: 3.75rem; line-height: 1; } .text-7xl { font-size: 4.5rem; line-height: 1; } .text-8xl { font-size: 6rem; line-height: 1; } .text-\[10px\] { font-size: 10px; } .text-\[11px\] { font-size: 11px; } .text-\[13px\] { font-size: 13px; } .text-\[4px\] { font-size: 4px; } .text-\[82px\] { font-size: 82px; } .text-base { font-size: 1rem; line-height: 1.5rem; } .text-lg { font-size: 1.125rem; line-height: 1.75rem; } .text-sm { font-size: 0.875rem; line-height: 1.25rem; } .text-xl { font-size: 1.25rem; line-height: 1.75rem; } .text-xs { font-size: 0.75rem; line-height: 1rem; } .text-xs8 { font-size: 8px; } .text-xs9 { font-size: 9px; } .text-xxs { font-size: 10px; } .font-black { font-weight: 900; } .font-bold { font-weight: 700; } .font-extrabold { font-weight: 800; } .font-light { font-weight: 300; } .font-medium { font-weight: 500; } .font-normal { font-weight: 400; } .font-semibold { font-weight: 600; } .font-thin { font-weight: 100; } .uppercase { text-transform: uppercase; } .capitalize { text-transform: capitalize; } .italic { font-style: italic; } .\!leading-relaxed { line-height: 1.625 !important; } .leading-4 { line-height: 1rem; } .leading-8 { line-height: 2rem; } .leading-loose { line-height: 2; } .leading-none { line-height: 1; } .leading-normal { line-height: 1.5; } .leading-relaxed { line-height: 1.625; } .leading-snug { line-height: 1.375; } .leading-tight { line-height: 1.25; } .tracking-tight { letter-spacing: -0.025em; } .tracking-tighter { letter-spacing: -0.05em; } .tracking-wide { letter-spacing: 0.025em; } .tracking-wider { letter-spacing: 0.05em; } .tracking-widest { letter-spacing: 0.1em; } .text-\[\#0191FF\] { --tw-text-opacity: 1; color: rgb(1 145 255 / var(--tw-text-opacity, 1)); } .text-\[\#088466\] { --tw-text-opacity: 1; color: rgb(8 132 102 / var(--tw-text-opacity, 1)); } .text-\[\#3faee6\] { --tw-text-opacity: 1; color: rgb(63 174 230 / var(--tw-text-opacity, 1)); } .text-\[\#D24E6B\] { --tw-text-opacity: 1; color: rgb(210 78 107 / var(--tw-text-opacity, 1)); } .text-\[\#E12F42\] { --tw-text-opacity: 1; color: rgb(225 47 66 / var(--tw-text-opacity, 1)); } .text-\[\#ac0145\] { --tw-text-opacity: 1; color: rgb(172 1 69 / var(--tw-text-opacity, 1)); } .text-\[\#ca3123\] { --tw-text-opacity: 1; color: rgb(202 49 35 / var(--tw-text-opacity, 1)); } .text-\[\#f5c651\] { --tw-text-opacity: 1; color: rgb(245 198 81 / var(--tw-text-opacity, 1)); } .text-\[\#ff0000\] { --tw-text-opacity: 1; color: rgb(255 0 0 / var(--tw-text-opacity, 1)); } .text-black { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .text-blue { --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .text-blue-600 { --tw-text-opacity: 1; color: rgb(37 99 235 / var(--tw-text-opacity, 1)); } .text-blue-800 { --tw-text-opacity: 1; color: rgb(30 64 175 / var(--tw-text-opacity, 1)); } .text-blue-brand { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .text-blue-brand\/80 { color: rgb(66 106 247 / 0.8); } .text-blue-bright { --tw-text-opacity: 1; color: rgb(23 189 243 / var(--tw-text-opacity, 1)); } .text-blue-light { --tw-text-opacity: 1; color: rgb(184 220 232 / var(--tw-text-opacity, 1)); } .text-blue-ltl { --tw-text-opacity: 1; color: rgb(0 110 185 / var(--tw-text-opacity, 1)); } .text-blue-neon { --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } .text-blue-outlier { --tw-text-opacity: 1; color: rgb(53 171 229 / var(--tw-text-opacity, 1)); } .text-darkblue { --tw-text-opacity: 1; color: rgb(7 59 76 / var(--tw-text-opacity, 1)); } .text-gray-100 { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .text-gray-200 { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .text-gray-300 { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .text-gray-400 { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .text-gray-500 { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .text-gray-600 { --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .text-gray-700 { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .text-gray-800 { --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity, 1)); } .text-gray-900 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .text-green { --tw-text-opacity: 1; color: rgb(6 214 160 / var(--tw-text-opacity, 1)); } .text-green-600 { --tw-text-opacity: 1; color: rgb(22 163 74 / var(--tw-text-opacity, 1)); } .text-green-800 { --tw-text-opacity: 1; color: rgb(22 101 52 / var(--tw-text-opacity, 1)); } .text-orange-800 { --tw-text-opacity: 1; color: rgb(154 52 18 / var(--tw-text-opacity, 1)); } .text-orange-imagin8 { --tw-text-opacity: 1; color: rgb(241 98 52 / var(--tw-text-opacity, 1)); } .text-purple { --tw-text-opacity: 1; color: rgb(171 139 202 / var(--tw-text-opacity, 1)); } .text-red { --tw-text-opacity: 1; color: rgb(239 71 111 / var(--tw-text-opacity, 1)); } .text-red-500 { --tw-text-opacity: 1; color: rgb(239 68 68 / var(--tw-text-opacity, 1)); } .text-red\/60 { color: rgb(239 71 111 / 0.6); } .text-red\/75 { color: rgb(239 71 111 / 0.75); } .text-slate-500 { --tw-text-opacity: 1; color: rgb(100 116 139 / var(--tw-text-opacity, 1)); } .text-transparent { color: transparent; } .text-white { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .text-white\/30 { color: rgb(255 255 255 / 0.3); } .text-white\/80 { color: rgb(255 255 255 / 0.8); } .text-yellow { --tw-text-opacity: 1; color: rgb(255 209 102 / var(--tw-text-opacity, 1)); } .text-yellow-600 { --tw-text-opacity: 1; color: rgb(202 138 4 / var(--tw-text-opacity, 1)); } .text-yellow-700 { --tw-text-opacity: 1; color: rgb(161 98 7 / var(--tw-text-opacity, 1)); } .text-yellow-800 { --tw-text-opacity: 1; color: rgb(133 77 14 / var(--tw-text-opacity, 1)); } .text-opacity-50 { --tw-text-opacity: 0.5; } .text-opacity-70 { --tw-text-opacity: 0.7; } .text-opacity-80 { --tw-text-opacity: 0.8; } .underline { -webkit-text-decoration-line: underline; text-decoration-line: underline; } .line-through { -webkit-text-decoration-line: line-through; text-decoration-line: line-through; } .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .placeholder-gray-200::-moz-placeholder { --tw-placeholder-opacity: 1; color: rgb(229 231 235 / var(--tw-placeholder-opacity, 1)); } .placeholder-gray-200:-ms-input-placeholder { --tw-placeholder-opacity: 1; color: rgb(229 231 235 / var(--tw-placeholder-opacity, 1)); } .placeholder-gray-200::placeholder { --tw-placeholder-opacity: 1; color: rgb(229 231 235 / var(--tw-placeholder-opacity, 1)); } .placeholder-gray-400::-moz-placeholder { --tw-placeholder-opacity: 1; color: rgb(156 163 175 / var(--tw-placeholder-opacity, 1)); } .placeholder-gray-400:-ms-input-placeholder { --tw-placeholder-opacity: 1; color: rgb(156 163 175 / var(--tw-placeholder-opacity, 1)); } .placeholder-gray-400::placeholder { --tw-placeholder-opacity: 1; color: rgb(156 163 175 / var(--tw-placeholder-opacity, 1)); } .opacity-0 { opacity: 0; } .opacity-100 { opacity: 1; } .opacity-20 { opacity: 0.2; } .opacity-50 { opacity: 0.5; } .opacity-60 { opacity: 0.6; } .opacity-75 { opacity: 0.75; } .opacity-80 { opacity: 0.8; } .shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .shadow-2xl { --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .shadow-lg { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .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); } .shadow-sm { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .shadow-xl { --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .outline-none { outline: 2px solid transparent; outline-offset: 2px; } .outline { outline-style: solid; } .outline-0 { outline-width: 0px; } .outline-blue-brand { outline-color: #426AF7; } .outline-blue-neon { outline-color: #4fc3f7; } .blur { --tw-blur: blur(8px); 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); } .grayscale { --tw-grayscale: grayscale(100%); 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); } .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); } .backdrop-blur-\[1px\] { --tw-backdrop-blur: blur(1px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } .backdrop-blur-\[4px\] { --tw-backdrop-blur: blur(4px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } .backdrop-blur-sm { --tw-backdrop-blur: blur(4px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } .transition { transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-\[border-color\] { transition-property: border-color; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-colors { transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-opacity { transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-spacing { transition-property: padding, margin; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-transform { transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .delay-150 { transition-delay: 150ms; } .delay-200 { transition-delay: 200ms; } .delay-\[0\.3s\] { transition-delay: 0.3s; } .delay-\[400ms\] { transition-delay: 400ms; } .duration-0 { transition-duration: 0s; } .duration-100 { transition-duration: 100ms; } .duration-1000 { transition-duration: 1000ms; } .duration-150 { transition-duration: 150ms; } .duration-200 { transition-duration: 200ms; } .duration-300 { transition-duration: 300ms; } .duration-500 { transition-duration: 500ms; } .duration-700 { transition-duration: 700ms; } .duration-75 { transition-duration: 75ms; } .duration-\[\.3s\] { transition-duration: .3s; } .duration-\[\.4s\] { transition-duration: .4s; } .duration-\[\.6s\] { transition-duration: .6s; } .duration-\[0\.3s\] { transition-duration: 0.3s; } .duration-\[0\.4s\] { transition-duration: 0.4s; } .duration-\[0\.6s\] { transition-duration: 0.6s; } .duration-\[0\.8s\] { transition-duration: 0.8s; } .duration-\[3s\] { transition-duration: 3s; } .ease-\[cubic-bezier\(0\.16\2c 1\2c 0\.3\2c 1\)\] { transition-timing-function: cubic-bezier(0.16,1,0.3,1); } .ease-\[cubic-bezier\(0\.34\2c 1\.56\2c 0\.64\2c 1\)\] { transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } .ease-\[cubic-bezier\(0\.36\2c 0\2c 0\.66\2c -0\.56\)\] { transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } .ease-in { transition-timing-function: cubic-bezier(0.4, 0, 1, 1); } .ease-in-out { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .ease-out { transition-timing-function: cubic-bezier(0, 0, 0.2, 1); } @media only screen and (min-width: 640px){.left-container-right-padding{padding-right:calc( calc(calc(calc(100% - 640px) / 2) - calc(calc(100vw - 100%) / 2)) + 24px )}} @media only screen and (min-width: 768px){.left-container-right-padding{padding-right:calc( calc(calc(calc(100% - 768px) / 2) - calc(calc(100vw - 100%) / 2)) + 24px )}} @media only screen and (min-width: 1024px){.left-container-right-padding{padding-right:calc( calc(calc(calc(100% - 1024px) / 2) - calc(calc(100vw - 100%) / 2)) + 24px )}} @media only screen and (min-width: 1280px){.left-container-right-padding{padding-right:calc( calc(calc(calc(100% - 1280px) / 2) - calc(calc(100vw - 100%) / 2)) + 24px )}} @media only screen and (min-width: 1536px){.left-container-right-padding{padding-right:calc( calc(calc(calc(100% - 1536px) / 2) - calc(calc(100vw - 100%) / 2)) + 24px )}} .a-container { width: 100%; } @media (min-width: 640px) { .a-container { max-width: 640px; } } @media (min-width: 768px) { .a-container { max-width: 768px; } } @media (min-width: 1024px) { .a-container { max-width: 1024px; } } @media (min-width: 1280px) { .a-container { max-width: 1280px; } } @media (min-width: 1536px) { .a-container { max-width: 1536px; } } @media only screen and (min-width: 640px){.a-container{margin-left:calc( calc(calc(100% - 640px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media only screen and (min-width: 768px){.a-container{margin-left:calc( calc(calc(100% - 768px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media only screen and (min-width: 1024px){.a-container{margin-left:calc( calc(calc(100% - 1024px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media only screen and (min-width: 1280px){.a-container{margin-left:calc( calc(calc(100% - 1280px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media only screen and (min-width: 1536px){.a-container{margin-left:calc( calc(calc(100% - 1536px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media (min-width: 768px) { .a-container.topnav { padding-right: 1.5rem; } } .trix-content .attachment-gallery>action-text-attachment,.trix-content .attachment-gallery>.attachment{flex:1 0 33%;padding:0 .5em;max-width:33%} .trix-content .attachment-gallery.attachment-gallery--2>action-text-attachment,.trix-content .attachment-gallery.attachment-gallery--2>.attachment,.trix-content .attachment-gallery.attachment-gallery--4>action-text-attachment,.trix-content .attachment-gallery.attachment-gallery--4>.attachment{flex-basis:50%;max-width:50%} .trix-content action-text-attachment .attachment{padding:0 !important;max-width:100% !important} trix-editor h4{color:red} .trix-content h4{color:red} trix-editor{border:1px solid #bbb;border-radius:3px;margin:0;padding:.4em .6em;min-height:5em;outline:none} trix-toolbar *{box-sizing:border-box} trix-toolbar .trix-button-row{display:flex;flex-wrap:nowrap;justify-content:space-between;overflow-x:auto} trix-toolbar .trix-button-group{display:flex;margin-bottom:10px;border-radius:3px} trix-toolbar .trix-button-group:not(:first-child){margin-left:1.5vw} @media(max-device-width: 768px){trix-toolbar .trix-button-group:not(:first-child){margin-left:0}} trix-toolbar .trix-button-group-spacer{flex-grow:1} @media(max-device-width: 768px){trix-toolbar .trix-button-group-spacer{display:none}} trix-toolbar .trix-button{width:30px;position:relative;float:left;color:rgba(0,0,0,.6);font-size:.75em;font-weight:600;white-space:nowrap;padding:0 1em;margin:0;outline:none;border:none;border-radius:0;background:transparent} trix-toolbar .trix-button:not(:first-child){border-left:1px solid #e5e7eb} trix-toolbar .trix-button.trix-active{background:#cbeefa;color:#000} trix-toolbar .trix-button:not(:disabled){cursor:pointer} trix-toolbar .trix-button:disabled{color:rgba(0,0,0,.125)} @media(max-device-width: 768px){trix-toolbar .trix-button{letter-spacing:-0.01em;padding:0 .3em}} trix-toolbar .trix-button--icon{font-size:14px;text-indent:-9999px} @media(max-device-width: 768px){trix-toolbar .trix-button--icon{height:2em;max-width:calc(0.8em + 3.5vw)}} trix-toolbar .trix-button--icon::before{display:inline-block;position:absolute;top:0;right:0;bottom:0;left:0;opacity:.6;content:"";background-position:center;background-repeat:no-repeat;background-size:contain} @media(max-device-width: 768px){trix-toolbar .trix-button--icon::before{right:6%;left:6%}} trix-toolbar .trix-button--icon.trix-active::before{opacity:1} trix-toolbar .trix-button--icon:disabled::before{opacity:.125} trix-toolbar .trix-button--icon-attach::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M16.5%206v11.5a4%204%200%201%201-8%200V5a2.5%202.5%200%200%201%205%200v10.5a1%201%200%201%201-2%200V6H10v9.5a2.5%202.5%200%200%200%205%200V5a4%204%200%201%200-8%200v12.5a5.5%205.5%200%200%200%2011%200V6h-1.5z%22%2F%3E%3C%2Fsvg%3E);top:8%;bottom:4%} trix-toolbar .trix-button--icon-bold::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M15.6%2011.8c1-.7%201.6-1.8%201.6-2.8a4%204%200%200%200-4-4H7v14h7c2.1%200%203.7-1.7%203.7-3.8%200-1.5-.8-2.8-2.1-3.4zM10%207.5h3a1.5%201.5%200%201%201%200%203h-3v-3zm3.5%209H10v-3h3.5a1.5%201.5%200%201%201%200%203z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-italic::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M10%205v3h2.2l-3.4%208H6v3h8v-3h-2.2l3.4-8H18V5h-8z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-link::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M9.88%2013.7a4.3%204.3%200%200%201%200-6.07l3.37-3.37a4.26%204.26%200%200%201%206.07%200%204.3%204.3%200%200%201%200%206.06l-1.96%201.72a.91.91%200%201%201-1.3-1.3l1.97-1.71a2.46%202.46%200%200%200-3.48-3.48l-3.38%203.37a2.46%202.46%200%200%200%200%203.48.91.91%200%201%201-1.3%201.3z%22%2F%3E%3Cpath%20d%3D%22M4.25%2019.46a4.3%204.3%200%200%201%200-6.07l1.93-1.9a.91.91%200%201%201%201.3%201.3l-1.93%201.9a2.46%202.46%200%200%200%203.48%203.48l3.37-3.38c.96-.96.96-2.52%200-3.48a.91.91%200%201%201%201.3-1.3%204.3%204.3%200%200%201%200%206.07l-3.38%203.38a4.26%204.26%200%200%201-6.07%200z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-strike::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12.73%2014l.28.14c.26.15.45.3.57.44.12.14.18.3.18.5%200%20.3-.15.56-.44.75-.3.2-.76.3-1.39.3A13.52%2013.52%200%200%201%207%2014.95v3.37a10.64%2010.64%200%200%200%204.84.88c1.26%200%202.35-.19%203.28-.56.93-.37%201.64-.9%202.14-1.57s.74-1.45.74-2.32c0-.26-.02-.51-.06-.75h-5.21zm-5.5-4c-.08-.34-.12-.7-.12-1.1%200-1.29.52-2.3%201.58-3.02%201.05-.72%202.5-1.08%204.34-1.08%201.62%200%203.28.34%204.97%201l-1.3%202.93c-1.47-.6-2.73-.9-3.8-.9-.55%200-.96.08-1.2.26-.26.17-.38.38-.38.64%200%20.27.16.52.48.74.17.12.53.3%201.05.53H7.23zM3%2013h18v-2H3v2z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-quote::before{background-image:url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M6%2017h3l2-4V7H5v6h3zm8%200h3l2-4V7h-6v6h3z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-heading-1::before{background-image:url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12%209v3H9v7H6v-7H3V9h9zM8%204h14v3h-6v12h-3V7H8V4z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-code::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M18.2%2012L15%2015.2l1.4%201.4L21%2012l-4.6-4.6L15%208.8l3.2%203.2zM5.8%2012L9%208.8%207.6%207.4%203%2012l4.6%204.6L9%2015.2%205.8%2012z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-bullet-list::before{background-image:url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M4%204a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm0%206a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm0%206a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm4%203h14v-2H8v2zm0-6h14v-2H8v2zm0-8v2h14V5H8z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-number-list::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M2%2017h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1%203h1.8L2%2013.1v.9h3v-1H3.2L5%2010.9V10H2v1zm5-6v2h14V5H7zm0%2014h14v-2H7v2zm0-6h14v-2H7v2z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-undo::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12.5%208c-2.6%200-5%201-6.9%202.6L2%207v9h9l-3.6-3.6A8%208%200%200%201%2020%2016l2.4-.8a10.5%2010.5%200%200%200-10-7.2z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-redo::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M18.4%2010.6a10.5%2010.5%200%200%200-16.9%204.6L4%2016a8%208%200%200%201%2012.7-3.6L13%2016h9V7l-3.6%203.6z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-decrease-nesting-level::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M3%2019h19v-2H3v2zm7-6h12v-2H10v2zm-8.3-.3l2.8%202.9L6%2014.2%204%2012l2-2-1.4-1.5L1%2012l.7.7zM3%205v2h19V5H3z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-button--icon-increase-nesting-level::before{background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M3%2019h19v-2H3v2zm7-6h12v-2H10v2zm-6.9-1L1%2014.2l1.4%201.4L6%2012l-.7-.7-2.8-2.8L1%209.9%203.1%2012zM3%205v2h19V5H3z%22%2F%3E%3C%2Fsvg%3E)} trix-toolbar .trix-dialogs{position:relative} trix-toolbar .trix-dialog{position:absolute;top:0;left:0;right:0;font-size:.75em;padding:15px 10px;background:#fff;box-shadow:0 .3em 1em #ccc;border-top:2px solid #888;border-radius:5px;z-index:5} trix-toolbar .trix-input--dialog{font-size:inherit;font-weight:normal;padding:.5em .8em;margin:0 10px 0 0;border-radius:3px;background-color:#fff;box-shadow:none;outline:none;-webkit-appearance:none;-moz-appearance:none} trix-toolbar .trix-input--dialog.validate:invalid{box-shadow:red 0px 0px 1.5px 1px} trix-toolbar .trix-button--dialog{font-size:inherit;padding:.5em;border-bottom:none} trix-toolbar .trix-dialog--link{max-width:600px} trix-toolbar .trix-dialog__link-fields{display:flex;align-items:baseline} trix-toolbar .trix-dialog__link-fields .trix-input{flex:1} trix-toolbar .trix-dialog__link-fields .trix-button-group{flex:0 0 content;margin:0} trix-editor [data-trix-mutable]:not(.attachment__caption-editor){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} trix-editor [data-trix-mutable]::-moz-selection,trix-editor [data-trix-cursor-target]::-moz-selection,trix-editor [data-trix-mutable] ::-moz-selection{background:none} trix-editor [data-trix-mutable]::-moz-selection, trix-editor [data-trix-cursor-target]::-moz-selection, trix-editor [data-trix-mutable] ::-moz-selection{background:none} trix-editor [data-trix-mutable]::selection,trix-editor [data-trix-cursor-target]::selection,trix-editor [data-trix-mutable] ::selection{background:none} trix-editor [data-trix-mutable].attachment__caption-editor:focus::-moz-selection{background:highlight} trix-editor [data-trix-mutable].attachment__caption-editor:focus::selection{background:highlight} trix-editor [data-trix-mutable].attachment.attachment--file{box-shadow:0 0 0 2px highlight;border-color:transparent} trix-editor [data-trix-mutable].attachment img{box-shadow:0 0 0 2px highlight} trix-editor .attachment{position:relative} trix-editor .attachment:hover{cursor:default} trix-editor .attachment--preview .attachment__caption:hover{cursor:text} trix-editor .attachment__progress{position:absolute;z-index:1;height:20px;top:calc(50% - 10px);left:5%;width:90%;opacity:.9;transition:opacity 200ms ease-in} trix-editor .attachment__progress[value="100"]{opacity:0} trix-editor .attachment__caption-editor{display:inline-block;width:100%;margin:0;padding:0;font-size:inherit;font-family:inherit;line-height:inherit;color:inherit;text-align:center;vertical-align:top;border:none;outline:none;-webkit-appearance:none;-moz-appearance:none} trix-editor .attachment__toolbar{position:absolute;z-index:1;top:-0.9em;left:0;width:100%;text-align:center} trix-editor .trix-button-group{display:inline-flex} trix-editor .trix-button{position:relative;float:left;color:#666;white-space:nowrap;font-size:80%;padding:0 .8em;margin:0;outline:none;border:none;border-radius:0;background:transparent} trix-editor .trix-button.trix-active{background:#cbeefa} trix-editor .trix-button:not(:disabled){cursor:pointer} trix-editor .trix-button--remove{text-indent:-9999px;display:inline-block;padding:0;outline:none;width:1.8em;height:1.8em;line-height:1.8em;border-radius:50%;background-color:#fff;border:2px solid highlight;box-shadow:1px 1px 6px rgba(0,0,0,.25)} trix-editor .trix-button--remove::before{display:inline-block;position:absolute;top:0;right:0;bottom:0;left:0;opacity:.7;content:"";background-image:url(data:image/svg+xml,%3Csvg%20height%3D%2224%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19%206.4L17.6%205%2012%2010.6%206.4%205%205%206.4l5.6%205.6L5%2017.6%206.4%2019l5.6-5.6%205.6%205.6%201.4-1.4-5.6-5.6z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E);background-position:center;background-repeat:no-repeat;background-size:90%} trix-editor .trix-button--remove:hover{border-color:#333} trix-editor .trix-button--remove:hover::before{opacity:1} trix-editor .attachment__metadata-container{position:relative} trix-editor .attachment__metadata{position:absolute;left:50%;top:2em;transform:translate(-50%, 0);max-width:90%;padding:.1em .6em;font-size:.8em;color:#fff;background-color:rgba(0,0,0,.7);border-radius:3px} trix-editor .attachment__metadata .attachment__name{display:inline-block;max-width:100%;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} trix-editor .attachment__metadata .attachment__size{margin-left:.2em;white-space:nowrap} .trix-content{line-height:1.5} .trix-content *{box-sizing:border-box;margin:0;padding:0} .trix-content h1{font-size:1.2em;line-height:1.2} .trix-content blockquote{border:0 solid #ccc;border-left-width:.3em;margin-left:.3em;padding-left:.6em} .trix-content [dir=rtl] blockquote,.trix-content blockquote[dir=rtl]{border-width:0;border-right-width:.3em;margin-right:.3em;padding-right:.6em} .trix-content li{margin-left:1em} .trix-content [dir=rtl] li{margin-right:1em} .trix-content pre{display:inline-block;width:100%;vertical-align:top;font-family:monospace;font-size:.9em;padding:.5em;white-space:pre;background-color:#eee;overflow-x:auto} .trix-content img{max-width:100%;height:auto} .trix-content .attachment{display:inline-block;position:relative;max-width:100%} .trix-content .attachment a{color:inherit;text-decoration:none} .trix-content .attachment a:hover,.trix-content .attachment a:visited:hover{color:inherit} .trix-content .attachment__caption{text-align:center} .trix-content .attachment__caption .attachment__name+.attachment__size::before{content:" · "} .trix-content .attachment--preview{width:100%;text-align:center} .trix-content .attachment--preview .attachment__caption{color:#666;font-size:.9em;line-height:1.2} .trix-content .attachment--file{color:#333;line-height:1;margin:0 2px 2px 2px;padding:.4em 1em;border:1px solid #bbb;border-radius:5px} .trix-content .attachment-gallery{display:flex;flex-wrap:wrap;position:relative} .trix-content .attachment-gallery .attachment{flex:1 0 33%;padding:0 .5em;max-width:33%} .trix-content .attachment-gallery.attachment-gallery--2 .attachment,.trix-content .attachment-gallery.attachment-gallery--4 .attachment{flex-basis:50%;max-width:50%} .card,.review_questions,.early_review_card_questions,.assumed_known_card_questions,.new_card_questions{display:none} #study-interface.hide-sentences #ss-sentence-container { display: none; } #ss-sentence-container .ss-sentence { margin-top: 0.75rem; } @media (min-width: 1024px) { #ss-sentence-container .ss-sentence { margin-top: 1.5rem; } } #ss-sentence-container .ss-sentence:first-of-type { margin-top: 0px; } #study_session_body.settings-open { overflow-y: hidden; } @media (min-width: 768px) { #study_session_body.settings-open { padding-right: 20rem; } } #study_session_body,#ss-pause-overlay,#ss-settings-modal,#ss-questions-container,#response-buttons{transition:.15s cubic-bezier(0.12, 0.49, 0.08, 0.97)} #ss-settings-modal { top: 0px; right: 0px; display: none; } @media (min-width: 768px) { #ss-settings-modal { display: flex; --tw-translate-x: 100%; 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)); } } .ss-layout-option { height: 3rem; align-items: center; justify-content: center; border-radius: 0.25rem; border-width: 2px; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); padding: 0.5rem; } .ss-layout-option:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .ss-layout-option:hover { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } .ss-layout-option.selected,.ss-layout-option.select:hover { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .wide-device{width:68px;margin-right:10px} @media only screen and (min-width: 768px){.wide-device{margin-bottom:10px}} .mobile-device{width:42px;margin-right:10px} @media only screen and (min-width: 768px){.mobile-device{margin-bottom:10px}} .wide-device.norightmargin{margin-right:0} .mobile-device.norightmargin{margin-right:0} #study-interface .character-with-pinyin-aligned { margin-left: auto; margin-right: auto; } #study-interface .character-with-pinyin-aligned .character { font-size: 2.25rem; line-height: 2.5rem; font-weight: 300; } @media (min-width: 640px) { #study-interface .character-with-pinyin-aligned .character { font-size: 3rem; line-height: 1; } } @media(min-height: 800px){@media (min-width: 768px) { #study-interface .character-with-pinyin-aligned .character { font-size: 3.75rem; line-height: 1; } }} @media(min-height: 850px){@media (min-width: 1024px) { #study-interface .character-with-pinyin-aligned .character { font-size: 4.5rem; line-height: 1; } }} #study-interface .character-with-pinyin-aligned .pinyin { font-size: 1.5rem; line-height: 2rem; } @media (min-width: 640px) { #study-interface .character-with-pinyin-aligned .pinyin { font-size: 1.875rem; line-height: 2.25rem; } } @media (min-width: 1024px) { #study-interface .character-with-pinyin-aligned .pinyin { font-size: 2.25rem; line-height: 2.5rem; } } #ss-questions-container { display: none; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.8; line-height: 1.25rem; } #ss-questions-container:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { #ss-questions-container { line-height: 1.5; } } #question-response-container { position: fixed; bottom: 0px; left: 0px; display: flex; width: 100%; justify-content: center; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 200ms; } @media (min-width: 768px) { #question-response-container { transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } } .paused #question-response-container { pointer-events: none; } .layout-tablet #question-response-container { --tw-backdrop-blur: ; -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } @media (min-width: 768px) { .layout-auto #question-response-container { padding-left: 1.5rem; padding-right: 1.5rem; } .layout-desktop #question-response-container { padding-left: 1.5rem; padding-right: 1.5rem; } } #question-response-background { height: 100%; width: 100%; padding-top: 0.75rem; --tw-backdrop-blur: blur(8px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } @media (min-width: 768px) { #question-response-background { padding-top: 1rem; } } @media (min-width: 1024px) { #question-response-background { padding-top: 1.5rem; } } .layout-phone-lh #question-response-background { flex-direction: row; align-items: flex-start; } .layout-phone-rh #question-response-background { flex-direction: row; align-items: flex-start; } #question-container { display: flex; width: 100%; flex-direction: column; text-align: center; } .layout-tablet #question-container { position: absolute; bottom: 0px; padding-top: 1.5rem; } .layout-phone-lh #question-container { width: 100%; flex-grow: 1; text-align: center; } .layout-phone-rh #question-container { width: 100%; flex-grow: 1; text-align: center; } .hard-word-notice { position: absolute; bottom: 0px; left: 0px; margin-bottom: 0.5rem; width: 100%; text-align: center; font-size: 0.875rem; line-height: 1.25rem; --tw-text-opacity: 1; color: rgb(239 71 111 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .hard-word-notice { font-size: 1rem; line-height: 1.5rem; } } .layout-phone-lh .hard-word-notice { position: static; margin-bottom: 0px; } .layout-phone-rh .hard-word-notice { position: static; margin-bottom: 0px; } #shortcut-legend { pointer-events: none; position: absolute; bottom: 0px; right: 0px; margin-right: 1.5rem; margin-bottom: 1.5rem; font-size: 0.75rem; line-height: 1rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } #shortcut-legend:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .layout-tablet #shortcut-legend { bottom: 292px; } #face-container { transition-duration: 200ms; } @media (min-width: 768px) { #face-container { transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } .paused #face-container { transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } } .paused #question-response-container { opacity: 0; transition-duration: 200ms; } @media (min-width: 768px) { .paused #question-response-container { opacity: 1; transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } .settings-open #question-response-container { padding-right: 344px; } } .editing #question-response-container { padding-left: 600px; transition-duration: 200ms; } @media (min-width: 768px) { .editing #question-response-container { transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } .editing #face-container { transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } } .editing #shortcut-legend { --tw-translate-x: 100%; 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)); opacity: 0; transition-duration: 200ms; } @media (min-width: 768px) { .editing #shortcut-legend { transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } } #study-interface #word-display { margin-top: 3.5rem; display: none; width: 100%; flex-direction: column; align-items: center; justify-content: center; } @media(min-height: 800px){@media (min-width: 768px) { #study-interface #word-display { margin-top: 6rem; } }#study-interface.ss-layout-zen #word-display { margin-top: 5rem; }@media (min-width: 768px) { #study-interface.ss-layout-zen #word-display { margin-top: 9rem; } }} #success-pixels,#fail-pixels,#new-word-pixels,#assumed-pixels { z-index: 10; margin-right: 1px; display: flex; flex-direction: column; justify-content: flex-end;transition:.5s; } #success-pixels .pixel div,#new-word-pixels .pixel div,#fail-pixels .pixel div,#assumed-pixels .pixel div{transition:.5s;width:4px;height:4px;border-radius:999px} #success-pixels .pixel-container:nth-last-of-type(5n + 1),#new-word-pixels .pixel-container:nth-last-of-type(5n + 1),#fail-pixels .pixel-container:nth-last-of-type(5n + 1),#assumed-pixels .pixel-container:nth-last-of-type(5n + 1){padding-bottom:8px} #success-pixels .pixel-container:last-of-type,#new-word-pixels .pixel-container:last-of-type,#fail-pixels .pixel-container:last-of-type,#assumed-pixels .pixel-container:last-of-type { padding-bottom: 0px; } #success-pixels .pixel div { background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.5; } #success-pixels .pixel div:is(.dark *) { --tw-bg-opacity: 1; } #assumed-pixels .pixel div { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } #new-word-pixels .pixel div { background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.5; } #new-word-pixels .pixel div:is(.dark *) { --tw-bg-opacity: 1; } #fail-pixels .pixel div { background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.5; } #fail-pixels .pixel div:is(.dark *) { --tw-bg-opacity: 1; } #fail-pixels .pixel.revenge { border-radius: 9999px; border-width: 1px; border-color: rgb(6 214 160 / var(--tw-border-opacity, 1)); --tw-border-opacity: 0.8; } #fail-pixels .pixel.revenge:is(.dark *) { --tw-border-opacity: 1; } #fail-pixels .pixel.revenge div { border-width: 1px; border-color: rgb(6 214 160 / var(--tw-border-opacity, 1)); --tw-border-opacity: 0.5; } #fail-pixels .pixel.revenge div:is(.dark *) { --tw-border-opacity: 0; } #success-pixels .pixel,#fail-pixels .pixel,#assumed-pixels .pixel,#new-word-pixels .pixel { border-width: 1px; border-color: transparent; padding: 1px; } .fire1,.fire2,.fire3{filter:blur(0.02em);position:absolute;bottom:0;width:.9em;z-index:0;left:0} .fire1{font-size:18px;height:2em;left:-2px} .fire2{font-size:30px;height:5em;left:-7px} .fire3{font-size:48px;height:9em;left:-15px} .fire1 .particle,.fire2 .particle,.fire3 .particle{z-index:5;-webkit-animation:rise 1s ease-in infinite;animation:rise 1s ease-in infinite;border-radius:50%;mix-blend-mode:screen;opacity:0;position:absolute;bottom:0;width:.7em;height:.7em} .fire1 .particle:nth-of-type(1),.fire2 .particle:nth-of-type(1),.fire3 .particle:nth-of-type(1){-webkit-animation-delay:.5990746544s;animation-delay:.5990746544s;left:calc((100% - 0.7em) * 0)} .fire1 .particle:nth-of-type(2),.fire2 .particle:nth-of-type(2),.fire3 .particle:nth-of-type(2){-webkit-animation-delay:.9282663507s;animation-delay:.9282663507s;left:calc((100% - 0.7em) * 0.02)} .fire1 .particle:nth-of-type(3),.fire2 .particle:nth-of-type(3),.fire3 .particle:nth-of-type(3){-webkit-animation-delay:.1580281435s;animation-delay:.1580281435s;left:calc((100% - 0.7em) * 0.04)} .fire1 .particle:nth-of-type(4),.fire2 .particle:nth-of-type(4),.fire3 .particle:nth-of-type(4){-webkit-animation-delay:.222486645s;animation-delay:.222486645s;left:calc((100% - 0.7em) * 0.06)} .fire1 .particle:nth-of-type(5),.fire2 .particle:nth-of-type(5),.fire3 .particle:nth-of-type(5){-webkit-animation-delay:.931060202s;animation-delay:.931060202s;left:calc((100% - 0.7em) * 0.08)} .fire1 .particle:nth-of-type(6),.fire2 .particle:nth-of-type(6),.fire3 .particle:nth-of-type(6){-webkit-animation-delay:.2354280159s;animation-delay:.2354280159s;left:calc((100% - 0.7em) * 0.1)} .fire1 .particle:nth-of-type(7),.fire2 .particle:nth-of-type(7),.fire3 .particle:nth-of-type(7){-webkit-animation-delay:.6767093056s;animation-delay:.6767093056s;left:calc((100% - 0.7em) * 0.12)} .fire1 .particle:nth-of-type(8),.fire2 .particle:nth-of-type(8),.fire3 .particle:nth-of-type(8){-webkit-animation-delay:.3554994571s;animation-delay:.3554994571s;left:calc((100% - 0.7em) * 0.14)} .fire1 .particle:nth-of-type(9),.fire2 .particle:nth-of-type(9),.fire3 .particle:nth-of-type(9){-webkit-animation-delay:.5005135837s;animation-delay:.5005135837s;left:calc((100% - 0.7em) * 0.16)} .fire1 .particle:nth-of-type(10),.fire2 .particle:nth-of-type(10),.fire3 .particle:nth-of-type(10){-webkit-animation-delay:.1599682257s;animation-delay:.1599682257s;left:calc((100% - 0.7em) * 0.18)} .fire1 .particle:nth-of-type(11),.fire2 .particle:nth-of-type(11),.fire3 .particle:nth-of-type(11){-webkit-animation-delay:.2485754407s;animation-delay:.2485754407s;left:calc((100% - 0.7em) * 0.2)} .fire1 .particle:nth-of-type(12),.fire2 .particle:nth-of-type(12),.fire3 .particle:nth-of-type(12){-webkit-animation-delay:.8657071082s;animation-delay:.8657071082s;left:calc((100% - 0.7em) * 0.22)} .fire1 .particle:nth-of-type(13),.fire2 .particle:nth-of-type(13),.fire3 .particle:nth-of-type(13){-webkit-animation-delay:.7576597815s;animation-delay:.7576597815s;left:calc((100% - 0.7em) * 0.24)} .fire1 .particle:nth-of-type(14),.fire2 .particle:nth-of-type(14),.fire3 .particle:nth-of-type(14){-webkit-animation-delay:.8204250577s;animation-delay:.8204250577s;left:calc((100% - 0.7em) * 0.26)} .fire1 .particle:nth-of-type(15),.fire2 .particle:nth-of-type(15),.fire3 .particle:nth-of-type(15){-webkit-animation-delay:.3939424893s;animation-delay:.3939424893s;left:calc((100% - 0.7em) * 0.28)} .fire1 .particle:nth-of-type(16),.fire2 .particle:nth-of-type(16),.fire3 .particle:nth-of-type(16){-webkit-animation-delay:.1728010546s;animation-delay:.1728010546s;left:calc((100% - 0.7em) * 0.3)} .fire1 .particle:nth-of-type(17),.fire2 .particle:nth-of-type(17),.fire3 .particle:nth-of-type(17){-webkit-animation-delay:.6017225752s;animation-delay:.6017225752s;left:calc((100% - 0.7em) * 0.32)} .fire1 .particle:nth-of-type(18),.fire2 .particle:nth-of-type(18),.fire3 .particle:nth-of-type(18){-webkit-animation-delay:.0716692559s;animation-delay:.0716692559s;left:calc((100% - 0.7em) * 0.34)} .fire1 .particle:nth-of-type(19),.fire2 .particle:nth-of-type(19),.fire3 .particle:nth-of-type(19){-webkit-animation-delay:.2942142772s;animation-delay:.2942142772s;left:calc((100% - 0.7em) * 0.36)} .fire1 .particle:nth-of-type(20),.fire2 .particle:nth-of-type(20),.fire3 .particle:nth-of-type(20){-webkit-animation-delay:.3602629176s;animation-delay:.3602629176s;left:calc((100% - 0.7em) * 0.38)} .fire1 .particle:nth-of-type(21),.fire2 .particle:nth-of-type(21),.fire3 .particle:nth-of-type(21){-webkit-animation-delay:.4603737389s;animation-delay:.4603737389s;left:calc((100% - 0.7em) * 0.4)} .fire1 .particle:nth-of-type(22),.fire2 .particle:nth-of-type(22),.fire3 .particle:nth-of-type(22){-webkit-animation-delay:.9613355231s;animation-delay:.9613355231s;left:calc((100% - 0.7em) * 0.42)} .fire1 .particle:nth-of-type(23),.fire2 .particle:nth-of-type(23),.fire3 .particle:nth-of-type(23){-webkit-animation-delay:.8212611099s;animation-delay:.8212611099s;left:calc((100% - 0.7em) * 0.44)} .fire1 .particle:nth-of-type(24),.fire2 .particle:nth-of-type(24),.fire3 .particle:nth-of-type(24){-webkit-animation-delay:.8478124083s;animation-delay:.8478124083s;left:calc((100% - 0.7em) * 0.46)} .fire1 .particle:nth-of-type(25),.fire2 .particle:nth-of-type(25),.fire3 .particle:nth-of-type(25){-webkit-animation-delay:.4650858718s;animation-delay:.4650858718s;left:calc((100% - 0.7em) * 0.48)} .fire1 .particle:nth-of-type(26),.fire2 .particle:nth-of-type(26),.fire3 .particle:nth-of-type(26){-webkit-animation-delay:.2155736182s;animation-delay:.2155736182s;left:calc((100% - 0.7em) * 0.5)} .fire1 .particle:nth-of-type(27),.fire2 .particle:nth-of-type(27),.fire3 .particle:nth-of-type(27){-webkit-animation-delay:.6745266423s;animation-delay:.6745266423s;left:calc((100% - 0.7em) * 0.52)} .fire1 .particle:nth-of-type(28),.fire2 .particle:nth-of-type(28),.fire3 .particle:nth-of-type(28){-webkit-animation-delay:.4259981353s;animation-delay:.4259981353s;left:calc((100% - 0.7em) * 0.54)} .fire1 .particle:nth-of-type(29),.fire2 .particle:nth-of-type(29),.fire3 .particle:nth-of-type(29){-webkit-animation-delay:.1646634237s;animation-delay:.1646634237s;left:calc((100% - 0.7em) * 0.56)} .fire1 .particle:nth-of-type(30),.fire2 .particle:nth-of-type(30),.fire3 .particle:nth-of-type(30){-webkit-animation-delay:.2323067883s;animation-delay:.2323067883s;left:calc((100% - 0.7em) * 0.58)} .fire1 .particle:nth-of-type(31),.fire2 .particle:nth-of-type(31),.fire3 .particle:nth-of-type(31){-webkit-animation-delay:.749950879s;animation-delay:.749950879s;left:calc((100% - 0.7em) * 0.6)} .fire1 .particle:nth-of-type(32),.fire2 .particle:nth-of-type(32),.fire3 .particle:nth-of-type(32){-webkit-animation-delay:.5789546952s;animation-delay:.5789546952s;left:calc((100% - 0.7em) * 0.62)} .fire1 .particle:nth-of-type(33),.fire2 .particle:nth-of-type(33),.fire3 .particle:nth-of-type(33){-webkit-animation-delay:.5219563923s;animation-delay:.5219563923s;left:calc((100% - 0.7em) * 0.64)} .fire1 .particle:nth-of-type(34),.fire2 .particle:nth-of-type(34),.fire3 .particle:nth-of-type(34){-webkit-animation-delay:.6075029623s;animation-delay:.6075029623s;left:calc((100% - 0.7em) * 0.66)} .fire1 .particle:nth-of-type(35),.fire2 .particle:nth-of-type(35),.fire3 .particle:nth-of-type(35){-webkit-animation-delay:.8229005012s;animation-delay:.8229005012s;left:calc((100% - 0.7em) * 0.68)} .fire1 .particle:nth-of-type(36),.fire2 .particle:nth-of-type(36),.fire3 .particle:nth-of-type(36){-webkit-animation-delay:.1158128686s;animation-delay:.1158128686s;left:calc((100% - 0.7em) * 0.7)} .fire1 .particle:nth-of-type(37),.fire2 .particle:nth-of-type(37),.fire3 .particle:nth-of-type(37){-webkit-animation-delay:.5637536141s;animation-delay:.5637536141s;left:calc((100% - 0.7em) * 0.72)} .fire1 .particle:nth-of-type(38),.fire2 .particle:nth-of-type(38),.fire3 .particle:nth-of-type(38){-webkit-animation-delay:.295230487s;animation-delay:.295230487s;left:calc((100% - 0.7em) * 0.74)} .fire1 .particle:nth-of-type(39),.fire2 .particle:nth-of-type(39),.fire3 .particle:nth-of-type(39){-webkit-animation-delay:.921301669s;animation-delay:.921301669s;left:calc((100% - 0.7em) * 0.76)} .fire1 .particle:nth-of-type(40),.fire2 .particle:nth-of-type(40),.fire3 .particle:nth-of-type(40){-webkit-animation-delay:.7813628043s;animation-delay:.7813628043s;left:calc((100% - 0.7em) * 0.78)} .fire1 .particle:nth-of-type(41),.fire2 .particle:nth-of-type(41),.fire3 .particle:nth-of-type(41){-webkit-animation-delay:.2565962139s;animation-delay:.2565962139s;left:calc((100% - 0.7em) * 0.8)} .fire1 .particle:nth-of-type(42),.fire2 .particle:nth-of-type(42),.fire3 .particle:nth-of-type(42){-webkit-animation-delay:.4481857065s;animation-delay:.4481857065s;left:calc((100% - 0.7em) * 0.82)} .fire1 .particle:nth-of-type(43),.fire2 .particle:nth-of-type(43),.fire3 .particle:nth-of-type(43){-webkit-animation-delay:.2960139952s;animation-delay:.2960139952s;left:calc((100% - 0.7em) * 0.84)} .fire1 .particle:nth-of-type(44),.fire2 .particle:nth-of-type(44),.fire3 .particle:nth-of-type(44){-webkit-animation-delay:.9653660817s;animation-delay:.9653660817s;left:calc((100% - 0.7em) * 0.86)} .fire1 .particle:nth-of-type(45),.fire2 .particle:nth-of-type(45),.fire3 .particle:nth-of-type(45){-webkit-animation-delay:.4359543671s;animation-delay:.4359543671s;left:calc((100% - 0.7em) * 0.88)} .fire1 .particle:nth-of-type(46),.fire2 .particle:nth-of-type(46),.fire3 .particle:nth-of-type(46){-webkit-animation-delay:.5887079043s;animation-delay:.5887079043s;left:calc((100% - 0.7em) * 0.9)} .fire1 .particle:nth-of-type(47),.fire2 .particle:nth-of-type(47),.fire3 .particle:nth-of-type(47){-webkit-animation-delay:.2560513153s;animation-delay:.2560513153s;left:calc((100% - 0.7em) * 0.92)} .fire1 .particle:nth-of-type(48),.fire2 .particle:nth-of-type(48),.fire3 .particle:nth-of-type(48){-webkit-animation-delay:.2665737444s;animation-delay:.2665737444s;left:calc((100% - 0.7em) * 0.94)} .fire1 .particle:nth-of-type(49),.fire2 .particle:nth-of-type(49),.fire3 .particle:nth-of-type(49){-webkit-animation-delay:.9179754732s;animation-delay:.9179754732s;left:calc((100% - 0.7em) * 0.96)} .fire1 .particle:nth-of-type(50),.fire2 .particle:nth-of-type(50),.fire3 .particle:nth-of-type(50){-webkit-animation-delay:.1838710057s;animation-delay:.1838710057s;left:calc((100% - 0.7em) * 0.98)} .fire1 .particle{background-image:radial-gradient(#ffd166 20%, #ef476f 70%)} .fire2 .particle{background-image:radial-gradient(#ef476f 20%, #ffd166 70%)} .fire3 .particle{background-image:radial-gradient(#ef476f 20%, orange 70%)} @-webkit-keyframes rise{from{opacity:0;transform:translateY(0) scale(1)}25%{opacity:1}to{opacity:0;transform:translateY(-5em) scale(0)}} @keyframes rise{from{opacity:0;transform:translateY(0) scale(1)}25%{opacity:1}to{opacity:0;transform:translateY(-5em) scale(0)}} .ss-toggle { display: flex; height: 1rem; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; align-items: center; font-size: 0.875rem; line-height: 1.25rem; } .ss-toggle.mobile { display: none; } @media (min-width: 768px) { .ss-toggle.mobile { display: flex; } } .ss-toggle>div { position: relative; display: flex; height: 100%; width: 1.75rem; align-items: center; border-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); padding: 2px; } .ss-toggle>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .ss-toggle>div>div { margin-left: 0px; height: 0.75rem; width: 0.75rem; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .ss-toggle>div>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .ss-toggle.toggle-on>div { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .ss-toggle.toggle-on>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .ss-toggle.toggle-on>div>div { margin-left: 0.75rem; } .ss-toggle div { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 100ms; transition-timing-function: cubic-bezier(0.4, 0, 1, 1); } .ss-hotkey { display: flex; height: 1.25rem; width: 1.25rem; align-items: center; justify-content: center; border-radius: 0.25rem; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .ss-hotkey:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .ss-hotkey-nocolor { display: flex; height: 1.25rem; width: 1.25rem; align-items: center; justify-content: center; border-radius: 0.25rem; } .ss-hotkey.spacebar { height: 1rem; width: 3.5rem; } .dynamic-timer .timer-font{font-family:"Roboto Mono",monospace} .layout-svg{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7px} .ar-tooltip { position: absolute; top: 0px; left: 0px; margin-top: 1.75rem; display: none; width: 100%; text-align: center; font-size: 0.75rem; line-height: 1rem; font-weight: 700; --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .group:hover .ar-tooltip { display: block; } #positive-response-button div,#negative-response-button div { display: flex; height: 5rem; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; align-items: center; justify-content: center; border-radius: 0.75rem; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } #positive-response-button div:hover,#negative-response-button div:hover { --tw-bg-opacity: 0.9; } #positive-response-button div:active,#negative-response-button div:active { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } #negative-response-button div { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } #negative-response-button div:active { --tw-shadow-color: #ffd166; --tw-shadow: var(--tw-shadow-colored); } #positive-response-button div { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } #positive-response-button div:active { --tw-shadow-color: #06d6a0; --tw-shadow: var(--tw-shadow-colored); } #replay-buttons { position: relative; display: grid; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; grid-template-columns: repeat(1, minmax(0, 1fr)); justify-content: center; gap: 0.5rem; font-size: 0.75rem; line-height: 1rem; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 1000ms; } @media (min-width: 1024px) { #replay-buttons { font-size: 0.875rem; line-height: 1.25rem; } } .layout-desktop #replay-buttons { grid-template-columns: repeat(1, minmax(0, 1fr)); } #response-buttons { margin-left: auto; margin-right: auto; } .layout-auto #response-buttons { display: grid; width: 480px; grid-template-columns: repeat(6, minmax(0, 1fr));; gap: 0.75rem; } @media (min-width: 1024px) { .layout-auto #response-buttons { width: 600px; } } .layout-desktop #response-buttons { display: grid; width: 480px; grid-template-columns: repeat(6, minmax(0, 1fr));; gap: 0.75rem; } @media (min-width: 1024px) { .layout-desktop #response-buttons { width: 600px; } } .layout-auto #positive-response-button { grid-column: span 2 / span 2; } .layout-desktop #positive-response-button { grid-column: span 2 / span 2; } .layout-auto #negative-response-button { grid-column: span 2 / span 2; } .layout-desktop #negative-response-button { grid-column: span 2 / span 2; } .layout-auto #replay-audio-buttons-label { top: -24px; } .layout-desktop #replay-audio-buttons-label { top: -24px; } .response-button.positive { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .response-button.negative { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .layout-zen #response-buttons { display: none; } .layout-tablet #response-buttons { display: none; } #advanced-responses { margin-left: auto; margin-right: auto; display: none; } .layout-desktop #advanced-responses { display: flex; } @media (min-width: 768px) { .layout-desktop #advanced-responses { padding-bottom: 3rem; } .layout-auto #advanced-responses { display: flex; padding-bottom: 3rem; } } #response-buttons { display: none; } @media (min-width: 768px) { #response-buttons { display: flex; } } #mobile-response-buttons .response-button { display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 0.75rem; text-align: center; } #mobile-response-buttons .response-button.tablet-only { display: none; } .layout-tablet #mobile-response-buttons .response-button.tablet-only { display: flex; } #mobile-response-buttons .advanced-responses { font-size: 0.875rem; line-height: 1.25rem; } @media (min-width: 370px) { #mobile-response-buttons .advanced-responses { font-size: 1rem; line-height: 1.5rem; } } .other-actions .response-button { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .other-actions .response-button:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .other-actions .response-button.hide-more { border-width: 2px; --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.1; --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } #mobile-response-buttons { display: none; flex-shrink: 0; font-size: 0.75rem; line-height: 1rem; } .layout-tablet #mobile-response-buttons { display: flex; display: grid; width: 100%; flex-direction: row; background-color: transparent; } .layout-auto #mobile-response-buttons { margin-bottom: 8px; display: grid; width: 100%; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 8px; padding-left: 8px; padding-right: 8px; } @media (min-width: 768px) { .layout-auto #mobile-response-buttons { display: none; } } .layout-phone-classic #mobile-response-buttons { margin-bottom: 8px; display: grid; width: 100%; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 8px; padding-left: 8px; padding-right: 8px; } .layout-phone-lh #mobile-response-buttons { order: -1; margin-bottom: 8px; margin-right: auto; display: grid; width: 60%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding-left: 8px; padding-right: 8px; } .layout-phone-rh #mobile-response-buttons { margin-bottom: 8px; margin-left: auto; display: grid; width: 60%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding-left: 8px; padding-right: 8px; } .regular-responses { position: absolute; z-index: 10; width: 100%; font-size: 1.125rem; line-height: 1.75rem; font-weight: 700; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 200ms; } @media (min-width: 768px) { .regular-responses { font-size: 1.25rem; line-height: 1.75rem; } } .layout-tablet .regular-responses { bottom: 0px; display: flex; width: 100%; justify-content: space-between; padding-left: 8px; padding-right: 8px; padding-bottom: 8px; } .layout-auto .regular-responses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .layout-phone-classic .regular-responses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .layout-phone-lh .regular-responses { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 8px; } .layout-phone-rh .regular-responses { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 8px; } .layout-tablet .advanced-responses { margin-left: auto; margin-right: 116px; margin-bottom: 8px; display: grid; height: 220px; width: 100px; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 8px; } .layout-auto .advanced-responses { grid-column: span 2 / span 2; display: grid; height: 100%; grid-template-columns: repeat(4, minmax(0, 1fr));; } .layout-phone-classic .advanced-responses { grid-column: span 2 / span 2; display: grid; height: 100%; grid-template-columns: repeat(4, minmax(0, 1fr));; } .layout-phone-lh .advanced-responses { position: relative; left: 3px; display: grid; height: 100%; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 2px; padding-top: 4px; padding-bottom: 4px; } .layout-phone-rh .advanced-responses { position: relative; right: 3px; display: grid; height: 100%; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 2px; padding-top: 4px; padding-bottom: 4px; } .layout-tablet .other-actions { position: absolute; bottom: 236px; display: flex; width: 100%; } .layout-tablet .other-actions > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(8px * var(--tw-space-x-reverse)); margin-left: calc(8px * calc(1 - var(--tw-space-x-reverse))); } .layout-tablet .other-actions { padding-left: 8px; padding-right: 8px; } .layout-tablet.settings-open .other-actions { padding-right: 328px; } .layout-auto .other-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));; gap: 8px; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .layout-auto .other-actions:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .layout-phone-classic .other-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));; gap: 8px; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .layout-phone-classic .other-actions:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .layout-phone-lh .other-actions { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 8px; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .layout-phone-lh .other-actions:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .layout-phone-rh .other-actions { order: -9999; display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 8px; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .layout-phone-rh .other-actions:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .other-actions-tablet-spacer { display: none; } .layout-tablet .other-actions-tablet-spacer { display: flex; flex-grow: 1; } .layout-auto .regular-responses .response-button { height: 80px; } .layout-phone-classic .regular-responses .response-button { height: 80px; } .layout-tablet .regular-responses .response-button { height: 220px; width: 100px; } .layout-phone-lh .regular-responses .response-button { height: 120px; } .layout-phone-rh .regular-responses .response-button { height: 120px; } .layout-phone-lh .regular-responses .response-button.studying { height: 248px; } .layout-phone-rh .regular-responses .response-button.studying { height: 248px; } #mobile-response-buttons .advanced-responses .response-button { align-self: center; --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .layout-tablet .advanced-responses .response-button { height: 68px; width: 100%; } .layout-tablet #mobile-response-buttons .advanced-responses .response-button.undo { display: none; } .layout-phone-classic .advanced-responses .response-button { height: 80px; } .layout-auto .advanced-responses .response-button { height: 80px; } .layout-phone-lh .advanced-responses .response-button { height: 56px; } .layout-phone-rh .advanced-responses .response-button { height: 56px; } .layout-phone-classic .advanced-responses .response-button { --tw-scale-x: .75; --tw-scale-y: .75; 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)); } .layout-auto .advanced-responses .response-button { --tw-scale-x: .75; --tw-scale-y: .75; 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)); } .layout-phone-lh .advanced-responses .response-button { --tw-scale-x: .75; --tw-scale-y: .75; 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)); } .layout-phone-rh .advanced-responses .response-button { --tw-scale-x: .75; --tw-scale-y: .75; 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)); } .layout-phone-classic .advanced-responses.show-advanced-responses .response-button { --tw-scale-x: .9; --tw-scale-y: .9; 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)); } .layout-auto .advanced-responses.show-advanced-responses .response-button { --tw-scale-x: .9; --tw-scale-y: .9; 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)); } .layout-phone-lh .advanced-responses.show-advanced-responses .response-button { --tw-scale-x: .9; --tw-scale-y: .9; 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)); } .layout-phone-rh .advanced-responses.show-advanced-responses .response-button { --tw-scale-x: .9; --tw-scale-y: .9; 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)); } .layout-tablet .other-actions .response-button { height: 56px; width: 100px; } .layout-auto .other-actions .response-button { height: 56px; } .layout-phone-classic .other-actions .response-button { height: 56px; } .layout-phone-lh .other-actions .response-button { height: 56px; padding-top: 0.75rem; padding-bottom: 0.75rem; } .layout-phone-rh .other-actions .response-button { height: 56px; padding-top: 0.75rem; padding-bottom: 0.75rem; } .layout-phone-lh .other-actions .settings { order: 4; } .layout-phone-rh .other-actions .settings { order: 4; } .layout-phone-lh .other-actions .show-more { order: 3; } .layout-phone-lh .other-actions .hide-more { order: 3; } .layout-phone-rh .other-actions .show-more { order: 3; } .layout-phone-rh .other-actions .hide-more { order: 3; } .layout-phone-lh .other-actions .word { order: 2; } .layout-phone-rh .other-actions .word { order: 2; } .layout-phone-lh .other-actions .sentence { order: 1; } .layout-phone-rh .other-actions .sentence { order: 1; } .layout-tablet #mobile-response-buttons .other-actions .show-more { display: none; } .layout-phone-lh .negative { order: 2; } .layout-phone-rh .negative { order: 2; } .layout-phone-lh .positive { order: 1; } .layout-phone-rh .positive { order: 1; } .layout-phone-lh .undo { order: 4; } .layout-phone-rh .undo { order: 4; } .layout-phone-lh .block { order: 3; } .layout-phone-rh .block { order: 3; } .layout-tablet .block { order: 3; } .layout-phone-lh .boost { order: 2; } .layout-phone-rh .boost { order: 2; } .layout-tablet .boost { order: 2; } .layout-phone-lh .forever { order: 1; } .layout-phone-rh .forever { order: 1; } .layout-tablet .forever { order: 1; } .lh-rh-tablet-break { display: none; } .layout-tablet .lh-rh-tablet-break { display: inline; } .layout-phone-lh .lh-rh-tablet-break { display: inline; } .layout-phone-rh .lh-rh-tablet-break { display: inline; } .uncover-advanced-responses { pointer-events: none; } .layout-phone-lh .uncover-advanced-responses { right: 3px; --tw-translate-x: -100%; 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)); } .layout-phone-rh .uncover-advanced-responses { left: 3px; --tw-translate-x: 100%; 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)); } .layout-auto .uncover-advanced-responses div.negative { position: relative; right: 3px; --tw-translate-x: -100%; 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)); } .layout-phone-classic .uncover-advanced-responses div.negative { position: relative; right: 3px; --tw-translate-x: -100%; 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)); } .layout-auto .uncover-advanced-responses div.positive { position: relative; left: 3px; --tw-translate-x: 100%; 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)); } .layout-phone-classic .uncover-advanced-responses div.positive { position: relative; left: 3px; --tw-translate-x: 100%; 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)); } .layout-auto .uncover-advanced-responses div.studying { position: relative; left: 3px; --tw-translate-x: 100%; 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)); } .layout-phone-classic .uncover-advanced-responses div.studying { position: relative; left: 3px; --tw-translate-x: 100%; 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)); } .layout-auto .prime-response-space { height: 80px; } .layout-phone-classic .prime-response-space { height: 80px; } .layout-auto #response-buttons { display: none; } @media (min-width: 768px) { .layout-auto #response-buttons { display: grid; } } .layout-phone-classic #response-buttons { display: none; } .layout-phone-lh #response-buttons { display: none; } .layout-phone-rh #response-buttons { display: none; } .shortcut-hint { pointer-events: none; display: flex; height: 1.5rem; width: 1.5rem; align-items: center; justify-content: center; border-radius: 0.125rem; --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); font-size: 0.75rem; line-height: 1rem; } .react-fade-in{opacity:1;transition:all 250ms linear} .react-fade-out{opacity:0;transition:all 250ms linear 2s} .s-4 { letter-spacing: -.10em; } .s-5 { letter-spacing: -.12em; } .s-6 { letter-spacing: -.14em; } .ss-character,.ss-pinyin,.ss-english { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .ss-character:is(.dark *),.ss-pinyin:is(.dark *),.ss-english:is(.dark *) { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .ss-english { margin-right: 0.5rem; margin-bottom: 0.5rem; border-radius: 0.5rem; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); padding-left: 0.5rem; padding-right: 0.5rem; --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .ss-english:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .ss-english { margin-right: 0.75rem; } } @media (min-width: 1024px) { .ss-english { margin-bottom: 0.75rem; } } .shadow-user-word-note { height: 100%; width: 100%; max-width: 32rem; white-space: pre-wrap; border-radius: 0.75rem; border-width: 2px; border-style: dashed; padding: 1rem; text-align: left; opacity: 0; outline: 2px solid transparent; outline-offset: 2px; } .ss-user-word-note { position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; resize: none; border-radius: 0.75rem; border-width: 2px; border-style: dashed; --tw-border-opacity: 1; border-color: rgb(249 250 251 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); padding: 1rem; text-align: left; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); outline: 2px solid transparent; outline-offset: 2px; } .ss-user-word-note:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .ss-user-word-note.empty { --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); opacity: 0; } .ss-user-word-note.empty:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(31 41 55 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .ss-user-word-note.editing { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); opacity: 1; } .ss-user-word-note.empty.editing { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); opacity: 1; } .new-card .ss-pinyin { --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .new-card .ss-pinyin:is(.dark *) { --tw-text-opacity: 1; color: rgb(23 189 243 / var(--tw-text-opacity, 1)); } .assumed-card .ss-pinyin { --tw-text-opacity: 1; color: rgb(171 139 202 / var(--tw-text-opacity, 1)); } .hard-card .ss-pinyin { --tw-text-opacity: 1; color: rgb(239 71 111 / var(--tw-text-opacity, 1)); } .ss-character-size--10 .ss-character { font-size: 22px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--10 .ss-character { font-size: 30px; } } @media (min-width: 768px) { .ss-character-size--10 .ss-character { font-size: 40px; } } @media (min-width: 1024px) { .ss-character-size--10 .ss-character { font-size: 52px; } } .ss-character-size--9 .ss-character { font-size: 24px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--9 .ss-character { font-size: 32px; } } @media (min-width: 768px) { .ss-character-size--9 .ss-character { font-size: 42px; } } @media (min-width: 1024px) { .ss-character-size--9 .ss-character { font-size: 54px; } } .ss-character-size--8 .ss-character { font-size: 26px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--8 .ss-character { font-size: 34px; } } @media (min-width: 768px) { .ss-character-size--8 .ss-character { font-size: 44px; } } @media (min-width: 1024px) { .ss-character-size--8 .ss-character { font-size: 56px; } } .ss-character-size--7 .ss-character { font-size: 28px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--7 .ss-character { font-size: 36px; } } @media (min-width: 768px) { .ss-character-size--7 .ss-character { font-size: 46px; } } @media (min-width: 1024px) { .ss-character-size--7 .ss-character { font-size: 58px; } } .ss-character-size--6 .ss-character { font-size: 30px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--6 .ss-character { font-size: 38px; } } @media (min-width: 768px) { .ss-character-size--6 .ss-character { font-size: 48px; } } @media (min-width: 1024px) { .ss-character-size--6 .ss-character { font-size: 60px; } } .ss-character-size--5 .ss-character { font-size: 32px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--5 .ss-character { font-size: 40px; } } @media (min-width: 768px) { .ss-character-size--5 .ss-character { font-size: 50px; } } @media (min-width: 1024px) { .ss-character-size--5 .ss-character { font-size: 62px; } } .ss-character-size--4 .ss-character { font-size: 34px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--4 .ss-character { font-size: 42px; } } @media (min-width: 768px) { .ss-character-size--4 .ss-character { font-size: 52px; } } @media (min-width: 1024px) { .ss-character-size--4 .ss-character { font-size: 64px; } } .ss-character-size--3 .ss-character { font-size: 36px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--3 .ss-character { font-size: 44px; } } @media (min-width: 768px) { .ss-character-size--3 .ss-character { font-size: 54px; } } @media (min-width: 1024px) { .ss-character-size--3 .ss-character { font-size: 66px; } } .ss-character-size--2 .ss-character { font-size: 38px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--2 .ss-character { font-size: 46px; } } @media (min-width: 768px) { .ss-character-size--2 .ss-character { font-size: 56px; } } @media (min-width: 1024px) { .ss-character-size--2 .ss-character { font-size: 68px; } } .ss-character-size--1 .ss-character { font-size: 40px; line-height: 1; } @media (min-width: 640px) { .ss-character-size--1 .ss-character { font-size: 48px; } } @media (min-width: 768px) { .ss-character-size--1 .ss-character { font-size: 58px; } } @media (min-width: 1024px) { .ss-character-size--1 .ss-character { font-size: 70px; } } .ss-character { font-size: 42px; line-height: 1; } @media (min-width: 640px) { .ss-character { font-size: 50px; } } @media (min-width: 768px) { .ss-character { font-size: 60px; } } @media (min-width: 1024px) { .ss-character { font-size: 72px; } } .ss-character-size-1 .ss-character { font-size: 44px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-1 .ss-character { font-size: 52px; } } @media (min-width: 768px) { .ss-character-size-1 .ss-character { font-size: 62px; } } @media (min-width: 1024px) { .ss-character-size-1 .ss-character { font-size: 74px; } } .ss-character-size-2 .ss-character { font-size: 46px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-2 .ss-character { font-size: 54px; } } @media (min-width: 768px) { .ss-character-size-2 .ss-character { font-size: 64px; } } @media (min-width: 1024px) { .ss-character-size-2 .ss-character { font-size: 76px; } } .ss-character-size-3 .ss-character { font-size: 48px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-3 .ss-character { font-size: 56px; } } @media (min-width: 768px) { .ss-character-size-3 .ss-character { font-size: 66px; } } @media (min-width: 1024px) { .ss-character-size-3 .ss-character { font-size: 78px; } } .ss-character-size-4 .ss-character { font-size: 50px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-4 .ss-character { font-size: 58px; } } @media (min-width: 768px) { .ss-character-size-4 .ss-character { font-size: 68px; } } @media (min-width: 1024px) { .ss-character-size-4 .ss-character { font-size: 80px; } } .ss-character-size-5 .ss-character { font-size: 52px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-5 .ss-character { font-size: 60px; } } @media (min-width: 768px) { .ss-character-size-5 .ss-character { font-size: 70px; } } @media (min-width: 1024px) { .ss-character-size-5 .ss-character { font-size: 82px; } } .ss-character-size-6 .ss-character { font-size: 54px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-6 .ss-character { font-size: 62px; } } @media (min-width: 768px) { .ss-character-size-6 .ss-character { font-size: 72px; } } @media (min-width: 1024px) { .ss-character-size-6 .ss-character { font-size: 84px; } } .ss-character-size-7 .ss-character { font-size: 56px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-7 .ss-character { font-size: 64px; } } @media (min-width: 768px) { .ss-character-size-7 .ss-character { font-size: 74px; } } @media (min-width: 1024px) { .ss-character-size-7 .ss-character { font-size: 86px; } } .ss-character-size-8 .ss-character { font-size: 58px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-8 .ss-character { font-size: 66px; } } @media (min-width: 768px) { .ss-character-size-8 .ss-character { font-size: 76px; } } @media (min-width: 1024px) { .ss-character-size-8 .ss-character { font-size: 88px; } } .ss-character-size-9 .ss-character { font-size: 60px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-9 .ss-character { font-size: 68px; } } @media (min-width: 768px) { .ss-character-size-9 .ss-character { font-size: 78px; } } @media (min-width: 1024px) { .ss-character-size-9 .ss-character { font-size: 90px; } } .ss-character-size-10 .ss-character { font-size: 62px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-10 .ss-character { font-size: 70px; } } @media (min-width: 768px) { .ss-character-size-10 .ss-character { font-size: 80px; } } @media (min-width: 1024px) { .ss-character-size-10 .ss-character { font-size: 92px; } } .ss-character-size-11 .ss-character { font-size: 64px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-11 .ss-character { font-size: 72px; } } @media (min-width: 768px) { .ss-character-size-11 .ss-character { font-size: 82px; } } @media (min-width: 1024px) { .ss-character-size-11 .ss-character { font-size: 94px; } } .ss-character-size-12 .ss-character { font-size: 66px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-12 .ss-character { font-size: 74px; } } @media (min-width: 768px) { .ss-character-size-12 .ss-character { font-size: 84px; } } @media (min-width: 1024px) { .ss-character-size-12 .ss-character { font-size: 96px; } } .ss-character-size-13 .ss-character { font-size: 68px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-13 .ss-character { font-size: 76px; } } @media (min-width: 768px) { .ss-character-size-13 .ss-character { font-size: 86px; } } @media (min-width: 1024px) { .ss-character-size-13 .ss-character { font-size: 98px; } } .ss-character-size-14 .ss-character { font-size: 70px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-14 .ss-character { font-size: 78px; } } @media (min-width: 768px) { .ss-character-size-14 .ss-character { font-size: 88px; } } @media (min-width: 1024px) { .ss-character-size-14 .ss-character { font-size: 100px; } } .ss-character-size-15 .ss-character { font-size: 72px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-15 .ss-character { font-size: 80px; } } @media (min-width: 768px) { .ss-character-size-15 .ss-character { font-size: 90px; } } @media (min-width: 1024px) { .ss-character-size-15 .ss-character { font-size: 102px; } } .ss-character-size-16 .ss-character { font-size: 74px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-16 .ss-character { font-size: 82px; } } @media (min-width: 768px) { .ss-character-size-16 .ss-character { font-size: 92px; } } @media (min-width: 1024px) { .ss-character-size-16 .ss-character { font-size: 104px; } } .ss-character-size-17 .ss-character { font-size: 76px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-17 .ss-character { font-size: 84px; } } @media (min-width: 768px) { .ss-character-size-17 .ss-character { font-size: 94px; } } @media (min-width: 1024px) { .ss-character-size-17 .ss-character { font-size: 106px; } } .ss-character-size-18 .ss-character { font-size: 78px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-18 .ss-character { font-size: 86px; } } @media (min-width: 768px) { .ss-character-size-18 .ss-character { font-size: 96px; } } @media (min-width: 1024px) { .ss-character-size-18 .ss-character { font-size: 108px; } } .ss-character-size-19 .ss-character { font-size: 80px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-19 .ss-character { font-size: 88px; } } @media (min-width: 768px) { .ss-character-size-19 .ss-character { font-size: 98px; } } @media (min-width: 1024px) { .ss-character-size-19 .ss-character { font-size: 110px; } } .ss-character-size-20 .ss-character { font-size: 82px; line-height: 1; } @media (min-width: 640px) { .ss-character-size-20 .ss-character { font-size: 90px; } } @media (min-width: 768px) { .ss-character-size-20 .ss-character { font-size: 100px; } } @media (min-width: 1024px) { .ss-character-size-20 .ss-character { font-size: 112px; } } .ss-pinyin { font-family: Ubuntu Condensed; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ss-pinyin-size--10 .ss-pinyin { font-size: 14px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--10 .ss-pinyin { font-size: 20px; } } @media (min-width: 768px) { .ss-pinyin-size--10 .ss-pinyin { font-size: 26px; } } @media (min-width: 1024px) { .ss-pinyin-size--10 .ss-pinyin { font-size: 22px; } } .ss-pinyin-size--9 .ss-pinyin { font-size: 15px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--9 .ss-pinyin { font-size: 21px; } } @media (min-width: 768px) { .ss-pinyin-size--9 .ss-pinyin { font-size: 27px; } } @media (min-width: 1024px) { .ss-pinyin-size--9 .ss-pinyin { font-size: 24px; } } .ss-pinyin-size--8 .ss-pinyin { font-size: 16px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--8 .ss-pinyin { font-size: 22px; } } @media (min-width: 768px) { .ss-pinyin-size--8 .ss-pinyin { font-size: 28px; } } @media (min-width: 1024px) { .ss-pinyin-size--8 .ss-pinyin { font-size: 26px; } } .ss-pinyin-size--7 .ss-pinyin { font-size: 17px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--7 .ss-pinyin { font-size: 23px; } } @media (min-width: 768px) { .ss-pinyin-size--7 .ss-pinyin { font-size: 29px; } } @media (min-width: 1024px) { .ss-pinyin-size--7 .ss-pinyin { font-size: 28px; } } .ss-pinyin-size--6 .ss-pinyin { font-size: 18px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--6 .ss-pinyin { font-size: 24px; } } @media (min-width: 768px) { .ss-pinyin-size--6 .ss-pinyin { font-size: 30px; } } @media (min-width: 1024px) { .ss-pinyin-size--6 .ss-pinyin { font-size: 30px; } } .ss-pinyin-size--5 .ss-pinyin { font-size: 19px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--5 .ss-pinyin { font-size: 25px; } } @media (min-width: 768px) { .ss-pinyin-size--5 .ss-pinyin { font-size: 31px; } } @media (min-width: 1024px) { .ss-pinyin-size--5 .ss-pinyin { font-size: 32px; } } .ss-pinyin-size--4 .ss-pinyin { font-size: 20px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--4 .ss-pinyin { font-size: 26px; } } @media (min-width: 768px) { .ss-pinyin-size--4 .ss-pinyin { font-size: 32px; } } @media (min-width: 1024px) { .ss-pinyin-size--4 .ss-pinyin { font-size: 34px; } } .ss-pinyin-size--3 .ss-pinyin { font-size: 21px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--3 .ss-pinyin { font-size: 27px; } } @media (min-width: 768px) { .ss-pinyin-size--3 .ss-pinyin { font-size: 33px; } } @media (min-width: 1024px) { .ss-pinyin-size--3 .ss-pinyin { font-size: 36px; } } .ss-pinyin-size--2 .ss-pinyin { font-size: 22px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--2 .ss-pinyin { font-size: 28px; } } @media (min-width: 768px) { .ss-pinyin-size--2 .ss-pinyin { font-size: 34px; } } @media (min-width: 1024px) { .ss-pinyin-size--2 .ss-pinyin { font-size: 38px; } } .ss-pinyin-size--1 .ss-pinyin { font-size: 23px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size--1 .ss-pinyin { font-size: 29px; } } @media (min-width: 768px) { .ss-pinyin-size--1 .ss-pinyin { font-size: 35px; } } @media (min-width: 1024px) { .ss-pinyin-size--1 .ss-pinyin { font-size: 40px; } } .ss-pinyin { font-size: 24px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin { font-size: 30px; } } @media (min-width: 768px) { .ss-pinyin { font-size: 36px; } } @media (min-width: 1024px) { .ss-pinyin { font-size: 42px; } } .ss-pinyin-size-1 .ss-pinyin { font-size: 25px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-1 .ss-pinyin { font-size: 31px; } } @media (min-width: 768px) { .ss-pinyin-size-1 .ss-pinyin { font-size: 37px; } } @media (min-width: 1024px) { .ss-pinyin-size-1 .ss-pinyin { font-size: 44px; } } .ss-pinyin-size-2 .ss-pinyin { font-size: 26px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-2 .ss-pinyin { font-size: 32px; } } @media (min-width: 768px) { .ss-pinyin-size-2 .ss-pinyin { font-size: 38px; } } @media (min-width: 1024px) { .ss-pinyin-size-2 .ss-pinyin { font-size: 46px; } } .ss-pinyin-size-3 .ss-pinyin { font-size: 27px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-3 .ss-pinyin { font-size: 33px; } } @media (min-width: 768px) { .ss-pinyin-size-3 .ss-pinyin { font-size: 39px; } } @media (min-width: 1024px) { .ss-pinyin-size-3 .ss-pinyin { font-size: 48px; } } .ss-pinyin-size-4 .ss-pinyin { font-size: 28px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-4 .ss-pinyin { font-size: 34px; } } @media (min-width: 768px) { .ss-pinyin-size-4 .ss-pinyin { font-size: 40px; } } @media (min-width: 1024px) { .ss-pinyin-size-4 .ss-pinyin { font-size: 50px; } } .ss-pinyin-size-5 .ss-pinyin { font-size: 29px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-5 .ss-pinyin { font-size: 35px; } } @media (min-width: 768px) { .ss-pinyin-size-5 .ss-pinyin { font-size: 41px; } } @media (min-width: 1024px) { .ss-pinyin-size-5 .ss-pinyin { font-size: 52px; } } .ss-pinyin-size-6 .ss-pinyin { font-size: 30px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-6 .ss-pinyin { font-size: 36px; } } @media (min-width: 768px) { .ss-pinyin-size-6 .ss-pinyin { font-size: 42px; } } @media (min-width: 1024px) { .ss-pinyin-size-6 .ss-pinyin { font-size: 54px; } } .ss-pinyin-size-7 .ss-pinyin { font-size: 31px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-7 .ss-pinyin { font-size: 37px; } } @media (min-width: 768px) { .ss-pinyin-size-7 .ss-pinyin { font-size: 43px; } } @media (min-width: 1024px) { .ss-pinyin-size-7 .ss-pinyin { font-size: 56px; } } .ss-pinyin-size-8 .ss-pinyin { font-size: 32px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-8 .ss-pinyin { font-size: 38px; } } @media (min-width: 768px) { .ss-pinyin-size-8 .ss-pinyin { font-size: 44px; } } @media (min-width: 1024px) { .ss-pinyin-size-8 .ss-pinyin { font-size: 58px; } } .ss-pinyin-size-9 .ss-pinyin { font-size: 33px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-9 .ss-pinyin { font-size: 39px; } } @media (min-width: 768px) { .ss-pinyin-size-9 .ss-pinyin { font-size: 45px; } } @media (min-width: 1024px) { .ss-pinyin-size-9 .ss-pinyin { font-size: 60px; } } .ss-pinyin-size-10 .ss-pinyin { font-size: 34px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-10 .ss-pinyin { font-size: 40px; } } @media (min-width: 768px) { .ss-pinyin-size-10 .ss-pinyin { font-size: 46px; } } @media (min-width: 1024px) { .ss-pinyin-size-10 .ss-pinyin { font-size: 62px; } } .ss-pinyin-size-11 .ss-pinyin { font-size: 35px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-11 .ss-pinyin { font-size: 41px; } } @media (min-width: 768px) { .ss-pinyin-size-11 .ss-pinyin { font-size: 47px; } } @media (min-width: 1024px) { .ss-pinyin-size-11 .ss-pinyin { font-size: 64px; } } .ss-pinyin-size-12 .ss-pinyin { font-size: 36px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-12 .ss-pinyin { font-size: 42px; } } @media (min-width: 768px) { .ss-pinyin-size-12 .ss-pinyin { font-size: 48px; } } @media (min-width: 1024px) { .ss-pinyin-size-12 .ss-pinyin { font-size: 66px; } } .ss-pinyin-size-13 .ss-pinyin { font-size: 37px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-13 .ss-pinyin { font-size: 43px; } } @media (min-width: 768px) { .ss-pinyin-size-13 .ss-pinyin { font-size: 49px; } } @media (min-width: 1024px) { .ss-pinyin-size-13 .ss-pinyin { font-size: 68px; } } .ss-pinyin-size-14 .ss-pinyin { font-size: 38px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-14 .ss-pinyin { font-size: 44px; } } @media (min-width: 768px) { .ss-pinyin-size-14 .ss-pinyin { font-size: 50px; } } @media (min-width: 1024px) { .ss-pinyin-size-14 .ss-pinyin { font-size: 70px; } } .ss-pinyin-size-15 .ss-pinyin { font-size: 39px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-15 .ss-pinyin { font-size: 45px; } } @media (min-width: 768px) { .ss-pinyin-size-15 .ss-pinyin { font-size: 51px; } } @media (min-width: 1024px) { .ss-pinyin-size-15 .ss-pinyin { font-size: 72px; } } .ss-pinyin-size-16 .ss-pinyin { font-size: 40px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-16 .ss-pinyin { font-size: 46px; } } @media (min-width: 768px) { .ss-pinyin-size-16 .ss-pinyin { font-size: 52px; } } @media (min-width: 1024px) { .ss-pinyin-size-16 .ss-pinyin { font-size: 74px; } } .ss-pinyin-size-17 .ss-pinyin { font-size: 41px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-17 .ss-pinyin { font-size: 47px; } } @media (min-width: 768px) { .ss-pinyin-size-17 .ss-pinyin { font-size: 53px; } } @media (min-width: 1024px) { .ss-pinyin-size-17 .ss-pinyin { font-size: 76px; } } .ss-pinyin-size-18 .ss-pinyin { font-size: 42px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-18 .ss-pinyin { font-size: 48px; } } @media (min-width: 768px) { .ss-pinyin-size-18 .ss-pinyin { font-size: 54px; } } @media (min-width: 1024px) { .ss-pinyin-size-18 .ss-pinyin { font-size: 78px; } } .ss-pinyin-size-19 .ss-pinyin { font-size: 43px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-19 .ss-pinyin { font-size: 49px; } } @media (min-width: 768px) { .ss-pinyin-size-19 .ss-pinyin { font-size: 55px; } } @media (min-width: 1024px) { .ss-pinyin-size-19 .ss-pinyin { font-size: 80px; } } .ss-pinyin-size-20 .ss-pinyin { font-size: 44px; line-height: 1; } @media (min-width: 640px) { .ss-pinyin-size-20 .ss-pinyin { font-size: 50px; } } @media (min-width: 768px) { .ss-pinyin-size-20 .ss-pinyin { font-size: 56px; } } @media (min-width: 1024px) { .ss-pinyin-size-20 .ss-pinyin { font-size: 82px; } } .ss-english-size--5 .ss-english { font-size: 9px; } @media (min-width: 1024px) { .ss-english-size--5 .ss-english { font-size: 13px; } } .ss-english-size--4 .ss-english { font-size: 10px; } @media (min-width: 1024px) { .ss-english-size--4 .ss-english { font-size: 14px; } } .ss-english-size--3 .ss-english { font-size: 11px; } @media (min-width: 1024px) { .ss-english-size--3 .ss-english { font-size: 15px; } } .ss-english-size--2 .ss-english { font-size: 12px; } @media (min-width: 1024px) { .ss-english-size--2 .ss-english { font-size: 16px; } } .ss-english-size--1 .ss-english { font-size: 13px; } @media (min-width: 1024px) { .ss-english-size--1 .ss-english { font-size: 17px; } } .ss-english { font-size: 14px; } @media (min-width: 1024px) { .ss-english { font-size: 18px; } } .ss-english-size-1 .ss-english { font-size: 15px; } @media (min-width: 1024px) { .ss-english-size-1 .ss-english { font-size: 19px; } } .ss-english-size-2 .ss-english { font-size: 16px; } @media (min-width: 1024px) { .ss-english-size-2 .ss-english { font-size: 20px; } } .ss-english-size-3 .ss-english { font-size: 17px; } @media (min-width: 1024px) { .ss-english-size-3 .ss-english { font-size: 21px; } } .ss-english-size-4 .ss-english { font-size: 18px; } @media (min-width: 1024px) { .ss-english-size-4 .ss-english { font-size: 22px; } } .ss-english-size-5 .ss-english { font-size: 19px; } @media (min-width: 1024px) { .ss-english-size-5 .ss-english { font-size: 23px; } } .ss-english-size-6 .ss-english { font-size: 20px; } @media (min-width: 1024px) { .ss-english-size-6 .ss-english { font-size: 24px; } } .ss-english-size-7 .ss-english { font-size: 21px; } @media (min-width: 1024px) { .ss-english-size-7 .ss-english { font-size: 25px; } } .ss-english-size-8 .ss-english { font-size: 22px; } @media (min-width: 1024px) { .ss-english-size-8 .ss-english { font-size: 26px; } } .ss-english-size-9 .ss-english { font-size: 23px; } @media (min-width: 1024px) { .ss-english-size-9 .ss-english { font-size: 27px; } } .ss-english-size-10 .ss-english { font-size: 24px; } @media (min-width: 1024px) { .ss-english-size-10 .ss-english { font-size: 28px; } } .ss-english-size-11 .ss-english { font-size: 25px; } @media (min-width: 1024px) { .ss-english-size-11 .ss-english { font-size: 29px; } } .ss-english-size-12 .ss-english { font-size: 26px; } @media (min-width: 1024px) { .ss-english-size-12 .ss-english { font-size: 30px; } } .ss-english-size-13 .ss-english { font-size: 27px; } @media (min-width: 1024px) { .ss-english-size-13 .ss-english { font-size: 31px; } } .ss-english-size-14 .ss-english { font-size: 28px; } @media (min-width: 1024px) { .ss-english-size-14 .ss-english { font-size: 32px; } } .ss-english-size-15 .ss-english { font-size: 29px; } @media (min-width: 1024px) { .ss-english-size-15 .ss-english { font-size: 33px; } } .ss-english-size-16 .ss-english { font-size: 30px; } @media (min-width: 1024px) { .ss-english-size-16 .ss-english { font-size: 34px; } } .ss-english-size-17 .ss-english { font-size: 31px; } @media (min-width: 1024px) { .ss-english-size-17 .ss-english { font-size: 35px; } } .ss-english-size-18 .ss-english { font-size: 32px; } @media (min-width: 1024px) { .ss-english-size-18 .ss-english { font-size: 36px; } } .ss-english-size-19 .ss-english { font-size: 33px; } @media (min-width: 1024px) { .ss-english-size-19 .ss-english { font-size: 37px; } } .ss-english-size-20 .ss-english { font-size: 34px; } @media (min-width: 1024px) { .ss-english-size-20 .ss-english { font-size: 38px; } } .ss-sentence-english-size--5 .ss-sentence-english { font-size: 13px; } @media (min-width: 768px) { .ss-sentence-english-size--5 .ss-sentence-english { font-size: 15px; } } @media (min-width: 1024px) { .ss-sentence-english-size--5 .ss-sentence-english { font-size: 14px; } } .ss-sentence-english-size--4 .ss-sentence-english { font-size: 14px; } @media (min-width: 768px) { .ss-sentence-english-size--4 .ss-sentence-english { font-size: 16px; } } @media (min-width: 1024px) { .ss-sentence-english-size--4 .ss-sentence-english { font-size: 16px; } } .ss-sentence-english-size--3 .ss-sentence-english { font-size: 15px; } @media (min-width: 768px) { .ss-sentence-english-size--3 .ss-sentence-english { font-size: 17px; } } @media (min-width: 1024px) { .ss-sentence-english-size--3 .ss-sentence-english { font-size: 18px; } } .ss-sentence-english-size--2 .ss-sentence-english { font-size: 16px; } @media (min-width: 768px) { .ss-sentence-english-size--2 .ss-sentence-english { font-size: 18px; } } @media (min-width: 1024px) { .ss-sentence-english-size--2 .ss-sentence-english { font-size: 20px; } } .ss-sentence-english-size--1 .ss-sentence-english { font-size: 17px; } @media (min-width: 768px) { .ss-sentence-english-size--1 .ss-sentence-english { font-size: 19px; } } @media (min-width: 1024px) { .ss-sentence-english-size--1 .ss-sentence-english { font-size: 22px; } } .ss-sentence-english { font-size: 14px; } @media (min-width: 768px) { .ss-sentence-english { font-size: 20px; } } @media (min-width: 1024px) { .ss-sentence-english { font-size: 24px; } } .ss-sentence-english-size-1 .ss-sentence-english { font-size: 15px; } @media (min-width: 768px) { .ss-sentence-english-size-1 .ss-sentence-english { font-size: 21px; } } @media (min-width: 1024px) { .ss-sentence-english-size-1 .ss-sentence-english { font-size: 26px; } } .ss-sentence-english-size-2 .ss-sentence-english { font-size: 16px; } @media (min-width: 768px) { .ss-sentence-english-size-2 .ss-sentence-english { font-size: 22px; } } @media (min-width: 1024px) { .ss-sentence-english-size-2 .ss-sentence-english { font-size: 28px; } } .ss-sentence-english-size-3 .ss-sentence-english { font-size: 17px; } @media (min-width: 768px) { .ss-sentence-english-size-3 .ss-sentence-english { font-size: 23px; } } @media (min-width: 1024px) { .ss-sentence-english-size-3 .ss-sentence-english { font-size: 30px; } } .ss-sentence-english-size-4 .ss-sentence-english { font-size: 18px; } @media (min-width: 768px) { .ss-sentence-english-size-4 .ss-sentence-english { font-size: 24px; } } @media (min-width: 1024px) { .ss-sentence-english-size-4 .ss-sentence-english { font-size: 32px; } } .ss-sentence-english-size-5 .ss-sentence-english { font-size: 19px; } @media (min-width: 768px) { .ss-sentence-english-size-5 .ss-sentence-english { font-size: 25px; } } @media (min-width: 1024px) { .ss-sentence-english-size-5 .ss-sentence-english { font-size: 34px; } } .ss-sentence-english-size-6 .ss-sentence-english { font-size: 20px; } @media (min-width: 768px) { .ss-sentence-english-size-6 .ss-sentence-english { font-size: 26px; } } @media (min-width: 1024px) { .ss-sentence-english-size-6 .ss-sentence-english { font-size: 36px; } } .ss-sentence-english-size-7 .ss-sentence-english { font-size: 21px; } @media (min-width: 768px) { .ss-sentence-english-size-7 .ss-sentence-english { font-size: 27px; } } @media (min-width: 1024px) { .ss-sentence-english-size-7 .ss-sentence-english { font-size: 38px; } } .ss-sentence-english-size-8 .ss-sentence-english { font-size: 22px; } @media (min-width: 768px) { .ss-sentence-english-size-8 .ss-sentence-english { font-size: 28px; } } @media (min-width: 1024px) { .ss-sentence-english-size-8 .ss-sentence-english { font-size: 40px; } } .ss-sentence-english-size-9 .ss-sentence-english { font-size: 23px; } @media (min-width: 768px) { .ss-sentence-english-size-9 .ss-sentence-english { font-size: 29px; } } @media (min-width: 1024px) { .ss-sentence-english-size-9 .ss-sentence-english { font-size: 42px; } } .ss-sentence-english-size-10 .ss-sentence-english { font-size: 24px; } @media (min-width: 768px) { .ss-sentence-english-size-10 .ss-sentence-english { font-size: 30px; } } @media (min-width: 1024px) { .ss-sentence-english-size-10 .ss-sentence-english { font-size: 44px; } } .ss-sentence-english-size-11 .ss-sentence-english { font-size: 25px; } @media (min-width: 768px) { .ss-sentence-english-size-11 .ss-sentence-english { font-size: 31px; } } @media (min-width: 1024px) { .ss-sentence-english-size-11 .ss-sentence-english { font-size: 46px; } } .ss-sentence-english-size-12 .ss-sentence-english { font-size: 26px; } @media (min-width: 768px) { .ss-sentence-english-size-12 .ss-sentence-english { font-size: 32px; } } @media (min-width: 1024px) { .ss-sentence-english-size-12 .ss-sentence-english { font-size: 48px; } } .ss-sentence-english-size-13 .ss-sentence-english { font-size: 27px; } @media (min-width: 768px) { .ss-sentence-english-size-13 .ss-sentence-english { font-size: 33px; } } @media (min-width: 1024px) { .ss-sentence-english-size-13 .ss-sentence-english { font-size: 50px; } } .ss-sentence-english-size-14 .ss-sentence-english { font-size: 28px; } @media (min-width: 768px) { .ss-sentence-english-size-14 .ss-sentence-english { font-size: 34px; } } @media (min-width: 1024px) { .ss-sentence-english-size-14 .ss-sentence-english { font-size: 52px; } } .ss-sentence-english-size-15 .ss-sentence-english { font-size: 29px; } @media (min-width: 768px) { .ss-sentence-english-size-15 .ss-sentence-english { font-size: 35px; } } @media (min-width: 1024px) { .ss-sentence-english-size-15 .ss-sentence-english { font-size: 54px; } } .ss-sentence-english-size-16 .ss-sentence-english { font-size: 30px; } @media (min-width: 768px) { .ss-sentence-english-size-16 .ss-sentence-english { font-size: 36px; } } @media (min-width: 1024px) { .ss-sentence-english-size-16 .ss-sentence-english { font-size: 56px; } } .ss-sentence-english-size-17 .ss-sentence-english { font-size: 31px; } @media (min-width: 768px) { .ss-sentence-english-size-17 .ss-sentence-english { font-size: 37px; } } @media (min-width: 1024px) { .ss-sentence-english-size-17 .ss-sentence-english { font-size: 58px; } } .ss-sentence-english-size-18 .ss-sentence-english { font-size: 32px; } @media (min-width: 768px) { .ss-sentence-english-size-18 .ss-sentence-english { font-size: 38px; } } @media (min-width: 1024px) { .ss-sentence-english-size-18 .ss-sentence-english { font-size: 60px; } } .ss-sentence-english-size-19 .ss-sentence-english { font-size: 33px; } @media (min-width: 768px) { .ss-sentence-english-size-19 .ss-sentence-english { font-size: 39px; } } @media (min-width: 1024px) { .ss-sentence-english-size-19 .ss-sentence-english { font-size: 62px; } } .ss-sentence-english-size-20 .ss-sentence-english { font-size: 34px; } @media (min-width: 768px) { .ss-sentence-english-size-20 .ss-sentence-english { font-size: 40px; } } @media (min-width: 1024px) { .ss-sentence-english-size-20 .ss-sentence-english { font-size: 64px; } } .ss-sentence-character-size--5 .ss-sentence-character { font-size: 19px; } @media (min-width: 768px) { .ss-sentence-character-size--5 .ss-sentence-character { font-size: 25px; } } @media (min-width: 1024px) { .ss-sentence-character-size--5 .ss-sentence-character { font-size: 32px; } } .ss-sentence-character-size--4 .ss-sentence-character { font-size: 19px; } @media (min-width: 768px) { .ss-sentence-character-size--4 .ss-sentence-character { font-size: 25px; } } @media (min-width: 1024px) { .ss-sentence-character-size--4 .ss-sentence-character { font-size: 32px; } } .ss-sentence-character-size--3 .ss-sentence-character { font-size: 19px; } @media (min-width: 768px) { .ss-sentence-character-size--3 .ss-sentence-character { font-size: 25px; } } @media (min-width: 1024px) { .ss-sentence-character-size--3 .ss-sentence-character { font-size: 32px; } } .ss-sentence-character-size--2 .ss-sentence-character { font-size: 19px; } @media (min-width: 768px) { .ss-sentence-character-size--2 .ss-sentence-character { font-size: 25px; } } @media (min-width: 1024px) { .ss-sentence-character-size--2 .ss-sentence-character { font-size: 32px; } } .ss-sentence-character-size--1 .ss-sentence-character { font-size: 19px; } @media (min-width: 768px) { .ss-sentence-character-size--1 .ss-sentence-character { font-size: 25px; } } @media (min-width: 1024px) { .ss-sentence-character-size--1 .ss-sentence-character { font-size: 32px; } } .ss-sentence-character { font-size: 18px; } @media (min-width: 768px) { .ss-sentence-character { font-size: 24px; } } @media (min-width: 1024px) { .ss-sentence-character { font-size: 30px; } } .ss-sentence-character-size-1 .ss-sentence-character { font-size: 19px; } @media (min-width: 768px) { .ss-sentence-character-size-1 .ss-sentence-character { font-size: 25px; } } @media (min-width: 1024px) { .ss-sentence-character-size-1 .ss-sentence-character { font-size: 32px; } } .ss-sentence-character-size-2 .ss-sentence-character { font-size: 20px; } @media (min-width: 768px) { .ss-sentence-character-size-2 .ss-sentence-character { font-size: 26px; } } @media (min-width: 1024px) { .ss-sentence-character-size-2 .ss-sentence-character { font-size: 34px; } } .ss-sentence-character-size-3 .ss-sentence-character { font-size: 21px; } @media (min-width: 768px) { .ss-sentence-character-size-3 .ss-sentence-character { font-size: 27px; } } @media (min-width: 1024px) { .ss-sentence-character-size-3 .ss-sentence-character { font-size: 36px; } } .ss-sentence-character-size-4 .ss-sentence-character { font-size: 22px; } @media (min-width: 768px) { .ss-sentence-character-size-4 .ss-sentence-character { font-size: 28px; } } @media (min-width: 1024px) { .ss-sentence-character-size-4 .ss-sentence-character { font-size: 38px; } } .ss-sentence-character-size-5 .ss-sentence-character { font-size: 23px; } @media (min-width: 768px) { .ss-sentence-character-size-5 .ss-sentence-character { font-size: 29px; } } @media (min-width: 1024px) { .ss-sentence-character-size-5 .ss-sentence-character { font-size: 40px; } } .ss-sentence-character-size-6 .ss-sentence-character { font-size: 24px; } @media (min-width: 768px) { .ss-sentence-character-size-6 .ss-sentence-character { font-size: 30px; } } @media (min-width: 1024px) { .ss-sentence-character-size-6 .ss-sentence-character { font-size: 42px; } } .ss-sentence-character-size-7 .ss-sentence-character { font-size: 25px; } @media (min-width: 768px) { .ss-sentence-character-size-7 .ss-sentence-character { font-size: 31px; } } @media (min-width: 1024px) { .ss-sentence-character-size-7 .ss-sentence-character { font-size: 44px; } } .ss-sentence-character-size-8 .ss-sentence-character { font-size: 26px; } @media (min-width: 768px) { .ss-sentence-character-size-8 .ss-sentence-character { font-size: 32px; } } @media (min-width: 1024px) { .ss-sentence-character-size-8 .ss-sentence-character { font-size: 46px; } } .ss-sentence-character-size-9 .ss-sentence-character { font-size: 27px; } @media (min-width: 768px) { .ss-sentence-character-size-9 .ss-sentence-character { font-size: 33px; } } @media (min-width: 1024px) { .ss-sentence-character-size-9 .ss-sentence-character { font-size: 48px; } } .ss-sentence-character-size-10 .ss-sentence-character { font-size: 28px; } @media (min-width: 768px) { .ss-sentence-character-size-10 .ss-sentence-character { font-size: 34px; } } @media (min-width: 1024px) { .ss-sentence-character-size-10 .ss-sentence-character { font-size: 50px; } } .ss-sentence-character-size-11 .ss-sentence-character { font-size: 29px; } @media (min-width: 768px) { .ss-sentence-character-size-11 .ss-sentence-character { font-size: 35px; } } @media (min-width: 1024px) { .ss-sentence-character-size-11 .ss-sentence-character { font-size: 52px; } } .ss-sentence-character-size-12 .ss-sentence-character { font-size: 30px; } @media (min-width: 768px) { .ss-sentence-character-size-12 .ss-sentence-character { font-size: 36px; } } @media (min-width: 1024px) { .ss-sentence-character-size-12 .ss-sentence-character { font-size: 54px; } } .ss-sentence-character-size-13 .ss-sentence-character { font-size: 31px; } @media (min-width: 768px) { .ss-sentence-character-size-13 .ss-sentence-character { font-size: 37px; } } @media (min-width: 1024px) { .ss-sentence-character-size-13 .ss-sentence-character { font-size: 56px; } } .ss-sentence-character-size-14 .ss-sentence-character { font-size: 32px; } @media (min-width: 768px) { .ss-sentence-character-size-14 .ss-sentence-character { font-size: 38px; } } @media (min-width: 1024px) { .ss-sentence-character-size-14 .ss-sentence-character { font-size: 58px; } } .ss-sentence-character-size-15 .ss-sentence-character { font-size: 33px; } @media (min-width: 768px) { .ss-sentence-character-size-15 .ss-sentence-character { font-size: 39px; } } @media (min-width: 1024px) { .ss-sentence-character-size-15 .ss-sentence-character { font-size: 60px; } } .ss-sentence-character-size-16 .ss-sentence-character { font-size: 34px; } @media (min-width: 768px) { .ss-sentence-character-size-16 .ss-sentence-character { font-size: 40px; } } @media (min-width: 1024px) { .ss-sentence-character-size-16 .ss-sentence-character { font-size: 62px; } } .ss-sentence-character-size-17 .ss-sentence-character { font-size: 35px; } @media (min-width: 768px) { .ss-sentence-character-size-17 .ss-sentence-character { font-size: 41px; } } @media (min-width: 1024px) { .ss-sentence-character-size-17 .ss-sentence-character { font-size: 64px; } } .ss-sentence-character-size-18 .ss-sentence-character { font-size: 36px; } @media (min-width: 768px) { .ss-sentence-character-size-18 .ss-sentence-character { font-size: 42px; } } @media (min-width: 1024px) { .ss-sentence-character-size-18 .ss-sentence-character { font-size: 66px; } } .ss-sentence-character-size-19 .ss-sentence-character { font-size: 37px; } @media (min-width: 768px) { .ss-sentence-character-size-19 .ss-sentence-character { font-size: 43px; } } @media (min-width: 1024px) { .ss-sentence-character-size-19 .ss-sentence-character { font-size: 68px; } } .ss-sentence-character-size-20 .ss-sentence-character { font-size: 38px; } @media (min-width: 768px) { .ss-sentence-character-size-20 .ss-sentence-character { font-size: 44px; } } @media (min-width: 1024px) { .ss-sentence-character-size-20 .ss-sentence-character { font-size: 70px; } } .ss-character { border-radius: 9999px; } .ss-character-size-adjustment-in-progress .ss-pinyin { z-index: 50; } .ss-character-size-adjustment-in-progress .ss-english { z-index: 50; } .ss-character-size-adjustment-in-progress .ss-sentence-english { z-index: 50; } .ss-character-size-adjustment-in-progress .ss-sentence-character { z-index: 50; } .ss-pinyin-size-adjustment-in-progress .ss-character { z-index: 50; } .ss-pinyin-size-adjustment-in-progress .ss-english { z-index: 50; } .ss-pinyin-size-adjustment-in-progress .ss-sentence-english { z-index: 50; } .ss-pinyin-size-adjustment-in-progress .ss-sentence-character { z-index: 50; } .ss-english-size-adjustment-in-progress .ss-character { z-index: 50; } .ss-english-size-adjustment-in-progress .ss-pinyin { z-index: 50; } .ss-english-size-adjustment-in-progress .ss-sentence-english { z-index: 50; } .ss-english-size-adjustment-in-progress .ss-sentence-character { z-index: 50; } .ss-sentence-character-size-adjustment-in-progress .ss-character { z-index: 50; } .ss-sentence-character-size-adjustment-in-progress .ss-pinyin { z-index: 50; } .ss-sentence-character-size-adjustment-in-progress .ss-english { z-index: 50; } .ss-sentence-character-size-adjustment-in-progress .ss-sentence-english { z-index: 50; } .ss-sentence-english-size-adjustment-in-progress .ss-character { z-index: 50; } .ss-sentence-english-size-adjustment-in-progress .ss-pinyin { z-index: 50; } .ss-sentence-english-size-adjustment-in-progress .ss-english { z-index: 50; } .ss-sentence-english-size-adjustment-in-progress .ss-sentence-character { z-index: 50; } .ss-character-size-adjustment-in-progress .ss-character { position: relative; z-index: 50; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .ss-character-size-adjustment-in-progress .ss-character:is(.dark *) { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .ss-pinyin-size-adjustment-in-progress .ss-pinyin { position: relative; z-index: 50; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .ss-pinyin-size-adjustment-in-progress .ss-pinyin:is(.dark *) { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .ss-english-size-adjustment-in-progress .ss-english { position: relative; z-index: 50; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .ss-english-size-adjustment-in-progress .ss-english:is(.dark *) { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .ss-sentence-english-size-adjustment-in-progress .ss-sentence-english { position: relative; z-index: 50; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .ss-sentence-english-size-adjustment-in-progress .ss-sentence-english:is(.dark *) { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .ss-sentence-english-size-adjustment-in-progress .ss-sentence-english.ss-user-word-note { position: relative; z-index: 10; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .ss-sentence-english-size-adjustment-in-progress .ss-sentence-english.ss-user-word-note:is(.dark *) { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .ss-sentence-character-size-adjustment-in-progress .ss-sentence-character { position: relative; z-index: 50; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .ss-sentence-character-size-adjustment-in-progress .ss-sentence-character:is(.dark *) { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .advanced-response-tooltip { pointer-events: auto; position: absolute; bottom: 0px; z-index: 50; width: 100%; border-top-width: 1px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); padding: 2.5rem; padding-bottom: 80px; --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .advanced-response-tooltip:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .new-card .ss-character { --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .new-card .ss-character:is(.dark *) { --tw-text-opacity: 1; color: rgb(23 189 243 / var(--tw-text-opacity, 1)); } .assumed-card .ss-character { --tw-text-opacity: 1; color: rgb(171 139 202 / var(--tw-text-opacity, 1)); } .hard-card .ss-character { --tw-text-opacity: 1; color: rgb(239 71 111 / var(--tw-text-opacity, 1)); } .cursive{font-family:cursive} .shortcut-encouragement-enter { --tw-translate-y: -100%; 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)); opacity: 0; } .shortcut-encouragement-enter-active { --tw-translate-y: 0px; 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)); opacity: 1; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: 1s; } .shortcut-encouragement-exit { opacity: 1; } .shortcut-encouragement-exit-active { --tw-translate-y: -100%; 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)); opacity: 0; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: 1s; } .victory-screen-enter { position: absolute; top: 0px; left: 0px; --tw-translate-x: 100%; 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)); opacity: 0; } .victory-screen-enter-active { --tw-translate-x: 0px; 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)); opacity: 1; transition-property: all; transition-duration: 150ms; transition-duration: 1s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .studysession-main-exit { position: fixed; top: 0px; left: 0px; height: 100%; width: 100%; opacity: 1; } .studysession-main-exit-active { --tw-translate-x: -200px; 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)); opacity: 0; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } .studysession-main-exit-done { --tw-translate-x: -200px; 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)); opacity: 0; } .modal-background-enter-active { --tw-bg-opacity: 0.1; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: .4s; } .modal-background-enter-done { --tw-bg-opacity: 0.1; } .modal-background-exit { --tw-bg-opacity: 0.1; } .modal-background-exit-active { --tw-bg-opacity: 0; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: .4s; } .advanced-response-tooltip { --tw-translate-y: 100%; 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)); } .modal-background-enter-active .advanced-response-tooltip { --tw-translate-y: 2.5rem; 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)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: .4s; transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } .modal-background-enter-done .advanced-response-tooltip { --tw-translate-y: 2.5rem; 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)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .modal-background-exit .advanced-response-tooltip { --tw-translate-y: 2.5rem; 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)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .modal-background-exit-active .advanced-response-tooltip { --tw-translate-y: 100%; 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)); --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: .3s; transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } .modal-background-exit-done .advanced-response-tooltip { --tw-translate-y: 100%; 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)); } .edit-note-slider { --tw-translate-x: -100%; 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)); } .modal-background-enter-active .edit-note-slider { --tw-translate-x: 0px; 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)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: .2s; transition-timing-function: cubic-bezier(0.22,1,0.36,1); } @media (min-width: 768px) { .modal-background-enter-active .edit-note-slider { --tw-translate-x: -60px; 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)); transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } } .modal-background-enter-done .edit-note-slider { --tw-translate-x: 0px; 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)); } @media (min-width: 768px) { .modal-background-enter-done .edit-note-slider { --tw-translate-x: -60px; 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)); } } .modal-background-exit .edit-note-slider { --tw-translate-x: 0px; 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)); } @media (min-width: 768px) { .modal-background-exit .edit-note-slider { --tw-translate-x: -60px; 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)); } } .modal-background-exit-active .edit-note-slider { --tw-translate-x: -100%; 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)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: .2s; transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } .modal-background-exit-done .edit-note-slider { --tw-translate-x: -100%; 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)); } .pause-modal { --tw-translate-x: 100%; 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)); } .modal-background-enter-active .pause-modal { --tw-translate-x: 0px; 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)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: .2s; transition-timing-function: cubic-bezier(0.22,1,0.36,1); } @media (min-width: 768px) { .modal-background-enter-active .pause-modal { --tw-translate-x: 40px; 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)); transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } } .modal-background-enter-done .pause-modal { --tw-translate-x: 0px; 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)); } @media (min-width: 768px) { .modal-background-enter-done .pause-modal { --tw-translate-x: 40px; 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)); } } .modal-background-exit .pause-modal { --tw-translate-x: 0px; 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)); } @media (min-width: 768px) { .modal-background-exit .pause-modal { --tw-translate-x: 40px; 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)); } } .modal-background-exit-active .pause-modal { --tw-translate-x: 100%; 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)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; transition-duration: .2s; transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } .modal-background-exit-done .pause-modal { --tw-translate-x: 100%; 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)); } .victory-title-enter { opacity: 0; } .victory-title-enter-active { opacity: 1; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .victory-title-enter-done { opacity: 1; } .layout-phone-classic #shortcut-legend { display: none; } .layout-phone-lh #shortcut-legend { display: none; } .layout-phone-rh #shortcut-legend { display: none; } #shortcut-legend { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 200ms; } @media (min-width: 768px) { #shortcut-legend { transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } .paused #shortcut-legend { transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } } .size-adjustment-arrow { display: flex; width: 100%; cursor: pointer; justify-content: center; padding-top: 0.5rem; padding-bottom: 0.5rem; --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .size-adjustment-arrow:hover { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .size-adjustment-arrow:active { --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } .size-adjustment-arrow:is(.dark *) { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .size-adjustment-arrow:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .size-adjustment-arrow:active:is(.dark *) { --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } .review-screen-stats-container .stat-box { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); padding-top: 1.5rem; padding-bottom: 1.5rem; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .review-screen-stats-container .stat-box:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .review-screen-stats-container .stat-box .stat { margin-bottom: 0.25rem; font-size: 2.25rem; line-height: 2.5rem; font-weight: 900; } @media (min-width: 475px) { .review-screen-stats-container .stat-box .stat { font-size: 3rem; line-height: 1; } } @media (min-width: 640px) { .review-screen-stats-container .stat-box .stat { font-size: 3rem; line-height: 1; } } @media (min-width: 768px) { .review-screen-stats-container .stat-box .stat { font-size: 3.75rem; line-height: 1; } } @media (min-width: 1024px) { .review-screen-stats-container .stat-box .stat { font-size: 4.5rem; line-height: 1; } } .review-screen-stats-container .stat-box .stat-label { text-align: center; font-size: 0.75rem; line-height: 1rem; font-weight: 600; line-height: 1; } @media (min-width: 370px) { .review-screen-stats-container .stat-box .stat-label { font-size: 0.875rem; line-height: 1.25rem; } } @media (min-width: 640px) { .review-screen-stats-container .stat-box .stat-label { font-size: 1.125rem; line-height: 1.75rem; } } @media (min-width: 768px) { .review-screen-stats-container .stat-box .stat-label { font-size: 1.25rem; line-height: 1.75rem; } } .all-reviews-cleared .review-screen-stats-container .stat-box { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .bg-reviews { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .bg-reviews:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .all-reviews-cleared .bg-reviews { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .all-reviews-cleared .green-text-if-cleared { --tw-text-opacity: 1; color: rgb(6 214 160 / var(--tw-text-opacity, 1)); } .bg-new { --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); } .bg-assumed { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .victory-table-striped tr:nth-child(odd) td { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .victory-table-striped tr:nth-child(odd) td:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .victory-table-striped tr:nth-child(odd) td:first-of-type { border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem; } .victory-table-striped tr:nth-child(odd) td:last-of-type { border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem; } .bg-award{background:linear-gradient(135deg, #06d6a0, #ab8bca, #4fc3f7);background-size:360% 360%;-webkit-animation:gradient-animation 3s ease infinite;animation:gradient-animation 3s ease infinite} @-webkit-keyframes gradient-animation{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} @keyframes gradient-animation{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} .victory-screen-play-button-container { display: flex; height: 2.25rem; width: 2.25rem; align-items: center; justify-content: center; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .group:hover .victory-screen-play-button-container { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .victory-screen-play-button-container:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .group:hover .victory-screen-play-button-container:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t1 { --tw-text-opacity: 1; color: rgb(208 44 30 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(239 135 131 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t2 { --tw-text-opacity: 1; color: rgb(80 176 58 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(160 252 142 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t3 { --tw-text-opacity: 1; color: rgb(20 16 230 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 247 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t4 { --tw-text-opacity: 1; color: rgb(125 22 184 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(214 102 255 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-pinyin .ss-pinyin.t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t1 { --tw-text-opacity: 1; color: rgb(227 0 0 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 128 128 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t2 { --tw-text-opacity: 1; color: rgb(1 179 28 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 255 128 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t3 { --tw-text-opacity: 1; color: rgb(21 15 240 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 255 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t4 { --tw-text-opacity: 1; color: rgb(136 0 191 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(223 128 255 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-characters .ss-character.t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t1 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t2 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t3 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t4 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t5 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .colored-characters .hide-tone-color .ss-character.t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .blog-article { margin-left: auto; margin-right: auto; margin-top: 10rem; margin-bottom: 10rem; width: 100%; max-width: 65ch; padding-left: 1.5rem; padding-right: 1.5rem; font-family: Ubuntu Condensed; font-size: 1.125rem; line-height: 1.75rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @media (min-width: 640px) { .blog-article { padding-left: 0px; padding-right: 0px; } } @media (min-width: 768px) { .blog-article { font-size: 1.125rem; line-height: 1.75rem; } } .blog-article h1 { margin-top: 1.5rem; font-size: 2.25rem; line-height: 2.5rem; font-weight: 700; line-height: 1.25; --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .blog-article h1 { font-size: 3rem; line-height: 1; } } .blog-article h2 { margin-top: 1.5rem; font-size: 1.875rem; line-height: 2.25rem; font-weight: 600; --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .blog-article h2 { font-size: 2.25rem; line-height: 2.5rem; } } .blog-article h3 { margin-top: 1.5rem; font-size: 1.5rem; line-height: 2rem; font-weight: 600; --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .blog-article h3 { font-size: 1.875rem; line-height: 2.25rem; } } .blog-article h4 { margin-top: 1.5rem; font-size: 1.25rem; line-height: 1.75rem; font-weight: 600; --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .blog-article h4 { font-size: 1.5rem; line-height: 2rem; } } .blog-article p { margin-top: 1rem; } .blog-article blockquote { margin-top: 1.5rem; border-left-width: 4px; --tw-border-opacity: 1; border-color: rgb(6 214 160 / var(--tw-border-opacity, 1)); background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.05; padding-top: 0.75rem; padding-bottom: 0.75rem; padding-left: 1.5rem; } .blog-article a { cursor: pointer; border-bottom-width: 1px; border-style: dashed; --tw-border-opacity: 1; border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .blog-article a:hover { --tw-text-opacity: 0.9; } .blog-article a:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(23 189 243 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(23 189 243 / var(--tw-text-opacity, 1)); } .blog-article ul { margin-bottom: 0.75rem; margin-top: 1rem; list-style-type: disc; } .blog-article ol { margin-bottom: 0.75rem; margin-top: 1rem; list-style-type: decimal; } .blog-article li { margin-bottom: 0.75rem; padding-left: 0.75rem; } .turbolinks-progress-bar { background-image: linear-gradient(to right, var(--tw-gradient-stops)); --tw-gradient-from: #4fc3f7 var(--tw-gradient-from-position); --tw-gradient-to: rgb(79 195 247 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); --tw-gradient-to: #426AF7 var(--tw-gradient-to-position); } #error_explanation { margin-top: 1.5rem; margin-bottom: 1.5rem; border-radius: 0.25rem; border-width: 1px; --tw-border-opacity: 1; border-color: rgb(239 71 111 / var(--tw-border-opacity, 1)); background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.1; padding: 0.75rem; font-size: 0.875rem; line-height: 1.25rem; --tw-text-opacity: 1; color: rgb(239 71 111 / var(--tw-text-opacity, 1)); } .btn { display: flex; cursor: pointer; align-items: center; justify-content: center; border-radius: 0.25rem; } .nav-btn { height: 100%; width: 20%; cursor: pointer; flex-direction: column; align-items: center; justify-content: space-between; border-bottom-width: 1px; border-right-width: 1px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); padding-top: 0.5rem; padding-bottom: 0.5rem; } .nav-btn:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } @media (min-width: 640px) { .nav-btn { height: 100%; width: auto; flex-direction: row; border-radius: 0.25rem; border-width: 0px; border-bottom-width: 0px; } } .nav-btn>div { display: flex; height: 100%; flex-direction: column; align-items: center; justify-content: center; padding-left: 1.5rem; padding-right: 1.5rem; } @media (min-width: 640px) { .nav-btn>div { border-radius: 0.75rem; } .nav-btn:hover>div { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .nav-btn:hover>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .nav-btn:active>div { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .nav-btn:active>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } } .nav-btn.sm { display: none; } @media (min-width: 640px) { .nav-btn.sm { display: flex; } } .secondary-nav a { display: flex; height: 100%; cursor: pointer; align-items: center; justify-content: center; padding-top: 0.75rem; padding-bottom: 0.75rem; } @media (min-width: 640px) { .secondary-nav a { padding-left: 0.25rem; padding-right: 0.25rem; } } .secondary-nav a:hover div { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .secondary-nav a:hover div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .secondary-nav a:active div { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .secondary-nav a div { display: flex; height: 100%; align-items: center; justify-content: center; border-radius: 0.75rem; padding-left: 6px; padding-right: 6px; } @media (min-width: 640px) { .secondary-nav a div { padding-left: 1.5rem; padding-right: 1.5rem; } } .secondary-nav a.selected div { display: flex; align-items: center; justify-content: center; border-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); padding-left: 6px; padding-right: 6px; } .secondary-nav a.selected div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } @media (min-width: 640px) { .secondary-nav a.selected div { padding-left: 1.5rem; padding-right: 1.5rem; } } .secondary-nav a:active.selected div { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .hover-trigger2 { cursor: pointer; } .hover-trigger2 .hover-target2 { display: none; } .hover-trigger2:hover .hover-target2 { display: flex; } .hover-trigger { cursor: pointer; } .hover-trigger .hover-target { display: none; } @media (min-width: 640px) { .hover-trigger:hover .hover-target { display: flex; } } .hover-trigger:hover .hover-target{-webkit-animation:fade-in .2s;animation:fade-in .2s} @-webkit-keyframes fade-in{from{opacity:0}to{opacity:1}} .db-widget { border-bottom-width: 1px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); padding-top: 1.5rem; padding-bottom: 1.5rem; } @media (min-width: 768px) { .db-widget { border-width: 0px; padding-top: 0px; padding-bottom: 0px; } } .db-widget-popup { position: absolute; top: 0px; margin-bottom: 0.5rem; --tw-translate-y: -100%; 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)); border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); padding: 1.5rem; font-size: 0.75rem; line-height: 1rem; --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .db-widget-popup:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .db-widget-popup.lg{width:200%} .public-feature { padding-top: 4rem; padding-bottom: 4rem; padding-left: 1.5rem; padding-right: 1.5rem; } @media (min-width: 768px) { .public-feature { padding-top: 8rem; padding-bottom: 8rem; } } .public-feature-s { padding-top: 2rem; padding-bottom: 2rem; padding-left: 1.5rem; padding-right: 1.5rem; } @media (min-width: 768px) { .public-feature-s { padding-top: 4rem; padding-bottom: 4rem; } } @media only screen and (min-width: 1024px){.kb-background{background-image:linear-gradient(to right, #f8fafc, #f8fafc 50%, white 50%, white)}} .trumbowyg-editor { font-weight: 400; } .kb-article a,.trumbowyg-editor a { cursor: pointer; border-bottom-width: 1px; border-style: dashed; --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .kb-article a:hover,.trumbowyg-editor a:hover { --tw-text-opacity: 0.9; } #study-guide-bottom-nav { margin-top: 3rem; margin-bottom: 3rem; display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; font-size: 0.75rem; line-height: 1rem; } @media (min-width: 768px) { #study-guide-bottom-nav { font-size: 0.875rem; line-height: 1.25rem; } } #study-guide-bottom-nav a.study-guide-nav-link { display: flex; cursor: pointer; border-radius: 0.5rem; border-width: 1px; border-style: solid; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); padding: 1rem; --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 75ms; } #study-guide-bottom-nav a.study-guide-nav-link:hover { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .trumbowyg-editor ul,.kb-article ul { margin-top: 0.75rem; margin-bottom: 0.75rem; margin-left: 1rem; list-style-position: outside; list-style-type: disc; } .trumbowyg-editor ol,.kb-article ol { margin-top: 0.75rem; margin-bottom: 0.75rem; margin-left: 1rem; list-style-position: outside; list-style-type: decimal; } .trumbowyg-editor li,.kb-article li { margin-bottom: 0.75rem; } #comfort-pinyin{font-family:"Ubuntu Condensed",sans-serif} #comfort-device-selector-container{font-size:8px;stroke:#6b7280;--tw-text-opacity: 1;color: rgb(107 114 128 / var(--tw-text-opacity, 1))} @media screen and (min-width: 768px){#comfort-device-selector-container{font-size:11px}} #comfort-device-selector-container .device-choice:hover { --tw-text-opacity: 1; color: rgb(147 197 253 / var(--tw-text-opacity, 1));stroke:#93c5fd; } #comfort-device-selector-container .device-choice { display: flex; cursor: pointer; flex-direction: column; align-items: center; justify-content: flex-start; border-radius: 0.25rem; padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0.5rem; padding-bottom: 0.25rem; transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms;width:70px;height:64px; } #comfort-device-selector-container .device-choice div{padding-top:8px;height:26px;font-weight:400} #comfort-device-selector-container .device-choice div span{font-weight:200;font-size:7px} @media screen and (min-width: 768px){#comfort-device-selector-container .device-choice div span{font-size:10px}} #comfort-device-selector-container .device-choice.active{stroke:#2563eb} #comfort-device-selector-container .device-choice.active div { --tw-text-opacity: 1; color: rgb(37 99 235 / var(--tw-text-opacity, 1)); } #comfort-responses-container { justify-content: center; } #exterior-button-one { position: absolute; z-index: 10; display: none; --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .device-container.phone,.device-container.tablet { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .device-container.phone #device-inner-container,.device-container.tablet #device-inner-container { border-width: 1px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); } @media screen and (min-width: 768px){.device-container.phone,.device-container.tablet{padding:2px;border-radius:10px}} @media screen and (min-width: 1280px){.device-container.phone,.device-container.tablet{padding:3px;border-radius:11px}} .device-container.phone #exterior-button-one { display: block; border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; } .layout-phone-lh .device-container.phone #exterior-button-one { order: 3; } .layout-phone-rh .device-container.phone #exterior-button-one { order: 3; } .layout-tablet .device-container.phone #exterior-button-one { order: 3; } .device-container.phone #exterior-button-one{width:2px;height:18px;top:16px;right:-2px} @media screen and (min-width: 768px){.device-container.phone #exterior-button-one{width:3px;top:32px;height:40px;right:-4px}} @media screen and (min-width: 1280px){.device-container.phone #exterior-button-one{top:44px;height:44px}} .device-container.phone #card-container{margin-top:4px} @media screen and (min-width: 768px){.device-container.phone #card-container{margin-top:10px}} @media screen and (min-width: 1280px){.device-container.phone #card-container{margin-top:18px}} .device-container.phone #comfort-character{font-size:14px;line-height:14px} @media screen and (min-width: 768px){.device-container.phone #comfort-character{font-size:20px;line-height:20px}} @media screen and (min-width: 1280px){.device-container.phone #comfort-character{font-size:28px;line-height:28px}} .device-container.phone #comfort-pinyin{font-size:8px} @media screen and (min-width: 768px){.device-container.phone #comfort-pinyin{font-size:12px}} @media screen and (min-width: 1280px){.device-container.phone #comfort-pinyin{font-size:16px}} .device-container.phone #comfort-definitions{font-size:5px;margin-top:4px} @media screen and (min-width: 768px){.device-container.phone #comfort-definitions{font-size:9px;margin-top:6px}} @media screen and (min-width: 1280px){.device-container.phone #comfort-definitions{font-size:12px;margin-top:8px}} .device-container.phone #comfort-definitions div{padding:1px 2px;margin:0px 2px 2px 0px;border-radius:1px} @media screen and (min-width: 768px){.device-container.phone #comfort-definitions div{padding:2px 4px;margin:0px 4px 4px 0px;border-radius:2px}} @media screen and (min-width: 1280px){.device-container.phone #comfort-definitions div{padding:2px 6px}} .device-container.phone #comfort-sentence{margin-top:2px;font-size:5px;display: none} @media screen and (min-width: 768px){.device-container.phone #comfort-sentence{margin-top:6px;font-size:11px;display: block} .layout-phone-lh .device-container.phone #comfort-sentence { order: 3; } .layout-phone-rh .device-container.phone #comfort-sentence { order: 3; } .layout-tablet .device-container.phone #comfort-sentence { order: 3; }} @media screen and (min-width: 1280px){.device-container.phone #comfort-sentence{margin-top:8px;font-size:14px}} .device-container.phone #comfort-question{font-size:5px;font-weight:400} @media screen and (min-width: 768px){.device-container.phone #comfort-question{font-size:10px}} @media screen and (min-width: 1280px){.device-container.phone #comfort-question{font-size:12px}} .device-container.phone #comfort-positive-button,.device-container.phone #comfort-negative-button{width:50%;height:30px;padding-bottom:4px} @media screen and (min-width: 768px){.device-container.phone #comfort-positive-button,.device-container.phone #comfort-negative-button{height:60px;padding:8px}} .device-container.phone #comfort-positive-button div,.device-container.phone #comfort-negative-button div{width:100%;height:100%;font-size:8px;border-radius:5px} @media screen and (min-width: 768px){.device-container.phone #comfort-positive-button div,.device-container.phone #comfort-negative-button div{font-size:14px}} .device-container.phone #comfort-positive-button{padding:2px 2px 2px 1px} @media screen and (min-width: 768px){.device-container.phone #comfort-positive-button{padding:4px 4px 4px 2px}} .device-container.phone #comfort-negative-button{padding:2px 1px 2px 2px} @media screen and (min-width: 768px){.device-container.phone #comfort-negative-button{padding:4px 2px 4px 4px}} .device-container.desktop #card-container{margin-top:10px} @media screen and (min-width: 768px){.device-container.desktop #card-container{margin-top:30px}} @media screen and (min-width: 1280px){.device-container.desktop #card-container{margin-top:36px}} .device-container.desktop #comfort-character{font-size:18px;line-height:18px} @media screen and (min-width: 768px){.device-container.desktop #comfort-character{font-size:32px;line-height:32px}} @media screen and (min-width: 1280px){.device-container.desktop #comfort-character{font-size:40px;line-height:40px}} .device-container.desktop #comfort-pinyin{font-size:12px} @media screen and (min-width: 768px){.device-container.desktop #comfort-pinyin{font-size:18px}} @media screen and (min-width: 1280px){.device-container.desktop #comfort-pinyin{font-size:22px}} .device-container.desktop #comfort-definitions{font-size:10px;margin-top:6px} @media screen and (min-width: 768px){.device-container.desktop #comfort-definitions{font-size:12px;margin-top:18px}} @media screen and (min-width: 1280px){.device-container.desktop #comfort-definitions{font-size:14px;margin-top:20px}} .device-container.desktop #comfort-definitions div{padding:1px 2px;margin:0px 2px 2px 0px;border-radius:1px} @media screen and (min-width: 768px){.device-container.desktop #comfort-definitions div{padding:2px 4px;margin:0px 4px 4px 0px;border-radius:2px}} @media screen and (min-width: 1280px){.device-container.desktop #comfort-definitions div{padding:2px 6px}} .device-container.desktop #comfort-sentence{margin-top:2px;font-size:10px} @media screen and (min-width: 768px){.device-container.desktop #comfort-sentence{margin-top:18px;font-size:12px}} @media screen and (min-width: 1280px){.device-container.desktop #comfort-sentence{margin-top:20px;font-size:14px}} .device-container.desktop #comfort-controls { position: absolute; bottom: 0.5rem; display: flex; width: 100%; flex-direction: column; align-items: center; justify-content: center; } @media (min-width: 768px) { .device-container.desktop #comfort-controls { bottom: 2rem; } } .device-container.desktop #comfort-question{font-size:8px;font-weight:400;margin-bottom:2px} @media screen and (min-width: 768px){.device-container.desktop #comfort-question{margin-bottom:6px;font-size:12px}} @media screen and (min-width: 1280px){.device-container.desktop #comfort-question{margin-bottom:10px;font-size:14px}} .device-container.desktop #comfort-positive-button,.device-container.desktop #comfort-negative-button{width:60px;height:30px;padding:10px} @media screen and (min-width: 768px){.device-container.desktop #comfort-positive-button,.device-container.desktop #comfort-negative-button{width:120px;height:46px;padding:12px}} @media screen and (min-width: 1280px){.device-container.desktop #comfort-positive-button,.device-container.desktop #comfort-negative-button{width:140px;height:54px;padding:14px}} .device-container.desktop #comfort-positive-button div,.device-container.desktop #comfort-negative-button div{width:100%;height:100%;font-size:10px;border-radius:4px} @media screen and (min-width: 768px){.device-container.desktop #comfort-positive-button div,.device-container.desktop #comfort-negative-button div{font-size:12px}} @media screen and (min-width: 1280px){.device-container.desktop #comfort-positive-button div,.device-container.desktop #comfort-negative-button div{font-size:14px}} .device-container.desktop #comfort-positive-button{padding:4px 4px 4px 2px} @media screen and (min-width: 768px){.device-container.desktop #comfort-positive-button{padding:6px 6px 6px 3px}} .device-container.desktop #comfort-negative-button{padding:4px 2px 4px 4px} @media screen and (min-width: 768px){.device-container.desktop #comfort-negative-button{padding:6px 3px 6px 6px}} .device-container.desktop.desktop-clean #card-container{margin-top:18px} @media screen and (min-width: 768px){.device-container.desktop.desktop-clean #card-container{margin-top:80px}} @media screen and (min-width: 1280px){.device-container.desktop.desktop-clean #card-container{margin-top:110px}} .device-container.desktop.desktop-clean #comfort-responses-container{display:none} .device-container.desktop.desktop-clean #comfort-controls { bottom: 0.5rem; } .device-container.desktop.desktop-clean #comfort-question{font-size:6px;font-weight:400;margin: 0px;--tw-text-opacity: 1;color: rgb(209 213 219 / var(--tw-text-opacity, 1))} @media screen and (min-width: 768px){.device-container.desktop.desktop-clean #comfort-question{font-size:10px}} @media screen and (min-width: 1280px){.device-container.desktop.desktop-clean #comfort-question{font-size:12px}} .device-container.tablet #exterior-button-one { display: block; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; } .layout-phone-lh .device-container.tablet #exterior-button-one { order: 3; } .layout-phone-rh .device-container.tablet #exterior-button-one { order: 3; } .layout-tablet .device-container.tablet #exterior-button-one { order: 3; } .device-container.tablet #exterior-button-one{height:2px;width:26px;left:16px;top:-2px} @media screen and (min-width: 768px){.device-container.tablet #exterior-button-one{height:3px;left:32px;width:48px;top:-4px}} @media screen and (min-width: 1280px){.device-container.tablet #exterior-button-one{left:44px;width:52px}} .device-container.tablet #comfort-responses-container { justify-content: space-between; } .device-container.tablet #card-container{margin-top:10px} @media screen and (min-width: 768px){.device-container.tablet #card-container{margin-top:30px}} @media screen and (min-width: 1280px){.device-container.tablet #card-container{margin-top:36px}} .device-container.tablet #comfort-character{font-size:18px;line-height:18px} @media screen and (min-width: 768px){.device-container.tablet #comfort-character{font-size:32px;line-height:32px}} @media screen and (min-width: 1280px){.device-container.tablet #comfort-character{font-size:40px;line-height:40px}} .device-container.tablet #comfort-pinyin{font-size:12px} @media screen and (min-width: 768px){.device-container.tablet #comfort-pinyin{font-size:18px}} @media screen and (min-width: 1280px){.device-container.tablet #comfort-pinyin{font-size:22px}} .device-container.tablet #comfort-definitions{font-size:10px;margin-top:6px} @media screen and (min-width: 768px){.device-container.tablet #comfort-definitions{font-size:12px;margin-top:18px}} @media screen and (min-width: 1280px){.device-container.tablet #comfort-definitions{font-size:14px;margin-top:20px}} .device-container.tablet #comfort-definitions div{padding:1px 2px;margin:0px 2px 2px 0px;border-radius:1px} @media screen and (min-width: 768px){.device-container.tablet #comfort-definitions div{padding:2px 4px;margin:0px 4px 4px 0px;border-radius:2px}} @media screen and (min-width: 1280px){.device-container.tablet #comfort-definitions div{padding:2px 6px}} .device-container.tablet #comfort-sentence{margin-top:2px;font-size:10px} @media screen and (min-width: 768px){.device-container.tablet #comfort-sentence{margin-top:18px;font-size:12px}} @media screen and (min-width: 1280px){.device-container.tablet #comfort-sentence{margin-top:20px;font-size:14px}} .device-container.tablet #comfort-controls { position: absolute; bottom: 0px; display: flex; width: 100%; flex-direction: column; align-items: center; justify-content: center; } .device-container.tablet #comfort-question{font-size:8px;font-weight:400;position:relative;top:40px} @media screen and (min-width: 768px){.device-container.tablet #comfort-question{top:60px;font-size:12px}} @media screen and (min-width: 1280px){.device-container.tablet #comfort-question{font-size:14px}} .device-container.tablet #comfort-positive-button,.device-container.tablet #comfort-negative-button{height:60px;width:30px;padding:2px} @media screen and (min-width: 768px){.device-container.tablet #comfort-positive-button,.device-container.tablet #comfort-negative-button{height:120px;width:58px;padding:4px}} @media screen and (min-width: 1280px){.device-container.tablet #comfort-positive-button,.device-container.tablet #comfort-negative-button{height:140px;width:70px}} .device-container.tablet #comfort-positive-button div,.device-container.tablet #comfort-negative-button div{width:100%;height:100%;font-size:10px;border-radius:5px} @media screen and (min-width: 768px){.device-container.tablet #comfort-positive-button div,.device-container.tablet #comfort-negative-button div{font-size:12px}} @media screen and (min-width: 1280px){.device-container.tablet #comfort-positive-button div,.device-container.tablet #comfort-negative-button div{font-size:14px}} .textlink { cursor: pointer; border-bottom-width: 1px; --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); font-weight: 600; --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .textlink:hover { border-bottom-width: 2px; } .textlink:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); --tw-brightness: brightness(1.1); 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); } .textlink-white { cursor: pointer; border-bottom-width: 1px; border-style: dashed; --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .textlink-white:hover { --tw-text-opacity: 0.9; } .popup { position: absolute; z-index: 50; border-radius: 0.125rem; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .popup:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .modal { position: fixed; inset: 0px; z-index: 50; display: none; } #mobile-menu{background:#fff;background-image:linear-gradient(0deg, #e9e9e9 0%, #ffffff 32%)} .dark #mobile-menu { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));background-image:linear-gradient(0deg, #334255 0%, #1f293b 32%); } .pht-expanded{height:300px} @media screen and (min-width: 1024px){.pht-expanded{height:500px}} .cb:first-of-type,.cb:first-of-type>div { border-top-left-radius: 0.125rem; border-bottom-left-radius: 0.125rem; } .cb:last-of-type,.cb:last-of-type>div { border-top-right-radius: 0.125rem; border-bottom-right-radius: 0.125rem; } .cb:last-of-type .subtle-line { display: none; } .context-menu-item { display: flex; width: 100%; cursor: pointer; align-items: center; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); padding-left: 0.75rem; padding-right: 0.75rem; } .context-menu-item>div { display: flex; height: 2.5rem; width: 100%; align-items: center; border-radius: 0.25rem; padding-left: 0.75rem; padding-right: 0.75rem; } .context-menu-item:hover>div { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .hc_update { display: flex; flex-direction: column; border-bottom-width: 1px; padding-left: 1.5rem; padding-right: 1.5rem; padding-top: 3rem; padding-bottom: 2.25rem; } .hc_update:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } @media (min-width: 1024px) { .hc_update { margin-bottom: 3rem; flex-direction: row; border-radius: 0.25rem; border-width: 0px; --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); padding-top: 3rem; padding-bottom: 3rem; padding-left: 1.5rem; padding-right: 1.5rem; } } .hc_update a { cursor: pointer; border-bottom-width: 1px; border-style: dashed; --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .hc_update a:hover { --tw-text-opacity: 0.9; } .hc_update_date { margin-bottom: 1.5rem; width: 100%; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .hc_update_date:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } @media (min-width: 1024px) { .hc_update_date { width: 13rem; } } .hc_update_title { margin-bottom: 1.5rem; margin-top: 3rem; font-size: 1.125rem; line-height: 1.75rem; font-weight: 600; } .hc_update_title span { border-radius: 0.25rem; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.5rem; padding-right: 0.5rem; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .hc_update_title span:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .hc_update_title:first-of-type { margin-top: 0px; } .hc_update_news { max-width: 65ch; } .hc_update_news p { margin-bottom: 0.75rem; } .hc_update ul { margin-bottom: 0.75rem; list-style-position: outside; list-style-type: disc; } .hc_update ol { margin-bottom: 0.75rem; list-style-position: outside; list-style-type: decimal; } .hc_update li { margin-bottom: 0.75rem; margin-left: 1.5rem; } .StripeElement { margin-bottom: 0.75rem; height: 2.5rem; border-radius: 0.25rem; border-width: 1px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); padding-left: 0.5rem; padding-right: 0.5rem; font-size: 1rem; line-height: 1.5rem; } .StripeElement:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); } @media (min-width: 1024px) { .StripeElement { font-size: 1.125rem; line-height: 1.75rem; } } #card-element{padding-top:10px} .flash { top: 0px; z-index: 30; margin-top: 9rem; display: flex; justify-content: flex-end; padding: 0.75rem; width: 100%; } @media (min-width: 640px) { .flash { max-width: 640px; } } @media (min-width: 768px) { .flash { max-width: 768px; } } @media (min-width: 1024px) { .flash { max-width: 1024px; } } @media (min-width: 1280px) { .flash { max-width: 1280px; } } @media (min-width: 1536px) { .flash { max-width: 1536px; } } @media only screen and (min-width: 640px){.flash{margin-left:calc( calc(calc(100% - 640px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media only screen and (min-width: 768px){.flash{margin-left:calc( calc(calc(100% - 768px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media only screen and (min-width: 1024px){.flash{margin-left:calc( calc(calc(100% - 1024px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media only screen and (min-width: 1280px){.flash{margin-left:calc( calc(calc(100% - 1280px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media only screen and (min-width: 1536px){.flash{margin-left:calc( calc(calc(100% - 1536px) / 2) + calc(calc(100vw - 100%) / 2) )}} @media (min-width: 768px) { .flash.topnav { padding-right: 1.5rem; } } .flash>div { width: 100%; max-width: 65ch; border-radius: 0.25rem; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .flash>div>div { height: 100%; width: 100%; border-radius: 0.25rem; border-width: 1px; --tw-bg-opacity: 0.1; padding: 0.75rem; } .flash-notice-content { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } ul { list-style-position: outside; list-style-type: disc; } li { margin-bottom: 0.25rem; margin-left: 1.5rem; } .setting-option .recommendation { position: absolute; left: 0px; right: 0px; bottom: 0px; display: flex; height: 1.75rem; align-items: center; justify-content: center; border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); font-weight: 400; font-style: italic; --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .setting-option .recommendation:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .setting-option.selected .recommendation { --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .setting-option.selected .recommendation:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(23 189 243 / var(--tw-bg-opacity, 1)); } .setting-option-container { margin-top: 1.5rem; margin-bottom: 1.5rem; display: flex; flex-direction: column; border-bottom-width: 2px; padding-bottom: 1.5rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .setting-option-container:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } @media (min-width: 1024px) { .setting-option-container { margin-top: 3rem; flex-direction: row; padding-bottom: 3rem; } } .setting-option-container:first-of-type { margin-top: 0px; } .setting-option-container:last-of-type { margin-bottom: 0px; border-width: 0px; padding-bottom: 0px; } .setting-option { position: relative; margin-bottom: 1.5rem; width: 100%; cursor: pointer; border-radius: 0.5rem; border-width: 2px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); padding: 1.5rem; font-size: 0.875rem; line-height: 1.25rem; } .setting-option:hover { --tw-border-opacity: 1; border-color: rgb(184 220 232 / var(--tw-border-opacity, 1)); } .setting-option:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .setting-option:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(184 220 232 / var(--tw-border-opacity, 1)); } @media (min-width: 1024px) { .setting-option { margin-bottom: 0px; margin-right: 1.5rem; height: 15rem; width: 14rem; } } .setting-option.recommended { padding-bottom: 3rem; } .setting-option-container:first-of-type .setting-option-desc { padding-top: 0px; } .setting-option-desc { display: flex; width: 100%; flex-direction: column; padding-top: 1.5rem; padding-bottom: 1.5rem; } @media (min-width: 1024px) { .setting-option-desc { margin-right: 3rem; width: 18rem; padding: 0px; padding-top: 1.5rem; } } .setting-option-desc-title { margin-bottom: 1.5rem; font-size: 1.125rem; line-height: 1.75rem; --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .setting-option-desc-title:is(.dark *) { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { .setting-option-desc-title { font-size: 1.25rem; line-height: 1.75rem; } } .setting-option.selected { --tw-border-opacity: 1; border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .setting-option.selected:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(23 189 243 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .setting-option .fa-check-circle { display: none; font-size: 1rem; line-height: 1.5rem; font-weight: 400; } .setting-option.selected .fa-check-circle { display: block; } .layout-phone-lh .setting-option.selected .fa-check-circle { order: 3; } .layout-phone-rh .setting-option.selected .fa-check-circle { order: 3; } .layout-tablet .setting-option.selected .fa-check-circle { order: 3; } .setting-option-header { margin-bottom: 0.75rem; display: flex; justify-content: space-between; font-size: 1rem; line-height: 1.5rem; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .setting-option-header:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .setting-option.selected .setting-option-header { --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .setting-option.selected .setting-option-header:is(.dark *) { --tw-text-opacity: 1; color: rgb(23 189 243 / var(--tw-text-opacity, 1)); } .lang-cn { display: none; } .page-title { margin-top: 1rem; margin-bottom: 1rem; display: flex; align-items: center; font-size: 1.25rem; line-height: 1.75rem; font-weight: 700; --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .page-title:is(.dark *) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } @media (min-width: 475px) { .page-title { font-size: 1.5rem; line-height: 2rem; } } @media (min-width: 640px) { .page-title { font-size: 1.5rem; line-height: 2rem; } } @media (min-width: 768px) { .page-title { font-size: 1.875rem; line-height: 2.25rem; } } @media (min-width: 1024px) { .page-title { margin-top: 2rem; margin-bottom: 2rem; } } .page-details { margin-top: 2rem; margin-bottom: 4rem; max-width: 65ch; font-weight: 300; } .clean-table { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .clean-table:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .interface-word { position: relative; margin-right: 0.5rem; margin-bottom: 0.5rem; display: flex; cursor: pointer; align-items: center; justify-content: center; border-radius: 0.5rem; padding: 0.5rem; font-size: 1.25rem; line-height: 1.75rem; font-weight: 300; } .interface-word:hover { z-index: 50; } @media (min-width: 640px) { .interface-word { font-size: 1.5rem; line-height: 2rem; } } @media (min-width: 1024px) { .interface-word { font-size: 1.875rem; line-height: 2.25rem; } } .interface-word{min-width:40px} @media screen and (min-width: 1024px){.interface-word{min-width:48px}} .blog-word { position: relative; margin-right: 0.5rem; margin-bottom: 0.5rem; display: flex; cursor: pointer; align-items: center; justify-content: center; border-radius: 0.25rem; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); padding: 0.5rem; font-size: 1rem; line-height: 1.5rem; } .blog-word:hover { z-index: 50; } .blog-word:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .blog-word{min-width:40px} .removed-from-hsk .blog-word { background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.1; --tw-text-opacity: 1; color: rgb(239 71 111 / var(--tw-text-opacity, 1)); } .removed-from-hsk .blog-word:is(.dark *) { --tw-bg-opacity: 0.3; } .interface-word.blocked { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .interface-word.assumed { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .interface-word.unstudied { --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .interface-word.studied { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .interface-word.studied:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .interface-word.studied.strong { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .interface-word.studied.weak { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .interface-word.studied.weak:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .interface-word.hard { background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.5; --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .interface-word.hard:is(.dark *) { background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.5; } .interface-word.assumed .interface-word-assume-btn,.interface-word.assumed .interface-word-hide-btn,.interface-word.assumed .interface-word-unhide-btn { display: none; } .interface-word.studied .interface-word-assume-btn { display: none; } .interface-word .interface-word-unblock-btn { display: none; } .interface-word.blocked .interface-word-unblock-btn { display: flex; } .interface-word.blocked .interface-word-block-btn,.interface-word.blocked .interface-word-hide-btn,.interface-word.blocked .interface-word-assume-btn,.interface-word.blocked .interface-word-reset-btn,.interface-word.blocked .interface-word-remove-btn,.interface-word.blocked .interface-word-unhide-btn { display: none; } .interface-word-remove-btn { display: none; } .show-remove .interface-word-remove-btn { display: flex; } .interface-word .interface-word-tooltip { position: absolute; left: 0px; top: 0px; z-index: 10; margin-top: 2.5rem; display: none; padding-left: 0.125rem; padding-right: 0.125rem; padding-top: 0.5rem; padding-bottom: 0.5rem; } .interface-word .interface-word-tooltip:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .interface-word-tooltip table:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .interface-word:hover .interface-word-tooltip {display:flex;-webkit-animation:delayed-fade-in .6s;animation:delayed-fade-in .6s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards; } @-webkit-keyframes delayed-fade-in{0%{opacity:0;width:auto}2%{opacity:0;width:0}70%{opacity:0;width:0}70.01%{opacity:0;width:auto}100%{opacity:1;width:auto}} .sort-toggle { display: flex; width: 3rem; cursor: pointer; flex-direction: column; align-items: flex-start; } .sort-toggle:hover { color: rgb(17 138 178 / var(--tw-text-opacity, 1)); --tw-text-opacity: 0.8; } .square-toggle-btn { margin-bottom: 0.5rem; display: flex; height: 2.5rem; width: 2.5rem; align-items: center; justify-content: center; border-radius: 0.75rem; border-width: 1px; --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .group:hover .square-toggle-btn { border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); --tw-border-opacity: 0.3; } .square-toggle-btn:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .sort-toggle.active .square-toggle-btn { --tw-border-opacity: 1; border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.1; } .group:hover .sort-toggle.active .square-toggle-btn { background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.1; } .sort-toggle.active { --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .clean-table .interface-word { margin: 0px; justify-content: flex-start; background-color: transparent; padding: 0px; --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .clean-table .interface-word:is(.dark *) { background-color: transparent; --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .clean-table .interface-word .interface-word-tooltip { margin-top: 1.5rem; } .clean-table>td:first-child,.clean-table>th:first-child { padding-left: 0.75rem; } .clean-table>td:last-child,.clean-table>th:last-child { padding-right: 0.75rem; } .cplong{padding-left:5px;padding-right:5px} .character-with-pinyin-aligned { text-align: center; } .character-with-pinyin-aligned .character { font-weight: 100; } .character-with-pinyin-aligned .pinyin { font-family: Ubuntu Condensed;letter-spacing:-0.1em; } .character-with-pinyin-aligned .pinyin .pinyin-4 td{letter-spacing:-0.11em} .character-with-pinyin-aligned .pinyin .pinyin-5 td{letter-spacing:-0.165em} .interface-word .character-with-pinyin-aligned .character { font-size: 3.75rem; line-height: 1; } .interface-word .character-with-pinyin-aligned .pinyin td { font-size: 1.875rem; line-height: 2.25rem; } .list-catalog-btn { display: flex; height: 3.5rem; width: 100%; align-items: center; justify-content: space-between; border-bottom-width: 1px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); padding-left: 1.5rem; padding-right: 1.5rem; font-size: 0.875rem; line-height: 1.25rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 75ms; } .list-catalog-btn:hover { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); padding-right: 0.75rem; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .list-catalog-btn:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .list-catalog-btn:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { .list-catalog-btn { margin-bottom: 1rem; margin-right: 1rem; max-width: 65ch; border-radius: 0.75rem; border-width: 1px; padding-left: 1rem; padding-right: 1rem; font-size: 1rem; line-height: 1.5rem; --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } } .list-catalog-btn:first-of-type { border-top-width: 1px; } .list-catalog-btn.catalog-front { margin-bottom: 0.5rem; border-radius: 0.75rem; border-width: 1px; } @media (min-width: 640px) { .list-catalog-btn.catalog-front { margin-bottom: 1rem; width: 18rem; } } .list-catalog-btn:last-of-type { margin-bottom: 0px; } .algolia-autocomplete { margin-left: auto; margin-right: auto; width: 100%; max-width: 1280px; } .aa-suggestion { display: flex; height: 2rem; width: 100%; cursor: pointer; align-items: center; justify-content: flex-start; border-bottom-width: 1px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); font-family: Source\ Sans\ Pro; font-size: 1.25rem; line-height: 1.75rem; } .aa-suggestion:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .aa-suggestion { border-left-width: 1px; border-right-width: 1px; } } @media (min-width: 1024px) { .aa-suggestion { height: 2.5rem; } } .aa-suggestion:last-of-type { border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } .aa-dropdown-menu { width: 100%; } .aa-suggestion:hover,.aa-suggestion.aa-cursor { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .aa-suggestion:hover:is(.dark *),.aa-suggestion.aa-cursor:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } #ss-time-slider{-webkit-appearance:none;width: 12rem;height:40px;background:linear-gradient(to right, lightgray 0%, lightgray 100%);background-size:260px 10px;background-position:center;background-repeat:no-repeat;overflow:hidden;outline:none;display:block;margin:10px auto;margin-bottom:50px} #ss-time-slider:first-of-type{margin-top:30px} #ss-time-slider::-webkit-slider-thumb{-webkit-appearance:none;position: relative;z-index: 10;height: 2rem;width: 1rem;border-radius: 0.125rem;--tw-bg-opacity: 1;background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1));--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .monthly-price,.discount-10d-monthly-price{display:none} .pagination { display: flex; align-items: center; justify-content: flex-end; font-size: 0.875rem; line-height: 1.25rem; font-weight: 400; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .pagination:is(.dark *) { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .pagination span { display: none; height: 2rem; cursor: pointer; align-items: center; justify-content: center; --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); padding-left: 0.5rem; padding-right: 0.5rem; } .pagination span:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } @media (min-width: 768px) { .pagination span { display: flex; } } .pagination span:hover { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .pagination span:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .pagination a { display: flex; height: 100%; width: 100%; align-items: center; justify-content: center; } .pagination span.page{min-width:38px} .pagination span.gap { display: none; } .pagination span:first-of-type { border-top-left-radius: 0.125rem; border-bottom-left-radius: 0.125rem; } .pagination span:last-of-type { border-top-right-radius: 0.125rem; border-bottom-right-radius: 0.125rem; } .pagination span.current { cursor: default; border-width: 0px; --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .pagination span.current:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .pagination span.next,.pagination span.prev { margin-left: 0.25rem; margin-right: 0.25rem; display: flex; height: 2.5rem; border-radius: 0.125rem; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); padding-left: 0.75rem; padding-right: 0.75rem; } .pagination span.next:is(.dark *),.pagination span.prev:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .pagination span.next:hover:is(.dark *),.pagination span.prev:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } @media (min-width: 768px) { .pagination span.next,.pagination span.prev { margin-left: 0px; margin-right: 0px; height: 2rem; border-radius: 0px; --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); padding-left: 0.5rem; padding-right: 0.5rem; } .pagination span.next:hover,.pagination span.prev:hover { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .pagination span.next:is(.dark *),.pagination span.prev:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } } #detail-pagination .pagination,#date-pagination .pagination,#strong-pagination .pagination,#weak-pagination .pagination,#assumed-pagination .pagination,#unstudied-pagination .pagination { justify-content: flex-start; } #strong-pagination .pagination span { background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.1; --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } #strong-pagination .pagination span:hover { --tw-bg-opacity: 0.6; } #strong-pagination .pagination span.current { --tw-bg-opacity: 1; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } #unstudied-pagination .pagination span { background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.1; --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } #unstudied-pagination .pagination span:hover { --tw-bg-opacity: 0.3; } #unstudied-pagination .pagination span.current { --tw-bg-opacity: 1; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } #assumed-pagination .pagination span { background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.3; --tw-text-opacity: 1; color: rgb(171 139 202 / var(--tw-text-opacity, 1)); } #assumed-pagination .pagination span:hover { --tw-bg-opacity: 0.5; } #assumed-pagination .pagination span.current { --tw-bg-opacity: 1; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .character-row{min-width:60px} @media only screen and (min-width: 768px){.character-row{min-width:110px}} @media (min-width: 768px) { #list-action-buttons { position: absolute; top: 0px; right: 0px; } } .pfaq_item { display: flex; width: 100%; flex-direction: column; border-top-width: 1px; --tw-border-opacity: 1; border-color: rgb(184 220 232 / var(--tw-border-opacity, 1)); font-size: 1rem; line-height: 1.5rem; font-weight: 300; --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .pfaq_item:last-of-type { border-bottom-width: 1px; } .pfaq_question { position: relative; cursor: pointer; padding-top: 1rem; padding-bottom: 1rem; padding-left: 1.5rem; padding-right: 3rem; font-weight: 500; } .pfaq_question:hover { background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.05; } .pfaq_question.active { background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.05; } .pfaq_question i { position: absolute; top: 0px; right: 0px; margin-left: auto; margin-right: 1.5rem; margin-top: 1.25rem; display: none; } @media (min-width: 640px) { .pfaq_question i { display: block; } } .pfaq_answer { display: none; width: 100%; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.05; padding-left: 3rem; padding-right: 3rem; padding-bottom: 1.5rem; --tw-text-opacity: 1; color: rgb(7 59 76 / var(--tw-text-opacity, 1)); } .pfaq_question .fa-check { display: none; } .pfaq_question.read .fa-check { display: block; } .layout-phone-lh .pfaq_question.read .fa-check { order: 3; } .layout-phone-rh .pfaq_question.read .fa-check { order: 3; } .layout-tablet .pfaq_question.read .fa-check { order: 3; } .pfaq_question.read .fa-question { display: none; } .pfaq_question.read { font-weight: 100; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .pfaq_answer p { margin-bottom: 0.75rem; } .pfaq_answer p:last-of-type { margin-bottom: 0px; } .pfaq- ol .pfaq_answer ul,.pfaq_answer ol { margin-bottom: 0.75rem; list-style-position: outside; list-style-type: disc; } .pfaq_answer li { margin-bottom: 0.75rem; margin-left: 1.5rem; } .blogpost p,.kb-article p,.trumbowyg p { margin-bottom: 0.75rem; } .blogpost h1,.kb-article h1,.trumbowyg h1 { margin-bottom: 1rem; padding-top: 6rem; font-size: 1.875rem; line-height: 2.25rem; font-weight: 600; } .blogpost h2,.kb-article h2,.trumbowyg h2 { margin-bottom: 1rem; padding-top: 4rem; font-size: 1.5rem; line-height: 2rem; font-weight: 600; } .blogpost h3,.kb-article h3,.trumbowyg h3 { margin-top: 2rem; margin-bottom: 1rem; font-size: 1.25rem; line-height: 1.75rem; font-weight: 600; } .blogpost h4,.kb-article h4,.trumbowyg h4 { margin-top: 1.5rem; margin-bottom: 1rem; font-weight: 700; } .blogpost blockquote,.blogpost div.callout,.kb-article .callout,.kb-article blockquote,.trumbowyg blockquote,.trumbowyg .callout { position: relative; margin-top: 0.75rem; margin-bottom: 0.75rem; border-left-width: 2px; --tw-border-opacity: 1; border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); padding: 1.5rem; } .blogpost blockquote { padding-left: 6rem; } .blogpost blockquote:is(.dark *),.blogpost div.callout:is(.dark *),.trumbowyg blockquote:is(.dark *),.trumbowyg .callout:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .blogpost table { font-family: Source\ Sans\ Pro; } .blogpost table td { border-width: 1px; padding: 0.25rem; } @media (min-width: 768px) { .blogpost table td { padding: 0.75rem; } } .blogpost table p { margin: 0px; } .kb-article table,.trumbowyg table { font-family: Source\ Sans\ Pro; } .kb-article table .pinyin,.trumbowyg table .pinyin { font-family: Ubuntu Condensed; } .kb-article table td,.trumbowyg table td { border-width: 1px; padding: 0.25rem; } @media (min-width: 768px) { .kb-article table td,.trumbowyg table td { padding: 0.75rem; } } .kb-article table p,.trumbowyg table p { margin: 0px; } .kb-article table.noborder td { border-width: 0px; } .kb-article table.nopadding td { padding: 0px; } .blogpost blockquote::before{content:"“";font-size:90px;position: absolute;font-size: 4.5rem;line-height: 1;--tw-text-opacity: 1;color: rgb(17 138 178 / var(--tw-text-opacity, 1));top:20px;left:30px} .blogpost a { cursor: pointer; border-bottom-width: 1px; border-style: dashed; --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .blogpost blockquote a,.blogpost div.callout a { display: inline; font-weight: 400; --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .blogpost ul { margin-bottom: 0.75rem; list-style-type: disc; } .blogpost ol { margin-bottom: 0.75rem; list-style-type: decimal; } .blogpost li { margin-bottom: 0.75rem; margin-left: 1.5rem; } .blogpost blockquote { font-family: Source\ Sans\ Pro; } .blogpost .quicknav a { border-width: 0px; --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .tutorial_circle{cursor:pointer;position:relative;height:40px;width:40px;--tw-bg-opacity: 1;background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1));--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size: 1.5rem;line-height: 2rem;color:#fff;font-weight:900;background-size:600% 600%} .tutorial_circle.complete { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .tutorial_circle.complete+.tutorial_line { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } #tutorials_widget_modal_navigation_space .tutorial_circle .completed_checkmark_container i{font-size:19px} .tutorial_circle .completed_checkmark_container i.completed_checkmark{display:flex;font-size: 1.125rem;line-height: 1.75rem;--tw-text-opacity: 1;color: rgb(6 214 160 / var(--tw-text-opacity, 1))} .tutorial_circle.complete .completed_checkmark_container{display:flex} .tutorial_line { --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);background:linear-gradient(220deg, #118ab2, #ef476f);background-size:600% 600%; } #tutorials_widget_modal_navigation_space .tutorial_circle { height: 2.5rem; width: 2.5rem; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } @media (min-width: 768px) { #tutorials_widget_modal_navigation_space .tutorial_circle { height: 3rem; width: 3rem; } } #tutorials_widget_modal_navigation_space .tutorial_circle i { font-size: 1.875rem; line-height: 2.25rem; } #small_tutorials_widget_container:hover #close_small_tutorials_widget_button{display:flex} .tutorials_widget_modal_video{display:none} #tutorials_widget_modal_video_1{display:block} .velocity-total,.velocity-7,.velocity-30,.velocity-90 { display: none; } #velocity-box.vtotal .velocity-total { display: flex; } #velocity-box.v7 .velocity-7 { display: flex; } #velocity-box.v30 .velocity-30 { display: flex; } #velocity-box.v90 .velocity-90 { display: flex; } .classifier-stat { margin-left: 0.5rem; font-size: 0.875rem; line-height: 1.25rem; font-weight: 500; } .db-bigstat { font-family: Source\ Sans\ Pro; font-size: 2.25rem; line-height: 2.5rem; font-weight: 700; } .mini-widget-title { font-size: 0.75rem; line-height: 1rem; font-weight: 400; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .mini-widget-title:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .user_focus_container,.assignable_focus_container,.expandable_focus_container{border-radius:3px;display:flex;height:52px;width:100%;margin-bottom:8px;cursor:pointer;padding:0 20px;align-items:center;color:#000;background:gray;transition:.2s;border-left:3px solid gray} .school_dropdown_school_courses,.school_dropdown_course_lessons,.textbook_dropdown_volumes,.textbook_dropdown_volume_chapters,.exam_dropdown_exam_levels{padding-left:20px;display:none} .shade-alternate-rows tr:nth-child(odd) { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .shade-alternate-rows tr:nth-child(odd):is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .shade-alternate-rows tr.fire { background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.1; --tw-text-opacity: 1; color: rgb(6 214 160 / var(--tw-text-opacity, 1)); } .shade-alternate-rows tr.header { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .toggle-btn { cursor: pointer; border-width: 2px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .toggle-btn:hover { --tw-border-opacity: 1; border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); } .toggle-btn:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .toggle-btn.active { --tw-border-opacity: 1; border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .study-mode-btn { position: relative; margin-bottom: 0.75rem; display: flex; width: 100%; cursor: pointer; border-radius: 0.75rem; } @media (min-width: 1024px) { .study-mode-btn { margin-left: 0.75rem; margin-right: 0.75rem; margin-bottom: 0px; height: 20rem; width: 11.5rem; flex-direction: column; } } @media (min-width: 1280px) { .study-mode-btn { width: 12rem; } } .study-mode-btn.invalid { --tw-scale-x: 85%; --tw-scale-y: 85%; 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)); cursor: not-allowed; } .study-mode-btn.major { margin-bottom: 1.5rem; } @media (min-width: 1024px) { .study-mode-btn.major { margin-left: 0.75rem; margin-right: 0.75rem; margin-bottom: 0px; } } .study-mode-btn-panel { flex-direction: column; align-items: center; justify-content: center; border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); font-size: 1.875rem; line-height: 2.25rem; } .study-mode-btn-panel:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } @media (min-width: 768px) { .study-mode-btn-panel { font-size: 2.25rem; line-height: 2.5rem; } } @media (min-width: 1024px) { .study-mode-btn-panel { height: 50%; border-top-left-radius: 0px; border-bottom-left-radius: 0px; border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem; font-size: 3rem; line-height: 1; } } .study-mode-btn-desc { position: relative; display: flex; width: 100%; flex-direction: column; justify-content: center; border-radius: 0.75rem; border-width: 4px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); padding-left: 0.75rem; padding-right: 0.75rem; font-size: 1rem; line-height: 1.5rem; } .study-mode-btn-desc:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } @media (min-width: 1024px) { .study-mode-btn-desc { height: 50%; width: auto; align-items: center; justify-content: flex-start; border-top-left-radius: 0px; border-top-right-radius: 0px; border-top-width: 0px; padding: 1rem; font-size: 1.25rem; line-height: 1.75rem; } } .study-mode-btn-title { margin-bottom: 0.25rem; font-weight: 600; } .study-mode-btn-title:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } @media (min-width: 1024px) { .study-mode-btn-title { margin-bottom: 1rem; font-size: 1.25rem; line-height: 1.75rem; } } .study-mode-btn-details { font-size: 0.75rem; line-height: 1rem; } @media (min-width: 1024px) { .study-mode-btn-details { text-align: center; font-size: 0.875rem; line-height: 1.25rem; } } .study-mode-btn.invalid:hover .study-mode-btn-details { display: none; } .study-mode-btn-invalid-details { display: none; font-size: 0.75rem; line-height: 1rem; } @media (min-width: 1024px) { .study-mode-btn-invalid-details { text-align: center; font-size: 0.875rem; line-height: 1.25rem; } } .study-mode-btn.invalid:hover .study-mode-btn-invalid-details { display: flex; } .study-mode-btn-desc.major { border-top-left-radius: 0px; border-bottom-left-radius: 0px; border-left-width: 0px; } @media (min-width: 1024px) { .study-mode-btn-desc.major { border-radius: 0.75rem; border-top-left-radius: 0px; border-top-right-radius: 0px; border-left-width: 4px; } } .invalid-mode-overlay { pointer-events: none; position: absolute; height: 100%; width: 100%; --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); opacity: 0; } .invalid-mode-overlay:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .study-mode-btn.invalid:hover .invalid-mode-overlay { border-radius: 0.75rem; opacity: 0.05; } .study-mode-btn.invalid:hover .invalid-mode-overlay:is(.dark *) { opacity: 0.2; } .desired-study-duration-toggle { cursor: pointer; padding-left: 0.125rem; padding-right: 0.125rem; } .desired-study-duration-toggle:hover div { background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.2; } .desired-study-duration-toggle:hover div:is(.dark *) { --tw-bg-opacity: 0.4; } .desired-study-duration-toggle.selected div,.desired-study-duration-toggle.selected:hover div { --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .study-guide-category { cursor: pointer; border-radius: 0.5rem; border-width: 1px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); padding: 1.5rem; --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 75ms; } .study-guide-category:hover { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .study-guide-category-title { margin-bottom: 0.75rem; font-size: 1.125rem; line-height: 1.75rem; font-weight: 600; transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } @media (min-width: 768px) { .study-guide-category-title { font-size: 1.25rem; line-height: 1.75rem; } } .hsk-bar-container { display: flex; height: 100%; width: 7.6923076%; cursor: pointer; align-items: flex-end; padding-left: 0.125rem; padding-right: 0.125rem; } .hsk-bar { position: relative; display: flex; width: 100%; align-items: flex-end; border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem; border-width: 1px; transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } #old-hsk-1,#old-hsk-2,#old-hsk-3,#old-hsk-4,#old-hsk-5,#old-hsk-6 { --tw-border-opacity: 1; border-color: rgb(6 214 160 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .hsk-bar-container:hover #old-hsk-1,.hsk-bar-container:hover #old-hsk-2,.hsk-bar-container:hover #old-hsk-3,.hsk-bar-container:hover #old-hsk-4,.hsk-bar-container:hover #old-hsk-5,.hsk-bar-container:hover #old-hsk-6 { --tw-bg-opacity: 0.8; } .hsk-selected.level-1 #old-hsk-1 { --tw-border-opacity: 1; border-color: rgb(171 139 202 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .hsk-selected.level-2 #old-hsk-2 { --tw-border-opacity: 1; border-color: rgb(171 139 202 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .hsk-selected.level-3 #old-hsk-3 { --tw-border-opacity: 1; border-color: rgb(171 139 202 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .hsk-selected.level-4 #old-hsk-4 { --tw-border-opacity: 1; border-color: rgb(171 139 202 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .hsk-selected.level-5 #old-hsk-5 { --tw-border-opacity: 1; border-color: rgb(171 139 202 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .hsk-selected.level-6 #old-hsk-6 { --tw-border-opacity: 1; border-color: rgb(171 139 202 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .hsk1-portion,.hsk2-portion,.hsk3-portion,.hsk4-portion,.hsk5-portion,.hsk6-portion { position: absolute; left: 0px; bottom: 0px; z-index: 10; width: 100%; text-align: center; font-size: 0.75rem; line-height: 1rem; font-weight: 400; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); opacity: 0; transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 75ms; } .hsk-selected.level-1 .hsk1-portion,.hsk-selected.level-2 .hsk2-portion,.hsk-selected.level-3 .hsk3-portion,.hsk-selected.level-4 .hsk4-portion,.hsk-selected.level-5 .hsk5-portion,.hsk-selected.level-6 .hsk6-portion { opacity: 1; } .hsk1-portion,.hsk2-portion,.hsk3-portion,.hsk4-portion,.hsk5-portion,.overlap,.hsk6-portion { height: 0px; --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 500ms; transition-timing-function: cubic-bezier(0, 0, 0.2, 1); } .hsk-wordcount { pointer-events: none; position: absolute; top: 0px; width: 100%; text-align: center; } .hsk1-text,.hsk2-text,.hsk3-text,.hsk4-text,.hsk5-text,.hsk6-text { position: relative; display: none; width: 100%; text-align: center; font-size: 0.75rem; line-height: 1rem; font-weight: 400; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 75ms; } @media (min-width: 1024px) { .hsk-selected.level-1 .hsk1-text { display: block; } .hsk-selected.level-2 .hsk2-text { display: block; } .hsk-selected.level-3 .hsk3-text { display: block; } .hsk-selected.level-4 .hsk4-text { display: block; } .hsk-selected.level-5 .hsk5-text { display: block; } .hsk-selected.level-6 .hsk6-text { display: block; } } .overlap { width: 100%; border-top-width: 1px; --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); opacity: 0;border-color:#88c5d9; } .hsk-selected .overlap { opacity: 1; } .hsk-selected.level-1 #new-hsk-1 .overlap{height:27.24%} .hsk-selected.level-2 #new-hsk-1 .overlap{height:44.14%} .hsk-selected.level-3 #new-hsk-1 .overlap{height:56.06%} .hsk-selected.level-4 #new-hsk-1 .overlap{height:58.25%} .hsk-selected.level-5 #new-hsk-1 .overlap{height:58.85%} .hsk-selected.level-6 #new-hsk-1 .overlap{height:59.05%} .hsk-selected.level-1 #new-hsk-2 .overlap{height:11.43%} .hsk-selected.level-2 #new-hsk-2 .overlap{height:21.51%} .hsk-selected.level-3 #new-hsk-2 .overlap{height:37.54%} .hsk-selected.level-4 #new-hsk-2 .overlap{height:50.63%} .hsk-selected.level-5 #new-hsk-2 .overlap{height:55.48%} .hsk-selected.level-6 #new-hsk-2 .overlap{height:55.71%} .hsk-selected.level-1 #new-hsk-3 .overlap{height:6.62%} .hsk-selected.level-2 #new-hsk-3 .overlap{height:12.7%} .hsk-selected.level-3 #new-hsk-3 .overlap{height:24%} .hsk-selected.level-4 #new-hsk-3 .overlap{height:39.46%} .hsk-selected.level-5 #new-hsk-3 .overlap{height:57.7%} .hsk-selected.level-6 #new-hsk-3 .overlap{height:60.5%} .hsk-selected.level-1 #new-hsk-4 .overlap{height:4.62%} .hsk-selected.level-2 #new-hsk-4 .overlap{height:8.93%} .hsk-selected.level-3 #new-hsk-4 .overlap{height:17.6%} .hsk-selected.level-4 #new-hsk-4 .overlap{height:32.68%} .hsk-selected.level-5 #new-hsk-4 .overlap{height:56.87%} .hsk-selected.level-6 #new-hsk-4 .overlap{height:61.7%} .hsk-selected.level-1 #new-hsk-5 .overlap{height:3.47%} .hsk-selected.level-2 #new-hsk-5 .overlap{height:6.73%} .hsk-selected.level-3 #new-hsk-5 .overlap{height:13.43%} .hsk-selected.level-4 #new-hsk-5 .overlap{height:26.37%} .hsk-selected.level-5 #new-hsk-5 .overlap{height:49.31%} .hsk-selected.level-6 #new-hsk-5 .overlap{height:61.14%} .hsk-selected.level-1 #new-hsk-6 .overlap{height:2.74%} .hsk-selected.level-2 #new-hsk-6 .overlap{height:5.34%} .hsk-selected.level-3 #new-hsk-6 .overlap{height:10.64%} .hsk-selected.level-4 #new-hsk-6 .overlap{height:21.15%} .hsk-selected.level-5 #new-hsk-6 .overlap{height:40.34%} .hsk-selected.level-6 #new-hsk-6 .overlap{height:54.19%} .hsk-selected.level-1 #new-hsk-789 .overlap{height:1.34%} .hsk-selected.level-2 #new-hsk-789 .overlap{height:2.61%} .hsk-selected.level-3 #new-hsk-789 .overlap{height:5.22%} .hsk-selected.level-4 #new-hsk-789 .overlap{height:10.54%} .hsk-selected.level-5 #new-hsk-789 .overlap{height:21.88%} .hsk-selected.level-6 #new-hsk-789 .overlap{height:40.71%} #hsk-1-col-label,#hsk-2-col-label,#hsk-3-col-label,#hsk-4-col-label,#hsk-5-col-label,#hsk-6-col-label { --tw-text-opacity: 1; color: rgb(6 214 160 / var(--tw-text-opacity, 1)); } .hsk-selected.level-1 #hsk-1-col-label,.hsk-selected.level-2 #hsk-2-col-label,.hsk-selected.level-3 #hsk-3-col-label,.hsk-selected.level-4 #hsk-4-col-label,.hsk-selected.level-5 #hsk-5-col-label,.hsk-selected.level-6 #hsk-6-col-label,.hsk-selected.level-1 #old-hsk-1 .hsk-wordcount,.hsk-selected.level-2 #old-hsk-2 .hsk-wordcount,.hsk-selected.level-3 #old-hsk-3 .hsk-wordcount,.hsk-selected.level-4 #old-hsk-4 .hsk-wordcount,.hsk-selected.level-5 #old-hsk-5 .hsk-wordcount,.hsk-selected.level-6 #old-hsk-6 .hsk-wordcount { --tw-text-opacity: 1; color: rgb(171 139 202 / var(--tw-text-opacity, 1)); } .hsk1-delta,.hsk2-delta,.hsk3-delta,.hsk4-delta,.hsk5-delta,.hsk6-delta { position: absolute; top: 0px; margin-top: -5rem; display: none; width: 100%; text-align: center; font-weight: 400; line-height: 1; --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); opacity: 0; transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 1000ms; } @media (min-width: 768px) { .hsk1-delta,.hsk2-delta,.hsk3-delta,.hsk4-delta,.hsk5-delta,.hsk6-delta { display: block; } } @media (min-width: 1024px) { .hsk1-delta,.hsk2-delta,.hsk3-delta,.hsk4-delta,.hsk5-delta,.hsk6-delta { margin-top: -4.5rem; } } .delta-number { font-size: 0.875rem; line-height: 1.25rem; font-weight: 700; } @media (min-width: 1024px) { .delta-number { font-size: 1rem; line-height: 1.5rem; } } .hsk-selected.level-1 .hsk1-delta { opacity: 1; } .hsk-selected.level-2 .hsk2-delta { opacity: 1; } .hsk-selected.level-3 .hsk3-delta { opacity: 1; } .hsk-selected.level-4 .hsk4-delta { opacity: 1; } .hsk-selected.level-5 .hsk5-delta { opacity: 1; } .hsk-selected.level-6 .hsk6-delta { opacity: 1; } .hotkey { display: flex; height: 1.5rem; width: 1.5rem; flex-shrink: 0; align-items: center; justify-content: center; border-radius: 0.25rem; border-width: 1px; --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); font-size: 0.75rem; line-height: 1rem; font-weight: 400; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .hotkey:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .hotkey.alt:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .hsk-level-selector-btn { cursor: pointer; padding-left: 0.125rem; padding-right: 0.125rem; } .hsk-level-selector-btn div { display: flex; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; align-items: center; justify-content: center; border-radius: 0.5rem; padding-top: 0.25rem; padding-bottom: 0.25rem; } .hsk-level-selector-btn:hover div { background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); --tw-bg-opacity: 0.2; } .hsk-level-selector-btn:hover div:is(.dark *) { --tw-bg-opacity: 0.5; } .hsk-level-selector-btn.selected div { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } @-webkit-keyframes bounceLeft{0%,20%,50%,80%,100%{transform:translateX(0)}40%{transform:translateX(30px)}60%{transform:translateX(15px)}} @keyframes bounceLeft{0%,20%,50%,80%,100%{transform:translateX(0)}40%{transform:translateX(30px)}60%{transform:translateX(15px)}} @-webkit-keyframes bounceRight{0%,20%,50%,80%,100%{transform:translateX(0)}40%{transform:translateX(-30px)}60%{transform:translateX(-15px)}} @keyframes bounceRight{0%,20%,50%,80%,100%{transform:translateX(0)}40%{transform:translateX(-30px)}60%{transform:translateX(-15px)}} .bounce-horizontal{-webkit-animation:bounceLeft 2s infinite;animation:bounceLeft 2s infinite} .bounce-horizontal-right{-webkit-animation:bounceRight 2s infinite;animation:bounceRight 2s infinite} .example-sentence { margin-bottom: 1rem; display: flex; align-items: center; border-bottom-width: 2px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); padding-bottom: 1rem; } .example-sentence:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .example-sentence:last-of-type { margin: 0px; border-style: none; padding: 0px; } .outlier-toggle { display: flex; height: 100%; cursor: pointer; align-items: center; padding-left: 0.125rem; padding-right: 0.125rem; } .outlier-toggle div { display: flex; height: 1.5rem; align-items: center; border-radius: 0.25rem; padding-left: 0.5rem; padding-right: 0.5rem; } .outlier-toggle div:hover { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .outlier-toggle.selected div { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .word-highlight { border-bottom-width: 4px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 1000ms; } .word-highlight:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .grow-wrap::after{content:attr(data-replicated-value) " ";white-space:pre-wrap;visibility:hidden} .grow-wrap>textarea{resize:none;overflow:hidden} .grow-wrap>textarea,.grow-wrap::after { width: 100%; border-radius: 0.25rem; background-color: transparent; padding: 1rem; font-weight: 300; outline: 2px solid transparent; outline-offset: 2px; } .grow-wrap>textarea:focus,.grow-wrap:focus::after { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .grow-wrap>textarea,.grow-wrap::after{grid-area:1/1/2/2} .button { display: flex; cursor: pointer; align-items: center; justify-content: center; border-radius: 0.75rem; --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .button:hover { opacity: 0.9; } .button:active { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .character{font-family:"Noto Sans SC",sans-serif} .channel-GoogleAd { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .channel-FacebookAd { --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); } .channel-LTL { --tw-bg-opacity: 1; background-color: rgb(253 212 64 / var(--tw-bg-opacity, 1)); } .channel-Domino { --tw-bg-opacity: 1; background-color: rgb(229 43 44 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .channel-Excel { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .channel-GoEast { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-SimonJames { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-InstagramBio { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-Blog { --tw-bg-opacity: 1; background-color: rgb(7 59 76 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .channel-Quora { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-LinkedIn { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-Reddit { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-Mailchimp { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-Dan { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-DuChinese { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-Imagin8 { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-SlowChinese { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-Influencer { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-Unknown { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .channel-ExistingStudent { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .channel-StudentReferral { --tw-bg-opacity: 1; background-color: rgb(255 209 102 / var(--tw-bg-opacity, 1)); } .dc-background{background-image:url(/../../assets/images/dcbackground.png)} .dc-sync-hero-img{background-image:url(/../../assets/images/sync-with-du-chinese.png)} .maayot-sync-hero-img{background-image:url(/../../assets/images/sync-with-maayot.png)} .maayot-sync-hero-img-dark{background-image:url(/../../assets/images/sync-with-maayot.png)} .dong-chinese-sync-hero-img{background-image:url(/../../assets/images/sync-with-dong-chinese.png)} .dong-chinese-sync-hero-img-dark{background-image:url(/../../assets/images/sync-with-dong-chinese.png)} .the-chairmans-bao-sync-hero-img{background-image:url(/../../assets/images/sync-with-tcb.png)} .the-chairmans-bao-sync-hero-img-dark{background-image:url(/../../assets/images/sync-with-tcb.png)} .widget-toggle-text { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .widget-toggle-text:hover { color: rgb(79 195 247 / var(--tw-text-opacity, 1)); --tw-text-opacity: 0.7; } .widget-toggle-text:is(.dark *) { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .widget-toggle-text:hover:is(.dark *) { color: rgb(79 195 247 / var(--tw-text-opacity, 1)); --tw-text-opacity: 0.7; } .loader{position:relative;display:flex;align-items:center;justify-content:center;width:100%;max-width:6rem;margin-top:3rem;margin-bottom:3rem} .loader:before,.loader:after{content:"";position:absolute;border-radius:50%;-webkit-animation:pulsOut 1.8s ease-in-out infinite;animation:pulsOut 1.8s ease-in-out infinite;filter:drop-shadow(0 0 1rem rgba(255, 255, 255, 0.75))} .loader:before{width:100%;padding-bottom:100%;box-shadow:inset 0 0 0 1rem #fff;-webkit-animation-name:pulsIn;animation-name:pulsIn} .loader:after{width:calc(100% - 2rem);padding-bottom:calc(100% - 2rem);box-shadow:0 0 0 0 #fff} @-webkit-keyframes pulsIn{0%{box-shadow:inset 0 0 0 1rem #fff;opacity:1}50%,100%{box-shadow:inset 0 0 0 0 #fff;opacity:0}} @keyframes pulsIn{0%{box-shadow:inset 0 0 0 1rem #fff;opacity:1}50%,100%{box-shadow:inset 0 0 0 0 #fff;opacity:0}} @-webkit-keyframes pulsOut{0%,50%{box-shadow:0 0 0 0 #fff;opacity:0}100%{box-shadow:0 0 0 1rem #fff;opacity:1}} @keyframes pulsOut{0%,50%{box-shadow:0 0 0 0 #fff;opacity:0}100%{box-shadow:0 0 0 1rem #fff;opacity:1}} .font-simplified-kaiti .simplified{font-family:"KaiTi",cursive} .font-simplified-noto-sans .simplified{font-family:"Noto Sans SC",sans-serif} .font-simplified-noto-serif .simplified{font-family:"Noto Serif SC",serif} .font-simplified-zcool-xiaowei .simplified{font-family:"ZCOOL XiaoWei",serif} .font-simplified-zcool-qingke-huangyou .simplified{font-family:"ZCOOL QingKe HuangYou",cursive} .font-simplified-ma-shan-zheng .simplified{font-family:"Ma Shan Zheng",cursive} .font-simplified-zcool-kuaile .simplified{font-family:"ZCOOL KuaiLe",cursive} .font-simplified-zhi-mang-xing .simplified{font-family:"Zhi Mang Xing",cursive} .font-simplified-liu-jian-mao-cao .simplified{font-family:"Liu Jian Mao Cao",cursive} .font-simplified-long-cang .simplified{font-family:"Long Cang",cursive} .font-simplified-cursive .simplified{font-family:cursive} .force-cursive{font-family:cursive} .simplified.font-kaiti{font-family:"KaiTi",cursive} .simplified.font-simplified-noto-sans{font-family:"Noto Sans SC",sans-serif} .simplified.font-simplified-noto-serif{font-family:"Noto Serif SC",serif} .simplified.font-simplified-zcool-xiaowei{font-family:"ZCOOL XiaoWei",serif} .simplified.font-simplified-zcool-qingke-huangyou{font-family:"ZCOOL QingKe HuangYou",cursive} .simplified.font-simplified-ma-shan-zheng{font-family:"Ma Shan Zheng",cursive} .simplified.font-simplified-zcool-kuaile{font-family:"ZCOOL KuaiLe",cursive} .simplified.font-simplified-zhi-mang-xing{font-family:"Zhi Mang Xing",cursive} .simplified.font-simplified-liu-jian-mao-cao{font-family:"Liu Jian Mao Cao",cursive} .simplified.font-simplified-long-cang{font-family:"Long Cang",cursive} .simplified.font-simplified-cursive{font-family:cursive} .font-traditional-noto-sans .traditional{font-family:"Noto Sans TC",sans-serif} .font-traditional-noto-serif .traditional{font-family:"Noto Serif TC",serif} .font-traditional-cursive .traditional{font-family:cursive} .traditional.font-traditional-noto-sans{font-family:"Noto Sans TC",sans-serif} .traditional.font-traditional-noto-serif{font-family:"Noto Serif TC",serif} .traditional.font-traditional-cursive{font-family:cursive} .pinyin { font-family: Ubuntu Condensed; } .colored-pinyin .pinyin.t1 { --tw-text-opacity: 1; color: rgb(227 0 0 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 128 128 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t2 { --tw-text-opacity: 1; color: rgb(1 179 28 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 255 128 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t3 { --tw-text-opacity: 1; color: rgb(21 15 240 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 255 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t4 { --tw-text-opacity: 1; color: rgb(136 0 191 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(223 128 255 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin.t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t1 { --tw-text-opacity: 1; color: rgb(227 0 0 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 128 128 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t2 { --tw-text-opacity: 1; color: rgb(1 179 28 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 255 128 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t3 { --tw-text-opacity: 1; color: rgb(21 15 240 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 255 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t4 { --tw-text-opacity: 1; color: rgb(136 0 191 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(223 128 255 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-pinyin .pinyin .t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t1 { --tw-text-opacity: 1; color: rgb(227 0 0 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 128 128 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t2 { --tw-text-opacity: 1; color: rgb(1 179 28 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 255 128 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t3 { --tw-text-opacity: 1; color: rgb(21 15 240 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 255 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t4 { --tw-text-opacity: 1; color: rgb(136 0 191 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(223 128 255 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-characters .characters.t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .colored-characters .character.t1 { --tw-text-opacity: 1; color: rgb(227 0 0 / var(--tw-text-opacity, 1)); } .colored-characters .character.t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 128 128 / var(--tw-text-opacity, 1)); } .colored-characters .character.t2 { --tw-text-opacity: 1; color: rgb(1 179 28 / var(--tw-text-opacity, 1)); } .colored-characters .character.t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 255 128 / var(--tw-text-opacity, 1)); } .colored-characters .character.t3 { --tw-text-opacity: 1; color: rgb(21 15 240 / var(--tw-text-opacity, 1)); } .colored-characters .character.t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 255 / var(--tw-text-opacity, 1)); } .colored-characters .character.t4 { --tw-text-opacity: 1; color: rgb(136 0 191 / var(--tw-text-opacity, 1)); } .colored-characters .character.t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(223 128 255 / var(--tw-text-opacity, 1)); } .colored-characters .character.t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-characters .character.t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .colored-characters .character .t1 { --tw-text-opacity: 1; color: rgb(227 0 0 / var(--tw-text-opacity, 1)); } .colored-characters .character .t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 128 128 / var(--tw-text-opacity, 1)); } .colored-characters .character .t2 { --tw-text-opacity: 1; color: rgb(1 179 28 / var(--tw-text-opacity, 1)); } .colored-characters .character .t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 255 128 / var(--tw-text-opacity, 1)); } .colored-characters .character .t3 { --tw-text-opacity: 1; color: rgb(21 15 240 / var(--tw-text-opacity, 1)); } .colored-characters .character .t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 255 / var(--tw-text-opacity, 1)); } .colored-characters .character .t4 { --tw-text-opacity: 1; color: rgb(136 0 191 / var(--tw-text-opacity, 1)); } .colored-characters .character .t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(223 128 255 / var(--tw-text-opacity, 1)); } .colored-characters .character .t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-characters .character .t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .settings-menu-option { display: flex; width: 100%; cursor: pointer; padding-top: 0.125rem; padding-bottom: 0.125rem; font-size: 0.875rem; line-height: 1.25rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .settings-menu-option:hover { --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .settings-menu-option:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .settings-menu-option:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .settings-menu-option { font-size: 1rem; line-height: 1.5rem; } } .settings-menu-option div { display: flex; height: 2.5rem; width: 100%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; align-items: center; border-radius: 0.75rem; padding-left: 0.5rem; padding-right: 0.5rem; } .group:hover .settings-menu-option div { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .group:hover .settings-menu-option div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } @media (min-width: 1024px) { .settings-menu-option div { padding-left: 0.5rem; padding-right: 0.5rem; } } .settings-menu-option div div:first-of-type { display: none; width: 2.75rem; justify-content: center; padding: 0px; } @media (min-width: 768px) { .settings-menu-option div div:first-of-type { display: flex; } } .multi-toggle { display: flex; height: 50px; cursor: pointer; align-items: center; justify-content: center; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); padding-left: 2rem; padding-right: 2rem; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .multi-toggle:hover { background-color: rgb(66 106 247 / 0.25); } .multi-toggle:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .multi-toggle:hover:is(.dark *) { background-color: rgb(79 195 247 / 0.5); --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } @media (min-width: 768px) { .multi-toggle { padding-left: 2.25rem; padding-right: 2.25rem; } } .multi-toggle.small { padding-left: 1rem; padding-right: 1rem; } @media (min-width: 768px) { .multi-toggle.small { padding-left: 1.25rem; padding-right: 1.25rem; } } .multi-toggle.small.extra { padding-left: 0.75rem; padding-right: 0.75rem; } @media (min-width: 768px) { .multi-toggle.small.extra { padding-left: 1.25rem; padding-right: 1.25rem; } } .multi-toggle.selected { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .multi-toggle.selected:hover { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .multi-toggle.selected:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .multi-toggle.selected:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .multi-toggle:first-of-type { border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem; } .multi-toggle:last-of-type { border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem; } .two-way-toggle { display: flex; width: 3.5rem; cursor: pointer; align-items: center; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); padding: 0.25rem; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .two-way-toggle:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .two-way-toggle.on { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .two-way-toggle.on:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .two-way-toggle div { margin-left: 0px; height: 1.25rem; width: 1.25rem; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .two-way-toggle div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .two-way-toggle.on div { margin-left: 28px; } .setting-title { font-weight: 600; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .setting-title:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .font-toggle { display: flex; cursor: pointer; flex-direction: column; border-radius: 1rem; border-width: 2px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.75rem; padding-right: 0.75rem; } .font-toggle:hover { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } #settings-content p { margin-top: 0.75rem; width: 100%; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .a-container-width { width: 100%; } @media (min-width: 640px) { .a-container-width { width: 640px; } } @media (min-width: 768px) { .a-container-width { width: 768px; } } @media (min-width: 1024px) { .a-container-width { width: 1024px; } } @media (min-width: 1280px) { .a-container-width { width: 1280px; } } .font-select-item { position: relative; display: flex; height: 4rem; width: 100%; cursor: pointer; flex-direction: column; align-items: flex-start; justify-content: center; border-radius: 0.75rem; border-width: 2px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); padding-left: 0.75rem; padding-right: 0.75rem; padding-bottom: 0.75rem; font-size: 1.875rem; line-height: 2.25rem; } .font-select-item:hover { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); } .font-select-item:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .font-select-item:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { .font-select-item { font-size: 40px; } } .font-select-item.selected { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .font-select-item.selected:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .font-select-item .label { position: absolute; bottom: 0px; left: 0px; margin-bottom: 0.25rem; margin-left: 0.75rem; font-size: 10px; line-height: 1; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .font-select-item.selected .label { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .force-blurry{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)} .flip-horizontally{transform:scaleX(-1)} .landing-feature-box { display: flex; flex-direction: column; padding: 1.5rem; } @media (min-width: 640px) { .landing-feature-box { padding: 2.5rem; } } @media (min-width: 768px) { .landing-feature-box { padding: 4rem; } } @media (min-width: 1024px) { .landing-feature-box { padding: 5rem; } } .landing-feature-box-mini { display: flex; flex-direction: column; padding: 1.5rem; } @media (min-width: 640px) { .landing-feature-box-mini { padding: 2rem; } } @media (min-width: 768px) { .landing-feature-box-mini { padding: 2.5rem; } } @media (min-width: 1024px) { .landing-feature-box-mini { padding: 3.5rem; } } .landing-title { text-align: center; font-size: 1.25rem; line-height: 1.75rem; font-weight: 700; } @media (min-width: 640px) { .landing-title { font-size: 1.5rem; line-height: 2rem; } } @media (min-width: 768px) { .landing-title { font-size: 1.875rem; line-height: 2.25rem; } } .landing-title-mini { text-align: center; font-size: 1rem; line-height: 1.5rem; font-weight: 700; } @media (min-width: 640px) { .landing-title-mini { font-size: 1.125rem; line-height: 1.75rem; } } @media (min-width: 768px) { .landing-title-mini { font-size: 1.25rem; line-height: 1.75rem; } } #hc-timeline li { margin-left: 0px; } #pricing-faq ul { width: 100%; list-style-type: none; } #pricing-faq li { margin-left: 0px; margin-top: 3.5rem; } #pricing-faq li:first-of-type { margin-top: 0px; } .press-article { display: flex; cursor: pointer; flex-direction: column; border-radius: 0.5rem; border-width: 1px; padding: 1rem; } .press-article:hover { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .animated-gradient1,.animated-gradient2{filter:blur(30px);position: absolute;--tw-scale-x: 1.25;--tw-scale-y: 1.5;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));border-radius: 9999px;opacity: 0.4} .animated-gradient1 { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1));-webkit-animation:intropop 2s ease-out 1,subtleglow1 6s linear infinite 2s;animation:intropop 2s ease-out 1,subtleglow1 6s linear infinite 2s; } .outlier-hero-text{text-shadow:0 0 12px #35abe5} .animated-gradient2 { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1));-webkit-animation:intropop 2s ease-out 1,subtleglow2 6s linear infinite 2s;animation:intropop 2s ease-out 1,subtleglow2 6s linear infinite 2s; } @-webkit-keyframes intropop{0%{filter:blur(10px);opacity: 0}50%{filter:blur(120px);opacity: 1}100%{filter:blur(50px);opacity: 0.4}} @keyframes intropop{0%{filter:blur(10px);opacity: 0}50%{filter:blur(120px);opacity: 1}100%{filter:blur(50px);opacity: 0.4}} @-webkit-keyframes subtleglow1{0%{filter:blur(50px);opacity: 0.4}25%{filter:blur(60px);opacity: 0.7}50%{filter:blur(70px);--tw-bg-opacity: 1;background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1));opacity: 0.6}75%{filter:blur(60px);--tw-bg-opacity: 1;background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1));opacity: 0.4}100%{filter:blur(50px);opacity: 0.4}} @keyframes subtleglow1{0%{filter:blur(50px);opacity: 0.4}25%{filter:blur(60px);opacity: 0.7}50%{filter:blur(70px);--tw-bg-opacity: 1;background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1));opacity: 0.6}75%{filter:blur(60px);--tw-bg-opacity: 1;background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1));opacity: 0.4}100%{filter:blur(50px);opacity: 0.4}} @-webkit-keyframes subtleglow2{0%{filter:blur(50px);opacity: 0.4}25%{filter:blur(60px);opacity: 0.7}50%{filter:blur(70px);--tw-bg-opacity: 1;background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1));opacity: 0.6}75%{filter:blur(60px);--tw-bg-opacity: 1;background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1));opacity: 0.4}100%{filter:blur(50px);opacity: 0.4}} @keyframes subtleglow2{0%{filter:blur(50px);opacity: 0.4}25%{filter:blur(60px);opacity: 0.7}50%{filter:blur(70px);--tw-bg-opacity: 1;background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1));opacity: 0.6}75%{filter:blur(60px);--tw-bg-opacity: 1;background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1));opacity: 0.4}100%{filter:blur(50px);opacity: 0.4}} @-webkit-keyframes intropop2{0%{filter:blur(40px)}50%{filter:blur(180px)}100%{filter:blur(40px)}} @keyframes intropop2{0%{filter:blur(40px)}50%{filter:blur(180px)}100%{filter:blur(40px)}} .quote-gradient { position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; background-image: linear-gradient(to right, var(--tw-gradient-stops)); --tw-gradient-from: #4fc3f7 var(--tw-gradient-from-position); --tw-gradient-to: rgb(79 195 247 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); --tw-gradient-to: #426AF7 var(--tw-gradient-to-position);filter:blur(20px); } .cta-gradient { position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; background-image: linear-gradient(to right, var(--tw-gradient-stops)); --tw-gradient-from: #118ab2 var(--tw-gradient-from-position); --tw-gradient-to: rgb(17 138 178 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); --tw-gradient-to: #06d6a0 var(--tw-gradient-to-position);filter:blur(100px); } .landing-image { border-radius: 0.75rem; border-width: 1px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); --tw-shadow-color: rgb(0 0 0 / 0.05); --tw-shadow: var(--tw-shadow-colored); } .landing-title { margin-top: 1rem; max-width: 42rem; text-align: left; font-size: 1.5rem; line-height: 2rem; font-weight: 800; letter-spacing: -0.025em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @media (min-width: 640px) { .landing-title { font-size: 1.875rem; line-height: 2.25rem; } } @media (min-width: 768px) { .landing-title { font-size: 2.25rem; line-height: 2.5rem; } } .landing-subtitle { margin-top: 1rem; max-width: 32rem; line-height: 1.75rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .award-quote { z-index: 10; display: flex; width: 100%; align-items: center; justify-content: center; padding-left: 1rem; padding-right: 1rem; text-align: center; font-size: 1rem; line-height: 1.5rem; font-weight: 700; } @media (min-width: 640px) { .award-quote { font-size: 1.125rem; line-height: 1.75rem; } } @media (min-width: 1024px) { .award-quote { padding-left: 1.5rem; padding-right: 1.5rem; line-height: 1.25; } } #public-footer a { margin-bottom: 0.25rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } #public-footer a:hover { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } #public-footer a.social { margin-right: 0.75rem; --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } #public-footer a.social:hover { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } #reader-preview .sentence:hover { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } #reader-preview .word:hover { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } #reader-preview .added { position: relative; } #reader-preview .added .pronunciation-help { position: absolute; top: -16px; left: 0px; display: flex; height: 100%; width: 100%; justify-content: center; font-size: 1.125rem; line-height: 1.75rem; letter-spacing: -0.025em; } #study-interface .character-with-pinyin-aligned #reader-preview .added .pronunciation-help { font-size: 1.5rem; line-height: 2rem; } @media (min-width: 640px) { #study-interface .character-with-pinyin-aligned #reader-preview .added .pronunciation-help { font-size: 1.875rem; line-height: 2.25rem; } } @media (min-width: 1024px) { #study-interface .character-with-pinyin-aligned #reader-preview .added .pronunciation-help { font-size: 2.25rem; line-height: 2.5rem; } } .character-with-pinyin-aligned #reader-preview .added .pronunciation-help { font-family: Ubuntu Condensed;letter-spacing:-0.1em; } .character-with-pinyin-aligned #reader-preview .added .pronunciation-help .pinyin-4 td{letter-spacing:-0.11em} .character-with-pinyin-aligned #reader-preview .added .pronunciation-help .pinyin-5 td{letter-spacing:-0.165em} .interface-word .character-with-pinyin-aligned #reader-preview .added .pronunciation-help td { font-size: 1.875rem; line-height: 2.25rem; } .kb-article table #reader-preview .added .pronunciation-help,.trumbowyg table #reader-preview .added .pronunciation-help { font-family: Ubuntu Condensed; } #reader-preview .added .pronunciation-help { font-family: Ubuntu Condensed; } .colored-pinyin #reader-preview .added .pronunciation-help.t1 { --tw-text-opacity: 1; color: rgb(227 0 0 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 128 128 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t2 { --tw-text-opacity: 1; color: rgb(1 179 28 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 255 128 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t3 { --tw-text-opacity: 1; color: rgb(21 15 240 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 255 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t4 { --tw-text-opacity: 1; color: rgb(136 0 191 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(223 128 255 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help.t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t1 { --tw-text-opacity: 1; color: rgb(227 0 0 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t1:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 128 128 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t2 { --tw-text-opacity: 1; color: rgb(1 179 28 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t2:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 255 128 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t3 { --tw-text-opacity: 1; color: rgb(21 15 240 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t3:is(.dark *) { --tw-text-opacity: 1; color: rgb(128 128 255 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t4 { --tw-text-opacity: 1; color: rgb(136 0 191 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t4:is(.dark *) { --tw-text-opacity: 1; color: rgb(223 128 255 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t5 { --tw-text-opacity: 1; color: rgb(119 119 119 / var(--tw-text-opacity, 1)); } .colored-pinyin #reader-preview .added .pronunciation-help .t5:is(.dark *) { --tw-text-opacity: 1; color: rgb(198 198 198 / var(--tw-text-opacity, 1)); } .dynamic-range-30{grid-template-columns:repeat(30, minmax(0, 1fr))} @media only screen and (min-width: 640px){.dynamic-range-30{grid-template-columns:repeat(30, minmax(0, 1fr))}} .dynamic-range-60{grid-template-columns:repeat(30, minmax(0, 1fr))} @media only screen and (min-width: 640px){.dynamic-range-60{grid-template-columns:repeat(60, minmax(0, 1fr))}} .dynamic-range-90{grid-template-columns:repeat(30, minmax(0, 1fr))} @media only screen and (min-width: 640px){.dynamic-range-90{grid-template-columns:repeat(90, minmax(0, 1fr))}} .dynamic-range-180{grid-template-columns:repeat(30, minmax(0, 1fr))} @media only screen and (min-width: 640px){.dynamic-range-180{grid-template-columns:repeat(180, minmax(0, 1fr))}} .dynamic-range-365{grid-template-columns:repeat(30, minmax(0, 1fr))} @media only screen and (min-width: 640px){.dynamic-range-365{grid-template-columns:repeat(365, minmax(0, 1fr))}} .day-group-60,.day-group-90,.day-group-180,.day-group-365 { display: none; } @media (min-width: 640px) { .dynamic-range-60 .day-group-60 { display: flex; } .dynamic-range-90 .day-group-60 { display: flex; } .dynamic-range-90 .day-group-90 { display: flex; } .dynamic-range-180 .day-group-60 { display: flex; } .dynamic-range-180 .day-group-90 { display: flex; } .dynamic-range-180 .day-group-180 { display: flex; } .dynamic-range-365 .day-group-60 { display: flex; } .dynamic-range-365 .day-group-90 { display: flex; } .dynamic-range-365 .day-group-180 { display: flex; } .dynamic-range-365 .day-group-365 { display: flex; } } .day-separator { --tw-bg-opacity: 0.3; } .dynamic-range-180 .day-group-365 { display: none; } .dynamic-range-180 .day-value-label { display: none; } .dynamic-range-180 .day-date-label { display: none; } .dynamic-range-180 .day-separator { --tw-bg-opacity: 0.2; } .dynamic-range-365 .day-value-label { display: none; } .dynamic-range-365 .date-label-day { display: none; } .dynamic-range-365 .day-separator { --tw-bg-opacity: 0.1; } .day-group:hover .day-value-label { display: flex; } .day-group .label-day,.day-group .label-month,.day-group .label-weekday { display: none; padding-top: 0.5rem; } .day-group .label-month { position: relative; top: 1px; } .dynamic-range-30 .day-group .label-weekday { display: flex; } .dynamic-range-60 .day-group .label-month { display: flex; } .dynamic-range-90 .day-group .label-month { display: flex; } .dynamic-range-180 .day-group .label-month { display: flex; } .dynamic-range-365 .day-group .label-month { display: flex; } .code { margin-top: 1.5rem; width: 100%; border-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); padding: 1.5rem; --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .inline-code { font-weight: 600; --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1));font-family:monospace; } .api-reference p { margin-top: 1.5rem; } .api-reference p.no-margin { margin-top: 0px; } .api-reference h2 { margin-top: 4.5rem; } .tag-category { position: relative; margin-top: 0.75rem; display: flex; cursor: pointer; flex-direction: column; } .tag-title { display: flex; height: 2.5rem; align-items: center; font-weight: 600; } .tag-subcategory { display: flex; height: 2rem; cursor: pointer; align-items: center; border-left-width: 2px; --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } .tag-subcategory:hover { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .tag-subcategory a { position: relative; left: -2px; display: flex; height: 1.5rem; align-items: center; border-left-width: 2px; --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); padding-left: 0.75rem; } .direction-rtl{direction:rtl} .direction-ltr{direction:ltr} .public .list-catalog-title { font-size: 0.875rem; line-height: 1.25rem; } .list-catalog-title { font-weight: 700; --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } #lists-mini-menu a { cursor: pointer; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } #lists-mini-menu a:hover { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .public #lists-mini-menu .list-type { width: 162px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } #lists-mini-menu .list-type { width: 240px; } .tile-container { position: relative; height: 9px; width: 9px; cursor: pointer; } .tile-container .tile { display: flex; align-items: center; justify-content: center; overflow: hidden; } .tiles-large .tile-container { height: 18px; width: 18px; padding-right: 2px; padding-bottom: 2px; } .tiles-medium .tile-container { height: 12px; width: 12px; padding-right: 1px; padding-bottom: 1px; } .tiles-small .tile-container { height: 9px; width: 9px; padding-right: 1px; padding-bottom: 1px; } .tiles-tiny .tile-container { height: 6px; width: 6px; padding-right: 1px; padding-bottom: 1px; } .tiles-large .threshold-indicator { font-size: 10px; } .tiles-medium .threshold-indicator { font-size: 7px; } .tiles-small .threshold-indicator { font-size: 5px; } .tiles-tiny .threshold-indicator { font-size: 4px; } .tiles-large .tile-container .tile { border-radius: 0.25rem; } .tiles-medium .tile-container .tile { border-radius: 0.125rem; } .tiles-small .tile-container .tile { border-radius: 0.125rem; } .tiles-tiny .tile-container .tile { border-radius: 1px; } .tile { height: 100%; width: 100%; position: relative; left: 0px; border-radius: 1px; } .tile-container.unstudied .tile { border-width: 2px; --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } .tile-container.unstudied .tile:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); } .tiles-small .tile-container.unstudied .tile { border-width: 1px; } .tiles-tiny .tile-container.unstudied .tile { border-width: 1px; } .tile-container.strong .tile { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .tile-container.weak .tile { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .tile-container.weak .tile:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .tile-container.weak.correct .tile { position: relative; left: -5rem; --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); opacity: 0; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 700ms; } .tile-container.assumed .tile { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .tile-container.assumed .tile:is(.dark *) { background-color: rgb(171 139 202 / 0.75); } .tile-container.memorized .tile { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .tile-container.mastered .tile { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .tile-container.blocked .tile { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .tile-container.blocked .tile:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .tile-container.leech .tile { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .tile-container.leech .tile:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .tile-unstudied { border-width: 2px; --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } .tile-unstudied:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); } .tile-strong { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .tile-weak { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .tile-weak:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .tile-assumed { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .tile-assumed:is(.dark *) { background-color: rgb(171 139 202 / 0.75); } .tile-memorized { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .tile-mastered { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .tile-blocked { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .tile-blocked:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .tile-leech { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .tile-leech:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .privacy-level.selected { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); } .privacy-level .checkmark { display: none; } .privacy-level.selected .checkmark { display: flex; } .ambiguous-selected { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); } .ambiguous-selected:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } .ambiguous-selected.no-import { --tw-border-opacity: 1; border-color: rgb(239 71 111 / var(--tw-border-opacity, 1)); } .ambiguous-selected.no-import:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(239 71 111 / var(--tw-border-opacity, 1)); } .ambiguous-word-options .checkmark { display: none; } .ambiguous-word-options .ambiguous-selected .checkmark { display: flex; } .ambiguous-row { border-bottom-width: 4px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); } .ambiguous-row:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .ambiguous-row:last-of-type { border-style: none; } .wis-nav-button { display: flex; height: 1.5rem; width: 1.5rem; align-items: center; justify-content: center; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); font-size: 0.75rem; line-height: 1rem; } .wis-nav-button:hover { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .wis-nav-button:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .wis-nav-button:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } @media (min-width: 768px) { .wis-nav-button { height: 2rem; width: 2rem; } } .wis-nav-button.complete { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .wis-nav-button.complete:hover { background-color: rgb(6 214 160 / 0.9); } .wis-nav-button.selected { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .wis-nav-button.selected:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .wis-nav-button.complete.selected { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .user-word-note-container { display: flex; width: 100%; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem; border-radius: 0.75rem; border-width: 2px; border-style: dashed; padding: 1rem; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .user-word-note-container:hover { --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity, 1)); } .user-word-note-container:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .user-word-note-container:hover { --tw-scale-x: 1.03; --tw-scale-y: 1.03; 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)); } .user-word-note-container:active { --tw-scale-x: 0.97; --tw-scale-y: 0.97; 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)); transition-duration: 0s; } .user-word-note-container.editing-note { --tw-scale-x: 1; --tw-scale-y: 1; 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)); --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .user-word-note-container.editing-note:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .word-status { display: flex; height: 2.5rem; width: 100%; cursor: pointer; justify-content: space-between; border-radius: 0.75rem; padding-left: 0.75rem; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .word-status:hover { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity, 1)); } .word-status:active { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .word-status:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .word-status:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .word-status:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .word-status.unstudied { border-style: dashed; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); } .word-status.unstudied:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .word-status.memorized,.word-status.mastered { border-style: solid; border-color: transparent; background-color: rgb(66 106 247 / 0.1); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .word-status.memorized:hover,.word-status.mastered:hover { background-color: rgb(66 106 247 / 0.2); } .word-status.memorized:active,.word-status.mastered:active { background-color: rgb(66 106 247 / 0.3); } .word-status.blocked,.word-status.leech { border-style: solid; border-color: transparent; --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .word-status.blocked:hover,.word-status.leech:hover { background-color: rgb(0 0 0 / 0.7); } .word-status.blocked:active,.word-status.leech:active { background-color: rgb(0 0 0 / 0.4); } .word-status.assumed { border-style: solid; border-color: transparent; background-color: rgb(171 139 202 / 0.1); --tw-text-opacity: 1; color: rgb(171 139 202 / var(--tw-text-opacity, 1)); } .word-status.assumed:hover { background-color: rgb(171 139 202 / 0.2); } .word-status.assumed:active { background-color: rgb(171 139 202 / 0.3); } .word-status.learning { border-style: solid; border-color: transparent; background-color: rgb(6 214 160 / 0.1); --tw-text-opacity: 1; color: rgb(6 214 160 / var(--tw-text-opacity, 1)); } .word-status.learning:hover { background-color: rgb(6 214 160 / 0.2); } .word-status.learning:active { background-color: rgb(6 214 160 / 0.3); } .word-status.strong { border-style: solid; border-color: transparent; background-color: rgb(6 214 160 / 0.1); --tw-text-opacity: 1; color: rgb(6 214 160 / var(--tw-text-opacity, 1)); } .word-status.strong:hover { background-color: rgb(6 214 160 / 0.2); } .word-status.strong:active { background-color: rgb(6 214 160 / 0.3); } .word-status.weak { border-color: transparent; --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .word-status.weak:hover { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .word-status.weak:active { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .word-status.weak:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .word-status.weak:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .word-status.weak:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .word-status.unstudied .dd-tile { border-width: 2px; --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); } .word-status.strong .dd-tile { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .word-status.weak .dd-tile { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .word-status.memorized .dd-tile,.word-status.mastered .dd-tile { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .word-status.blocked .dd-tile,.word-status.leech .dd-tile { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .word-status.assumed .dd-tile { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .word-status-expanded { position: relative; display: flex; width: 100%; flex-direction: column; align-items: flex-start; border-radius: 10px; padding-top: 14px; padding-bottom: 14px; padding-left: 0.5rem; } .word-status-expanded .selected-border { height: 100%; width: 100%; border-radius: 10px; border-width: 2px; border-style: dashed; --tw-border-opacity: 0.4; } .word-status-expanded:hover .selected-border { --tw-border-opacity: 0.5; } .gbutton { display: flex; height: 2rem; width: 2rem; align-items: center; justify-content: center; border-radius: 0.5rem; font-size: 0.75rem; line-height: 1rem; cursor: pointer; background-image: linear-gradient(to top right, var(--tw-gradient-stops)); --tw-gradient-from: #f3f4f6 var(--tw-gradient-from-position); --tw-gradient-to: rgb(243 244 246 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); --tw-gradient-to: #d1d5db var(--tw-gradient-to-position); --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); transition-duration: 1000ms; } .gbutton:hover { --tw-scale-x: 1.15; --tw-scale-y: 1.15; 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)); --tw-gradient-from: #d1d5db var(--tw-gradient-from-position); --tw-gradient-to: rgb(209 213 219 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); --tw-gradient-to: #9ca3af var(--tw-gradient-to-position); --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); transition-property: none; } .gbutton:active { --tw-scale-x: .9; --tw-scale-y: .9; 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)); } #site-menu .menu-link { display: flex; width: 100%; cursor: pointer; align-items: center; justify-content: space-between; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 1.5rem; padding-right: 1.5rem; font-size: 1.125rem; line-height: 1.75rem; font-weight: 900; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } #site-menu .menu-link:hover { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } #site-menu .menu-link:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } #site-menu .menu-link:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { #site-menu .menu-link { justify-content: flex-start; border-left-width: 4px; padding-top: 0.75rem; padding-bottom: 0.75rem; padding-left: 6rem; padding-right: 0px; font-size: 1.5rem; line-height: 2rem; } } #site-menu .menu-link.large { padding-top: 0.25rem; padding-bottom: 0.25rem; font-size: 1.25rem; line-height: 1.75rem; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } #site-menu .menu-link.large:hover { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } #site-menu .menu-link.large:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } #site-menu .menu-link.large:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { #site-menu .menu-link.large { padding-top: 1rem; padding-bottom: 1rem; font-size: 3rem; line-height: 1; } } #site-menu .menu-link.xlarge { padding-top: 0.25rem; padding-bottom: 0.25rem; font-size: 1.875rem; line-height: 2.25rem; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } #site-menu .menu-link.xlarge:hover { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } #site-menu .menu-link.xlarge:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } #site-menu .menu-link.xlarge:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { #site-menu .menu-link.xlarge { padding-top: 1rem; padding-bottom: 1rem; font-size: 3rem; line-height: 1; } } #site-menu .menu-link .angle { position: relative; display: none; align-items: center; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 75ms; } @media (min-width: 640px) { #site-menu .menu-link .angle { display: flex; --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } } #site-menu .menu-link.large .angle { top: 1px; } #site-menu .menu-link.xlarge .angle { top: 1px; } .consistency-widget-month .day { position: relative; display: flex; height: 13px; width: 13px; align-items: center; justify-content: center; border-radius: 9999px; } .some-study-marker { display: none; height: 0.25rem; width: 0.25rem; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .some-study-marker:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .consistency-widget-month .day.some-study .some-study-marker { display: flex; } .consistency-widget-month.six-week .day { height: 12px; width: 12px; } .consistency-widget-month .day.studied { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .consistency-widget-month .day.studied:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .consistency-widget-month .day.some-study { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .consistency-widget-month .day.some-study:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .consistency-widget-month .day.no-study { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .consistency-widget-month .day.no-study:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .consistency-widget-month .day.future { border-width: 2px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); } #list-table { width: 100%; } #list-table th { cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding-left: 0.125rem; padding-right: 0.125rem; text-align: left; } #list-table th:last-child { padding-right: 0px; } #list-table td { padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.75rem; padding-right: 0.75rem; } .status-memorized { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .status-mastered { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .status-unstudied { border-width: 2px; --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } .status-assumed { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .status-strong { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .status-weak { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .status-weak:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .status-blocked { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .status-blocked:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .status-leech { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .status-leech:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .tooltip-relative { position: relative; } .tooltip-absolute { position: absolute; } .tooltip-relative .tooltiptext-container,.tooltip-absolute .tooltiptext-container { pointer-events: none; visibility: hidden; position: absolute; z-index: 999; display: none; width: 120px; align-items: center; justify-content: center; } @media (min-width: 640px) { .tooltip-relative .tooltiptext-container,.tooltip-absolute .tooltiptext-container { display: flex; } } .tooltiptext { z-index: 99; border-radius: 0.25rem; --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); padding-top: 0.125rem; padding-bottom: 0.125rem; padding-left: 0.5rem; padding-right: 0.5rem; text-align: center; font-size: 0.75rem; line-height: 1rem; --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .tooltip-relative:hover .tooltiptext-container,.tooltip-absolute:hover .tooltiptext-container { visibility: visible; } .tooltip-relative .tooltiptext-container,.tooltip-absolute .tooltiptext-container{bottom:120%;left:50%;margin-left:-60px} .tooltip-relative .tooltiptext-container.below,.tooltip-absolute .tooltiptext-container.below{top:160%;left:50%;margin-left:-60px} .tooltiptext-container i::after { border-radius: 0.125rem; --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));content:"";position:absolute;width:12px;height:12px;left:50%;bottom:-50%;transform:translate(-50%, -50%) rotate(45deg); } .tooltiptext-container .triangle { position: absolute; left: 50%; bottom: 2px; height: 0.75rem; width: 0.75rem; --tw-translate-y: 50%; --tw-translate-x: -50%; --tw-rotate: 45deg; --tw-scale-x: 0.80; --tw-scale-y: 0.80; 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)); border-radius: 0.125rem; --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .dark .fa-moon { display: none; } .fa-sun { display: none; } .fa-sun:is(.dark *) { display: inline-block; } .outlier-svg { height: auto; max-height: 100%; width: 100%; -o-object-fit: contain; object-fit: contain; } .outlier-svg:is(.dark *) { fill: #fff; } .outlier-svg g:is(.dark *) { fill: #fff; } .outlier-svg .st0 { fill: transparent; } .gray-button { display: flex; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; align-items: center; justify-content: center; border-radius: 0.75rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 75ms; } .gray-button:hover { --tw-scale-x: 1.04; --tw-scale-y: 1.04; 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)); --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .gray-button:active { --tw-scale-x: .96; --tw-scale-y: .96; 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)); --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .gray-button:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .gray-button:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .gray-button:active:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .gray-button{background:linear-gradient(to bottom right, #f5f5f5, #e5e5e5)} .dark .gray-button{background:linear-gradient(to bottom right, #4b5563, #374151)} .gray-button.light:is(.dark *) { --tw-gradient-from: #6b7280 var(--tw-gradient-from-position); --tw-gradient-to: rgb(107 114 128 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); --tw-gradient-to: #4b5563 var(--tw-gradient-to-position); --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .gray-button.light:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .gray-button.light:active:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .gray-button.medium:hover { --tw-scale-x: 1.03; --tw-scale-y: 1.03; 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)); } .gray-button.medium:active { --tw-scale-x: 0.97; --tw-scale-y: 0.97; 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)); } .gray-button.large:hover { --tw-scale-x: 1.02; --tw-scale-y: 1.02; 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)); } .gray-button.large:active { --tw-scale-x: 0.98; --tw-scale-y: 0.98; 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)); } .gray-button .gray-button-border { position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; border-radius: 0.75rem; border-top-width: 1px; border-left-width: 1px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); } .gray-button .gray-button-border:is(.dark *) { border-top-width: 0px; border-left-width: 0px; border-bottom-width: 1px; border-right-width: 1px; --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .gray-button.light .gray-button-border:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); } .gray-button:hover .gray-button-border { background-color: rgb(0 0 0 / 0.03); } .gray-button:hover .gray-button-border:is(.dark *) { background-color: rgb(255 255 255 / 0.03); } .toggle-slider { display: flex; height: 100%; cursor: pointer; align-items: center; justify-content: center; } .toggle-slider:hover { background-color: rgb(255 255 255 / 0.75); } .toggle-slider:active { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .toggle-slider:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .toggle-slider.selected { cursor: default; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .toggle-slider.selected:hover { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .toggle-slider.selected:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .toggle-slider.selected:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } *::-webkit-scrollbar { width: 8px; } *::-webkit-scrollbar-track { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } *:is(.dark *)::-webkit-scrollbar-track { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } *::-webkit-scrollbar-thumb { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } *:is(.dark *)::-webkit-scrollbar-thumb { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } #foundation *::-webkit-scrollbar { width: 0.25rem; } #foundation *::-webkit-scrollbar-track { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } #foundation *:is(.dark *)::-webkit-scrollbar-track { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } #foundation *::-webkit-scrollbar-thumb { border-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(53 171 229 / var(--tw-bg-opacity, 1)); } .list-status-bar { width: 100%; } .list-status-bar .status-group-container { display: flex; height: 100%; align-items: center; padding-left: 1px; padding-right: 1px; } .list-status-bar .status-group-container .status-group { height: 100%; width: 100%; border-radius: 0.125rem; } .list-status-bar .status-group-container .status-group.unstudied { height: 50%; width: 100%; border-radius: 0.125rem; } .list-status-bar .status-group-container:first-of-type .status-group { border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem; padding-left: 0px; } .list-status-bar .status-group-container:last-of-type .status-group { border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem; padding-right: 0px; } .audio-button-colors { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .audio-button-colors:hover { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .audio-button-colors:active { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .audio-button-colors:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .audio-button-colors:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .audio-button-colors:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .dashboard-widget-title { font-size: 1rem; line-height: 1.5rem; font-weight: 700; letter-spacing: 0.025em; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .dashboard-widget-title:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .dashboard-widget-title.mini { font-size: 0.875rem; line-height: 1.25rem; } .ui-border-color { --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); } .ui-border-color:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .cd { position: relative; display: flex; height: 1.25rem; width: 1.25rem; align-items: center; justify-content: center; --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); padding-bottom: 6px; } .empty-day { display: flex; height: 1.25rem; width: 1.25rem; } .cd.s,.cd.c,.cd.t,.cd.e { font-weight: 500; --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .streak-box { position: absolute; bottom: 0px; left: 0px; display: flex; height: 8px; width: 100%; align-items: center; justify-content: center; } .streak-ball { display: none; } .cd.s .streak-ball,.cd.e .streak-ball,.cd.t .streak-ball { display: flex; height: 6px; width: 6px; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .streak-left { display: none; } .streak-right { display: none; } .cd.c .streak-left,.cd.e .streak-left { position: absolute; top: 0px; left: 0px; display: flex; height: 100%; width: 100%; align-items: center; } .cd.s .streak-right,.cd.c .streak-right { position: absolute; top: 0px; left: 0px; display: flex; height: 100%; width: 100%; align-items: center; justify-content: flex-end; } .streak-left div { height: 2px; width: 50%; --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .streak-right div { height: 2px; width: 50%; --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .ui-button-styles { cursor: pointer; --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .ui-button-styles:hover { background-color: rgb(255 255 255 / 0.8); --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .ui-button-styles:active { --tw-scale-x: .95; --tw-scale-y: .95; 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)); --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .ui-button-styles:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .ui-button-styles:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .ui-button-styles:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .ui-button-styles-selected { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .ui-button-styles-selected:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .lists-nav-ui-button { display: flex; height: 3rem; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; align-items: center; gap: 0.75rem; overflow: hidden; border-radius: 10px; transition-property: all; transition-duration: 150ms; transition-duration: .4s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } @media (min-width: 640px) { .lists-nav-ui-button { height: 2.5rem; padding-left: 0.75rem; padding-right: 0.75rem; } } .lists-nav-ui-button-styles-unselected { width: 48px; cursor: pointer; justify-content: center; background-color: rgb(255 255 255 / 0.1); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .lists-nav-ui-button-styles-unselected:hover { background-color: rgb(255 255 255 / 0.2); transition-duration: 0s; } .lists-nav-ui-button-styles-unselected:active { --tw-scale-x: .95; --tw-scale-y: .95; 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)); background-color: rgb(255 255 255 / 0.3); } .lists-nav-ui-button-styles-selected { width: 48px; background-color: rgb(255 255 255 / 0.3); } @media (min-width: 640px) { .lists-nav-ui-button-styles-selected { width: 144px; } } .study-mode-button { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .cram-background{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%23426af7' fill-opacity='0.2' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E")} #breadcrumbs a { cursor: pointer; --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } #breadcrumbs a:hover { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .catalog-menu a { display: flex; cursor: pointer; border-left-width: 2px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); padding-top: 1px; padding-bottom: 1px; padding-left: 0.75rem; font-size: 0.875rem; line-height: 1.25rem; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .catalog-menu a:hover { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .catalog-menu a:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .catalog-menu a:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } .brick { position: relative; display: flex; min-width: 40px; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; border-radius: 0.5rem; padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.5rem; padding-right: 0.5rem; } .brick-weak { background-color: rgb(156 163 175 / 0.2); --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .brick-weak:hover { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .brick-weak:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .brick-assumed { background-color: rgb(171 139 202 / 0.2); --tw-text-opacity: 1; color: rgb(171 139 202 / var(--tw-text-opacity, 1)); } .brick-strong { background-color: rgb(6 214 160 / 0.1); --tw-text-opacity: 1; color: rgb(6 152 113 / var(--tw-text-opacity, 1)); } .brick-memorized,.brick-mastered { background-color: rgb(66 106 247 / 0.2); --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .brick-blocked,.brick-leech { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .brick-blocked:is(.dark *),.brick-leech:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .brick-unstudied { border-width: 2px; --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .brick-unstudied:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .selectable-box { position: relative; display: flex; width: 100%; cursor: pointer; flex-direction: column; gap: 0.5rem; border-radius: 0.75rem; border-width: 2px; padding: 1rem; } .selectable-box.unselected { --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .selectable-box.unselected:hover { --tw-scale-x: 102.5%; --tw-scale-y: 102.5%; 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)); border-color: rgb(66 106 247 / 0.7); } .selectable-box.unselected:active { --tw-scale-x: 97.5%; --tw-scale-y: 97.5%; 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)); --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); transition-duration: 0s; } .selectable-box.unselected:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .selectable-box.unselected:hover:is(.dark *) { border-color: rgb(79 195 247 / 0.7); } .selectable-box.unselected:active:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } .selectable-box.selected { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); } .selectable-box.selected:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } .selectable-box .title { display: flex; align-items: center; justify-content: space-between; font-size: 1.25rem; line-height: 1.75rem; font-weight: 700; } .selectable-box.selected .title { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .selectable-box.selected .title:is(.dark *) { --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } .selectable-box .checkbox { display: none; } .selectable-box.selected .checkbox { display: flex; } .panel-menu-button { display: flex; height: 3rem; width: 100%; cursor: pointer; align-items: center; border-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); padding-left: 1rem; padding-right: 1rem; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .panel-menu-button:hover { --tw-scale-x: 101.5%; --tw-scale-y: 101.5%; 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)); --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .panel-menu-button:active { --tw-scale-x: 98.5%; --tw-scale-y: 98.5%; 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)); --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); transition-duration: 0s; } .panel-menu-button:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .panel-menu-button:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .panel-menu-button:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .fast-opacity{transition:opacity 0 linear 0} .user-words-toggle { display: flex; height: 1rem; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; align-items: center; font-size: 0.875rem; line-height: 1.25rem; } .user-words-toggle.mobile { display: none; } @media (min-width: 768px) { .user-words-toggle.mobile { display: flex; } } .user-words-toggle>div { position: relative; display: flex; height: 100%; width: 1.75rem; align-items: center; border-radius: 0.75rem; --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); padding: 2px; } .user-words-toggle>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .invalid .user-words-toggle>div { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .user-words-toggle>div>div { margin-left: 0px; height: 0.75rem; width: 0.75rem; border-radius: 9999px; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .user-words-toggle>div>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .invalid .user-words-toggle>div>div { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .invalid .user-words-toggle>div>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .user-words-toggle.toggle-on>div { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .user-words-toggle.toggle-on>div:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .invalid .user-words-toggle.toggle-on>div { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .user-words-toggle.toggle-on>div>div { margin-left: 0.75rem; } .user-words-toggle div { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 100ms; transition-timing-function: cubic-bezier(0.4, 0, 1, 1); } .invalid .user-words-toggle div { transition-duration: 500ms; } @-webkit-keyframes bounce{0%,14%,20%,100%{transform:translateY(0)}10%{transform:translateY(-20px)}12%{transform:translateY(-20px)}} @keyframes bounce{0%,14%,20%,100%{transform:translateY(0)}10%{transform:translateY(-20px)}12%{transform:translateY(-20px)}} .lesson-shake{-webkit-animation:bounce 6s infinite;animation:bounce 6s infinite} @-webkit-keyframes glow{0%{box-shadow:0 0 3px #4fc3f7,0 0 6px #426af7,0 0 9px #4fc3f7,0 0 120px #426af7,0 0 15px #4fc3f7,0 0 18px #426af7}50%{box-shadow:0 0 12px #426af7,0 0 18px #4fc3f7,0 0 24px #426af7,0 0 30px #4fc3f7,0 0 36px #426af7,0 0 42px #4fc3f7}100%{box-shadow:0 0 3px #4fc3f7,0 0 6px #426af7,0 0 9px #4fc3f7,0 0 120px #426af7,0 0 15px #4fc3f7,0 0 18px #426af7}} @keyframes glow{0%{box-shadow:0 0 3px #4fc3f7,0 0 6px #426af7,0 0 9px #4fc3f7,0 0 120px #426af7,0 0 15px #4fc3f7,0 0 18px #426af7}50%{box-shadow:0 0 12px #426af7,0 0 18px #4fc3f7,0 0 24px #426af7,0 0 30px #4fc3f7,0 0 36px #426af7,0 0 42px #4fc3f7}100%{box-shadow:0 0 3px #4fc3f7,0 0 6px #426af7,0 0 9px #4fc3f7,0 0 120px #426af7,0 0 15px #4fc3f7,0 0 18px #426af7}} .glow{-webkit-animation:glow 5s ease-in-out infinite alternate;animation:glow 5s ease-in-out infinite alternate} .black-hole{width:1600px;height:1600px;background:radial-gradient(circle, black 0%, #1f2937 100%);border-radius:50%} .modal-background { position: fixed; inset: 0px; z-index: 999; display: flex; height: 100vh; width: 100vw; flex-direction: column; align-items: center; background-color: rgb(0 0 0 / 0.3); --tw-backdrop-blur: blur(2px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } @media (min-width: 1024px) { .modal-background { justify-content: flex-start; padding-left: 1.5rem; padding-right: 1.5rem; padding-top: 8rem; } } .elastic-in{transition-timing-function:cubic-bezier(0.34, 1.56, 0.64, 1)} .elastic-out{transition-timing-function:cubic-bezier(0.36, 0, 0.66, -0.56)} #algolia-search li { margin: 0px; } #algolia-search form { margin: 0px; } #algolia-search input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none} .radial-gradient{-webkit-animation:gradient1 8s linear infinite;animation:gradient1 8s linear infinite} @-webkit-keyframes gradient1{0%{background:radial-gradient(#e66465, #9198e5)}100%{background:radial-gradient(#32c17a, #d6d2ac)}} @keyframes gradient1{0%{background:radial-gradient(#e66465, #9198e5)}100%{background:radial-gradient(#32c17a, #d6d2ac)}} .containerx { position: relative; display: flex; height: 100%; width: 100%; align-items: center; justify-content: center; overflow: hidden; } .textx{position:absolute;text-align:center;line-height:1.5} .nothing { --tw-bg-opacity: 1; background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1)); } .textx span,.textx div{display:block;-webkit-animation:revealText 2.5s cubic-bezier(0.09, 0.86, 0.1, 1.275) forwards;animation:revealText 2.5s cubic-bezier(0.09, 0.86, 0.1, 1.275) forwards;background:radial-gradient(circle, transparent 0%, transparent 1.25%, rgba(53, 171, 229, 0.1) 3.5%, #35abe5 4.25%, #35abe5 4.5%, rgba(53, 171, 229, 0.15) 5%, rgba(53, 171, 229, 0.075) 7%, transparent 13%, transparent 100%);background-position:center;background-clip:text;-webkit-background-clip:text;color:transparent} @-webkit-keyframes revealText{0%{background-size:100% 100%}100%{background-size:650% 650%}} @keyframes revealText{0%{background-size:100% 100%}100%{background-size:650% 650%}} .outliertextzoom{-webkit-animation:scaleAnimation 1.5s cubic-bezier(0.09, 0.86, 0.1, 1.275) forwards;animation:scaleAnimation 1.5s cubic-bezier(0.09, 0.86, 0.1, 1.275) forwards} @-webkit-keyframes scaleAnimation{0%{transform:scale(0.5);opacity: 0}100%{transform:scale(1);opacity: 1}} @keyframes scaleAnimation{0%{transform:scale(0.5);opacity: 0}100%{transform:scale(1);opacity: 1}} .public-section-header { margin-bottom: 1.5rem; display: flex; flex-direction: column; align-items: center; gap: 1.5rem; } @media (min-width: 1024px) { .public-section-header { margin-bottom: 4rem; } } .public-section-mini-title { font-size: 0.875rem; line-height: 1.25rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.1em; --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { .public-section-mini-title { font-size: 1rem; line-height: 1.5rem; } } .public-section-title { font-size: 1.875rem; line-height: 2.25rem; font-weight: 700; --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { .public-section-title { font-size: 2.25rem; line-height: 2.5rem; } } @media (min-width: 768px) { .public-section-title { font-size: 3rem; line-height: 1.185; } } .public-section-desc { max-width: 24rem; text-align: center; line-height: 1.625; --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } @media (min-width: 640px) { .public-section-desc { max-width: 36rem; font-size: 1.125rem; line-height: 1.75rem; } } @media (min-width: 768px) { .public-section-desc { max-width: 36rem; } } @media (min-width: 1024px) { .public-section-desc { max-width: 42rem; } } .public-section-header.dark .public-section-title { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .public-section-header.dark .public-section-mini-title { --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } .public-section-header.dark .public-section-desc { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } @-webkit-keyframes moveRightUpAndBack{0%{transform:translate(0, 0)}50%{transform:translate(4px, -4px);@media screen and (min-width: 768px){transform:translate(8px, -8px)}}100%{transform:translate(0, 0)}} @keyframes moveRightUpAndBack{0%{transform:translate(0, 0)}50%{transform:translate(4px, -4px);@media screen and (min-width: 768px){transform:translate(8px, -8px)}}100%{transform:translate(0, 0)}} @-webkit-keyframes moveLeftUpAndBack{0%{transform:translate(0, 0)}50%{transform:translate(-4px, -4px);@media screen and (min-width: 768px){transform:translate(-8px, -8px)}}100%{transform:translate(0, 0)}} @keyframes moveLeftUpAndBack{0%{transform:translate(0, 0)}50%{transform:translate(-4px, -4px);@media screen and (min-width: 768px){transform:translate(-8px, -8px)}}100%{transform:translate(0, 0)}} @-webkit-keyframes moveRightDownAndBack{0%{transform:translate(0, 0)}50%{transform:translate(4px, 4px);@media screen and (min-width: 768px){transform:translate(8px, 8px)}}100%{transform:translate(0, 0)}} @keyframes moveRightDownAndBack{0%{transform:translate(0, 0)}50%{transform:translate(4px, 4px);@media screen and (min-width: 768px){transform:translate(8px, 8px)}}100%{transform:translate(0, 0)}} @-webkit-keyframes moveLeftDownAndBack{0%{transform:translate(0, 0)}50%{transform:translate(-4px, 4px);@media screen and (min-width: 768px){transform:translate(-8px, 8px)}}100%{transform:translate(0, 0)}} @keyframes moveLeftDownAndBack{0%{transform:translate(0, 0)}50%{transform:translate(-4px, 4px);@media screen and (min-width: 768px){transform:translate(-8px, 8px)}}100%{transform:translate(0, 0)}} #footer a,#footer .footer-link { cursor: pointer; } #footer a:hover,#footer .footer-link:hover { --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity, 1)); } #outlier-undergrid .cell { position: relative; height: 7rem; width: 14rem; } #outlier-undergrid .cell .trail.line { height: 50%; --tw-translate-y: 2px; 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)); border-bottom-width: 4px; border-style: dotted; } #outlier-undergrid .cell .trail.left { --tw-translate-x: -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)); } #outlier-undergrid .cell .trail.right { --tw-translate-x: 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)); } #outlier-undergrid .cell .trail.arc { position: absolute; top: -120px; height: 210px; width: 210px; } #outlier-undergrid .cell .trail.arc-left { left: 0px; --tw-translate-x: -2.25rem; 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)); } #outlier-undergrid .cell .trail.arc-right { right: 0px; --tw-translate-x: 2.25rem; 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)); } #outlier-undergrid .cell.status-locked .line,#outlier-undergrid .cell.status-locked .arc { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } #outlier-undergrid .cell.status-locked .line:is(.dark *),#outlier-undergrid .cell.status-locked .arc:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } #outlier-undergrid .cell.status-unlocked .line,#outlier-undergrid .cell.status-unlocked .arc,#outlier-undergrid .cell.status-complete .line,#outlier-undergrid .cell.status-complete .arc { --tw-border-opacity: 1; border-color: rgb(53 171 229 / var(--tw-border-opacity, 1)); } .p3 td { padding: 0.25rem; } @media (min-width: 370px) { .p3 td { padding: 0.75rem; } } .p3.tight td { padding: 0.25rem; } @media (min-width: 768px) { .p3.tight td { padding: 0.75rem; } } #foundation .b td { border-width: 1px; } #foundation .b td:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .dbstat-popup-1{width:calc(100% + 4px)} .dbstat-popup-2{width:calc(200% + 6px)} .dbstat-popup-3{width:calc(300% + 8px)} .dbstat-popup-4{width:calc(400% + 10px)} .modern-gradient{background-image:linear-gradient(to right in oklab, oklch(57.91% 0.2154 267.18) 0%, oklch(77.26% 0.1268 231.11) 100%)} #autocomplete li { margin: 0px; } .characterset-simplified .traditional { display: none; } .characterset-traditional .simplified { display: none; } .outlier-element-simp,.outlier-element-trad { display: none; } .characterset-simplified .outlier-element-simp,.characterset-traditional .outlier-element-trad,.characterset-both .outlier-element-simp,.characterset-both .outlier-element-trad { display: flex; } @media(min-width: 1024px)and (min-height: 810px){.mobile-beta-screen{display:none}} .brand-gradient{background:linear-gradient(to right, #426af7, #4fc3f7)} @media only screen and (min-width: 768px){.brand-gradient-at-medium{background:linear-gradient(to right, #426af7, #4fc3f7)}} .brand-gradient-down{background:linear-gradient(to bottom, #426af7, #4fc3f7)} .brand-gradient-up{background:linear-gradient(to top, #426af7, #4fc3f7)} .fade-r-to-transparent{background:linear-gradient(to right, white, transparent)} .dark .fade-r-to-transparent{background:linear-gradient(to right, #1f2937, transparent)} .gh:hover .gh-fade-from-transparent{background-image:linear-gradient(to right, transparent, #f3f4f6)} .dark .gh:hover .gh-fade-from-transparent{background-image:linear-gradient(to right, transparent, #374151)} .fade-d-to-transparent{background:linear-gradient(to bottom, white, transparent)} .dark .fade-d-to-transparent{background:linear-gradient(to bottom, #374051, transparent)} .new-list-button{background:linear-gradient(to bottom right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));transition:background .2s ease-in-out} .new-list-button:hover{background:linear-gradient(to bottom right, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.2))} .subtle-line{background:linear-gradient(to bottom, transparent, rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 0.25))} .launcher-flare-1{background:linear-gradient(to bottom right, #426af7, rgba(0, 0, 0, 0.8), #000000)} .launcher-flare-2{background:linear-gradient(to bottom left, #4fc3f7, rgba(0, 0, 0, 0.8), #000000)} .launcher-flare-3{background:linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.5), #000000)} .sitemenu-blur{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)} .word-memorizing{background:linear-gradient(to right, #426af7, transparent)} .word-blocking{background:linear-gradient(to right, #000000, transparent)} .word-resetting{background:linear-gradient(to right, #9ca3af, transparent)} .darkmode-toggle-button{background:linear-gradient(to bottom right, #1d4ed8, #4c1d95)} darkmode-toggle-button:hover{background:linear-gradient(to bottom right, #2563eb, #5b21b6)} .dark .darkmode-toggle-button{background:linear-gradient(to bottom right, #facc15, #ea580c)} .dark .darkmode-toggle-button:hover{background:linear-gradient(to bottom right, #fcd34d, #f97316)} .ocf-1{background:linear-gradient(to bottom right, rgba(53, 171, 229, 0.9), transparent)} .dark .ocf-1{background:linear-gradient(to bottom right, rgba(53, 171, 229, 0.8), transparent)} .ocf-2{background:linear-gradient(to bottom left, rgba(53, 171, 229, 0.9), transparent)} .dark .ocf-2{background:linear-gradient(to bottom left, rgba(53, 171, 229, 0.8), transparent)} .ocf-3{background:linear-gradient(to top left, rgba(53, 171, 229, 0.9), transparent)} .dark .ocf-3{background:linear-gradient(to top left, rgba(53, 171, 229, 0.8), transparent)} .ocf-4{background:linear-gradient(to top right, rgba(53, 171, 229, 0.9), transparent)} .dark .ocf-4{background:linear-gradient(to top right, rgba(53, 171, 229, 0.8), transparent)} .brand-gradient-text-reverse{background:linear-gradient(to right, #4fc3f7, #426af7);-webkit-background-clip:text;background-clip:text;color:transparent} .foundations-softscroll-top{background:linear-gradient(to bottom, white, transparent)} .dark .foundations-softscroll-top{background:linear-gradient(to bottom, #1f2937, transparent)} .foundations-softscroll-bottom{background:linear-gradient(to top, white, transparent)} .dark .foundations-softscroll-bottom{background:linear-gradient(to top, #1f2937, transparent)} .force-kaiti{font-family:"KaiTi",cursive} .custom-autocomplete-list{list-style:none;padding:0;margin:0;display: flex;flex-direction: column} .aa-Input { height: 100%; width: 100%; flex-grow: 1; align-items: center; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); padding-left: 1.5rem; padding-right: 1.5rem; font-size: 1.25rem; line-height: 1.75rem; outline: 2px solid transparent; outline-offset: 2px; } .aa-Input:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .aa-Item { border-bottom-width: 2px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); padding-left: 1.5rem; padding-right: 1.5rem; padding-top: 0.5rem; padding-bottom: 0.5rem; } .aa-Item:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } [aria-selected=true] { cursor: pointer; --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity, 1)); } [aria-selected=true]:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .algolia-select-action { visibility: hidden; } [aria-selected=true] .algolia-select-action { visibility: visible; } .aa-Form { margin: 0px; display: flex; height: 4rem; width: 100%; border-bottom-width: 2px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); } .aa-Form:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .aa-InputWrapper { z-index: 10; display: flex; flex-grow: 1; padding-right: 3rem; } .aa-InputWrapperPrefix { display: flex; height: 100%; align-items: center; padding-left: 1.5rem; } .aa-InputWrapperSuffix { display: none; } .search-result-index-label { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .search-result-index-label:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } [aria-selected=true] .search-result-index-label { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } [aria-selected=true] .search-result-index-label:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } table#issues td { padding: 0.75rem; vertical-align: top; } table#issues tbody td { border-top-width: 2px; border-bottom-width: 2px; --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); } table#issues tbody td:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } table#issues tr td:first-child { width: 11.5rem; } .dashboard-ministats-huge .ministat { font-size: 1.5rem; line-height: 2rem; } .dashboard-ministats-large .ministat { font-size: 1.875rem; line-height: 2.25rem; } .dashboard-ministats-normal .ministat { font-size: 2.25rem; line-height: 2.5rem; } @-webkit-keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} @keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} .animate-gradient{background-image:linear-gradient(to right, #4fc3f7, #426af7, #4fc3f7);background-size:300% 100%;-webkit-animation:gradientShift 8s ease-in-out infinite;animation:gradientShift 8s ease-in-out infinite} .promo-gradient{background:linear-gradient(to right, #426af7, #ef476f, #426af7)} .promo-gradient-simple{background:linear-gradient(to right, #426af7, #ef476f)} .last\:border-b-0:last-child { border-bottom-width: 0px; } .focus-within\:border-gray-200:focus-within { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); } .focus-within\:bg-gray-50:focus-within { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .hover\:right-\[2px\]:hover { right: 2px; } .hover\:z-10:hover { z-index: 10; } .hover\:z-50:hover { z-index: 50; } .hover\:z-\[999\]:hover { z-index: 999; } .hover\:w-\[278px\]:hover { width: 278px; } .hover\:scale-105:hover { --tw-scale-x: 1.05; --tw-scale-y: 1.05; 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)); } .hover\:scale-110:hover { --tw-scale-x: 1.1; --tw-scale-y: 1.1; 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)); } .hover\:scale-\[1\.01\]:hover { --tw-scale-x: 1.01; --tw-scale-y: 1.01; 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)); } .hover\:scale-\[1\.02\]:hover { --tw-scale-x: 1.02; --tw-scale-y: 1.02; 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)); } .hover\:scale-\[1\.03\]:hover { --tw-scale-x: 1.03; --tw-scale-y: 1.03; 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)); } .hover\:scale-\[101\.5\%\]:hover { --tw-scale-x: 101.5%; --tw-scale-y: 101.5%; 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)); } .hover\:scale-\[102\.5\%\]:hover { --tw-scale-x: 102.5%; --tw-scale-y: 102.5%; 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)); } .hover\:border-blue-brand:hover { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); } .hover\:border-blue-brand\/50:hover { border-color: rgb(66 106 247 / 0.5); } .hover\:border-gray-100:hover { --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)); } .hover\:border-gray-200:hover { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); } .hover\:border-gray-300:hover { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } .hover\:border-gray-400:hover { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); } .hover\:border-gray-500:hover { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); } .hover\:border-red:hover { --tw-border-opacity: 1; border-color: rgb(239 71 111 / var(--tw-border-opacity, 1)); } .hover\:border-red\/50:hover { border-color: rgb(239 71 111 / 0.5); } .hover\:bg-black\/10:hover { background-color: rgb(0 0 0 / 0.1); } .hover\:bg-blue-300:hover { --tw-bg-opacity: 1; background-color: rgb(147 197 253 / var(--tw-bg-opacity, 1)); } .hover\:bg-blue-600:hover { --tw-bg-opacity: 1; background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1)); } .hover\:bg-blue-700:hover { --tw-bg-opacity: 1; background-color: rgb(29 78 216 / var(--tw-bg-opacity, 1)); } .hover\:bg-blue-brand:hover { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .hover\:bg-blue-brand\/10:hover { background-color: rgb(66 106 247 / 0.1); } .hover\:bg-blue-brand\/90:hover { background-color: rgb(66 106 247 / 0.9); } .hover\:bg-blue-neon\/90:hover { background-color: rgb(79 195 247 / 0.9); } .hover\:bg-blue\/20:hover { background-color: rgb(17 138 178 / 0.2); } .hover\:bg-gray-100:hover { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .hover\:bg-gray-100\/70:hover { background-color: rgb(243 244 246 / 0.7); } .hover\:bg-gray-200:hover { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .hover\:bg-gray-300:hover { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .hover\:bg-gray-400\/10:hover { background-color: rgb(156 163 175 / 0.1); } .hover\:bg-gray-50:hover { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .hover\:bg-gray-700:hover { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .hover\:bg-green\/10:hover { background-color: rgb(6 214 160 / 0.1); } .hover\:bg-green\/40:hover { background-color: rgb(6 214 160 / 0.4); } .hover\:bg-purple\/10:hover { background-color: rgb(171 139 202 / 0.1); } .hover\:bg-red:hover { --tw-bg-opacity: 1; background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); } .hover\:bg-red\/10:hover { background-color: rgb(239 71 111 / 0.1); } .hover\:bg-red\/30:hover { background-color: rgb(239 71 111 / 0.3); } .hover\:bg-white\/10:hover { background-color: rgb(255 255 255 / 0.1); } .hover\:bg-opacity-20:hover { --tw-bg-opacity: 0.2; } .hover\:bg-opacity-30:hover { --tw-bg-opacity: 0.3; } .hover\:bg-opacity-80:hover { --tw-bg-opacity: 0.8; } .hover\:bg-opacity-90:hover { --tw-bg-opacity: 0.9; } .hover\:px-3:hover { padding-left: 0.75rem; padding-right: 0.75rem; } .hover\:pb-3:hover { padding-bottom: 0.75rem; } .hover\:text-black:hover { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .hover\:text-blue:hover { --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .hover\:text-blue-800:hover { --tw-text-opacity: 1; color: rgb(30 64 175 / var(--tw-text-opacity, 1)); } .hover\:text-blue-brand:hover { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .hover\:text-gray-100:hover { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .hover\:text-gray-400:hover { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .hover\:text-gray-500:hover { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .hover\:text-gray-600:hover { --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .hover\:text-gray-700:hover { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .hover\:text-gray-800:hover { --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity, 1)); } .hover\:text-gray-900:hover { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .hover\:text-red:hover { --tw-text-opacity: 1; color: rgb(239 71 111 / var(--tw-text-opacity, 1)); } .hover\:text-white:hover { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .hover\:text-opacity-100:hover { --tw-text-opacity: 1; } .hover\:underline:hover { -webkit-text-decoration-line: underline; text-decoration-line: underline; } .hover\:no-underline:hover { -webkit-text-decoration-line: none; text-decoration-line: none; } .hover\:opacity-100:hover { opacity: 1; } .hover\:opacity-80:hover { opacity: 0.8; } .hover\:opacity-90:hover { opacity: 0.9; } .hover\:shadow:hover { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .hover\:shadow-lg:hover { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .hover\:shadow-md:hover { --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); } .hover\:duration-100:hover { transition-duration: 100ms; } .hover\:duration-75:hover { transition-duration: 75ms; } .file\:hover\:scale-\[1\.03\]:hover::-webkit-file-upload-button { --tw-scale-x: 1.03; --tw-scale-y: 1.03; 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)); } .file\:hover\:scale-\[1\.03\]:hover::file-selector-button { --tw-scale-x: 1.03; --tw-scale-y: 1.03; 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)); } .focus\:border-green:focus { --tw-border-opacity: 1; border-color: rgb(6 214 160 / var(--tw-border-opacity, 1)); } .focus\:border-transparent:focus { border-color: transparent; } .focus\:bg-gray-100:focus { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .focus\:bg-gray-200:focus { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .focus\:bg-gray-50:focus { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px; } .focus\:ring-2:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); } .focus\:ring-blue-500:focus { --tw-ring-opacity: 1; --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1)); } .active\:right-\[1px\]:active { right: 1px; } .active\:scale-90:active { --tw-scale-x: .9; --tw-scale-y: .9; 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)); } .active\:scale-95:active { --tw-scale-x: .95; --tw-scale-y: .95; 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)); } .active\:scale-\[\.97\]:active { --tw-scale-x: .97; --tw-scale-y: .97; 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)); } .active\:scale-\[0\.975\]:active { --tw-scale-x: 0.975; --tw-scale-y: 0.975; 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)); } .active\:scale-\[0\.97\]:active { --tw-scale-x: 0.97; --tw-scale-y: 0.97; 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)); } .active\:scale-\[0\.98\]:active { --tw-scale-x: 0.98; --tw-scale-y: 0.98; 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)); } .active\:scale-\[1\.18\]:active { --tw-scale-x: 1.18; --tw-scale-y: 1.18; 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)); } .active\:scale-\[97\.5\%\]:active { --tw-scale-x: 97.5%; --tw-scale-y: 97.5%; 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)); } .active\:scale-\[98\.5\%\]:active { --tw-scale-x: 98.5%; --tw-scale-y: 98.5%; 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)); } .active\:cursor-grabbing:active { cursor: -webkit-grabbing; cursor: grabbing; } .active\:border-blue-neon:active { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } .active\:border-gray-200:active { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); } .active\:bg-black\/20:active { background-color: rgb(0 0 0 / 0.2); } .active\:bg-blue:active { --tw-bg-opacity: 1; background-color: rgb(17 138 178 / var(--tw-bg-opacity, 1)); } .active\:bg-blue-brand\/20:active { background-color: rgb(66 106 247 / 0.2); } .active\:bg-blue-neon:active { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .active\:bg-gray-100:active { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .active\:bg-gray-200:active { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .active\:bg-gray-300:active { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .active\:bg-gray-400\/20:active { background-color: rgb(156 163 175 / 0.2); } .active\:bg-gray-50:active { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .active\:bg-green\/20:active { background-color: rgb(6 214 160 / 0.2); } .active\:bg-purple\/20:active { background-color: rgb(171 139 202 / 0.2); } .active\:bg-red:active { --tw-bg-opacity: 1; background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); } .active\:bg-red\/20:active { background-color: rgb(239 71 111 / 0.2); } .active\:bg-white:active { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .active\:bg-white\/20:active { background-color: rgb(255 255 255 / 0.2); } .active\:bg-opacity-90:active { --tw-bg-opacity: 0.9; } .active\:text-gray-900:active { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .active\:text-white:active { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .active\:opacity-50:active { opacity: 0.5; } .active\:opacity-80:active { opacity: 0.8; } .active\:opacity-90:active { opacity: 0.9; } .active\:shadow:active { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .active\:shadow-sm:active { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .active\:shadow-blue:active { --tw-shadow-color: #118ab2; --tw-shadow: var(--tw-shadow-colored); } .active\:duration-0:active { transition-duration: 0s; } .active\:duration-75:active { transition-duration: 75ms; } .group:hover .group-hover\:visible { visibility: visible; } .group:hover .group-hover\:-left-\[4px\] { left: -4px; } .group:hover .group-hover\:-left-\[8px\] { left: -8px; } .group:hover .group-hover\:bottom-\[46px\] { bottom: 46px; } .group:hover .group-hover\:left-\[4px\] { left: 4px; } .group:hover .group-hover\:top-\[52px\] { top: 52px; } .group:hover .group-hover\:ml-3 { margin-left: 0.75rem; } .group:hover .group-hover\:ml-4 { margin-left: 1rem; } .group:hover .group-hover\:flex { display: flex; } .group:hover .group-hover\:hidden { display: none; } .group\/menu:hover .group-hover\/menu\:w-full { width: 100%; } .group\/action:hover .group-hover\/action\:scale-125 { --tw-scale-x: 1.25; --tw-scale-y: 1.25; 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)); } .group\/pin:hover .group-hover\/pin\:scale-110 { --tw-scale-x: 1.1; --tw-scale-y: 1.1; 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)); } .group:hover .group-hover\:scale-110 { --tw-scale-x: 1.1; --tw-scale-y: 1.1; 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)); } .group:hover .group-hover\:scale-125 { --tw-scale-x: 1.25; --tw-scale-y: 1.25; 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)); } .group:hover .group-hover\:scale-150 { --tw-scale-x: 1.5; --tw-scale-y: 1.5; 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)); } .group:hover .group-hover\:rounded-br-3xl { border-bottom-right-radius: 1.5rem; } .group:hover .group-hover\:border-blue { --tw-border-opacity: 1; border-color: rgb(17 138 178 / var(--tw-border-opacity, 1)); } .group:hover .group-hover\:border-blue-brand { --tw-border-opacity: 1; border-color: rgb(66 106 247 / var(--tw-border-opacity, 1)); } .group:hover .group-hover\:border-gray-300 { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } .group:hover .group-hover\:border-purple { --tw-border-opacity: 1; border-color: rgb(171 139 202 / var(--tw-border-opacity, 1)); } .group\/action:hover .group-hover\/action\:bg-gray-300 { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-black { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-black\/10 { background-color: rgb(0 0 0 / 0.1); } .group:hover .group-hover\:bg-blue-brand { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-blue-brand\/10 { background-color: rgb(66 106 247 / 0.1); } .group:hover .group-hover\:bg-blue-brand\/5 { background-color: rgb(66 106 247 / 0.05); } .group:hover .group-hover\:bg-blue-brand\/90 { background-color: rgb(66 106 247 / 0.9); } .group:hover .group-hover\:bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-gray-200 { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-gray-300 { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-gray-300\/10 { background-color: rgb(209 213 219 / 0.1); } .group:hover .group-hover\:bg-gray-400 { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-gray-400\/10 { background-color: rgb(156 163 175 / 0.1); } .group:hover .group-hover\:bg-gray-50 { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-green { --tw-bg-opacity: 1; background-color: rgb(6 214 160 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-green\/10 { background-color: rgb(6 214 160 / 0.1); } .group:hover .group-hover\:bg-purple { --tw-bg-opacity: 1; background-color: rgb(171 139 202 / var(--tw-bg-opacity, 1)); } .group:hover .group-hover\:bg-purple\/10 { background-color: rgb(171 139 202 / 0.1); } .group:hover .group-hover\:bg-purple\/90 { background-color: rgb(171 139 202 / 0.9); } .group:hover .group-hover\:bg-opacity-20 { --tw-bg-opacity: 0.2; } .group:hover .group-hover\:bg-opacity-50 { --tw-bg-opacity: 0.5; } .group:hover .group-hover\:bg-opacity-60 { --tw-bg-opacity: 0.6; } .group:hover .group-hover\:bg-opacity-70 { --tw-bg-opacity: 0.7; } .group:hover .group-hover\:bg-opacity-90 { --tw-bg-opacity: 0.9; } .group:hover .group-hover\:bg-gradient-to-r { background-image: linear-gradient(to right, var(--tw-gradient-stops)); } .group:hover .group-hover\:from-transparent { --tw-gradient-from: transparent var(--tw-gradient-from-position); --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .group:hover .group-hover\:to-gray-100 { --tw-gradient-to: #f3f4f6 var(--tw-gradient-to-position); } .group\/menu:hover .group-hover\/menu\:px-3 { padding-left: 0.75rem; padding-right: 0.75rem; } .group:hover .group-hover\:pl-3 { padding-left: 0.75rem; } .group:hover .group-hover\:pr-0 { padding-right: 0px; } .group\/pin:hover .group-hover\/pin\:text-gray-400 { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .group:hover .group-hover\:text-blue { --tw-text-opacity: 1; color: rgb(17 138 178 / var(--tw-text-opacity, 1)); } .group:hover .group-hover\:text-blue-brand { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .group:hover .group-hover\:text-gray-400 { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .group:hover .group-hover\:text-gray-500 { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .group:hover .group-hover\:text-gray-600 { --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .group:hover .group-hover\:text-gray-700 { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity, 1)); } .group:hover .group-hover\:text-white { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .group:hover .group-hover\:text-opacity-0 { --tw-text-opacity: 0; } .group\/consistency:hover .group-hover\/consistency\:opacity-100 { opacity: 1; } .group\/menu:hover .group-hover\/menu\:opacity-100 { opacity: 1; } .group\/mini-stats:hover .group-hover\/mini-stats\:opacity-100 { opacity: 1; } .group\/reset:hover .group-hover\/reset\:opacity-0 { opacity: 0; } .group\/reset:hover .group-hover\/reset\:opacity-100 { opacity: 1; } .group:hover .group-hover\:opacity-0 { opacity: 0; } .group:hover .group-hover\:opacity-100 { opacity: 1; } .group:hover .group-hover\:opacity-20 { opacity: 0.2; } .group:hover .group-hover\:opacity-5 { opacity: 0.05; } .group\/menu:hover .group-hover\/menu\:delay-100 { transition-delay: 100ms; } .group\/menu:hover .group-hover\/menu\:duration-100 { transition-duration: 100ms; } .group:active .group-active\:invisible { visibility: hidden; } .group:active .group-active\:hidden { display: none; } .group\/pin:active .group-active\/pin\:scale-95 { --tw-scale-x: .95; --tw-scale-y: .95; 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)); } .group:active .group-active\:scale-150 { --tw-scale-x: 1.5; --tw-scale-y: 1.5; 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)); } .group:active .group-active\:scale-90 { --tw-scale-x: .9; --tw-scale-y: .9; 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)); } .group:active .group-active\:scale-95 { --tw-scale-x: .95; --tw-scale-y: .95; 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)); } .group:active .group-active\:border-gray-400 { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); } .group\/action:active .group-active\/action\:bg-gray-400 { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .group:active .group-active\:bg-black\/20 { background-color: rgb(0 0 0 / 0.2); } .group:active .group-active\:bg-blue-brand { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .group:active .group-active\:bg-blue-brand\/20 { background-color: rgb(66 106 247 / 0.2); } .group:active .group-active\:bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .group:active .group-active\:bg-gray-200 { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .group:active .group-active\:bg-gray-300 { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .group:active .group-active\:bg-gray-300\/20 { background-color: rgb(209 213 219 / 0.2); } .group:active .group-active\:bg-gray-400 { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .group:active .group-active\:bg-gray-400\/20 { background-color: rgb(156 163 175 / 0.2); } .group:active .group-active\:bg-green\/20 { background-color: rgb(6 214 160 / 0.2); } .group:active .group-active\:bg-purple\/20 { background-color: rgb(171 139 202 / 0.2); } .group\/pin:active .group-active\/pin\:text-gray-300 { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .group\/pin:active .group-active\/pin\:text-gray-500 { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .group:active .group-active\:text-blue-brand { --tw-text-opacity: 1; color: rgb(66 106 247 / var(--tw-text-opacity, 1)); } .group:active .group-active\:text-gray-200 { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .group:active .group-active\:transition-none { transition-property: none; } .group\/pin:active .group-active\/pin\:duration-0 { transition-duration: 0s; } .group:active .group-active\:duration-0 { transition-duration: 0s; } .dark\:block:is(.dark *) { display: block; } .dark\:flex:is(.dark *) { display: flex; } .dark\:hidden:is(.dark *) { display: none; } .dark\:h-16:is(.dark *) { height: 4rem; } .dark\:h-\[13px\]:is(.dark *) { height: 13px; } .dark\:w-\[13px\]:is(.dark *) { width: 13px; } .dark\:rounded:is(.dark *) { border-radius: 0.25rem; } .dark\:rounded-\[5px\]:is(.dark *) { border-radius: 5px; } .dark\:border:is(.dark *) { border-width: 1px; } .dark\:border-b:is(.dark *) { border-bottom-width: 1px; } .dark\:border-l-0:is(.dark *) { border-left-width: 0px; } .dark\:border-r:is(.dark *) { border-right-width: 1px; } .dark\:border-t-0:is(.dark *) { border-top-width: 0px; } .dark\:border-black:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(0 0 0 / var(--tw-border-opacity, 1)); } .dark\:border-blue-neon:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } .dark\:border-gray-400:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); } .dark\:border-gray-500:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); } .dark\:border-gray-600:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .dark\:border-gray-700:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .dark\:border-gray-800:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(31 41 55 / var(--tw-border-opacity, 1)); } .dark\:border-yellow-ltl:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(253 212 64 / var(--tw-border-opacity, 1)); } .dark\:border-t-gray-600:is(.dark *) { --tw-border-opacity: 1; border-top-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .dark\:bg-black:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .dark\:bg-black\/20:is(.dark *) { background-color: rgb(0 0 0 / 0.2); } .dark\:bg-blue-brand\/30:is(.dark *) { background-color: rgb(66 106 247 / 0.3); } .dark\:bg-blue-neon:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(79 195 247 / var(--tw-bg-opacity, 1)); } .dark\:bg-blue-outlier\/20:is(.dark *) { background-color: rgb(53 171 229 / 0.2); } .dark\:bg-gray-300:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .dark\:bg-gray-400:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .dark\:bg-gray-500:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .dark\:bg-gray-600:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .dark\:bg-gray-700:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .dark\:bg-gray-700\/50:is(.dark *) { background-color: rgb(55 65 81 / 0.5); } .dark\:bg-gray-800:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .dark\:bg-gray-900:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1)); } .dark\:bg-green-dark:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(28 187 140 / var(--tw-bg-opacity, 1)); } .dark\:bg-green\/20:is(.dark *) { background-color: rgb(6 214 160 / 0.2); } .dark\:bg-red\/20:is(.dark *) { background-color: rgb(239 71 111 / 0.2); } .dark\:bg-red\/40:is(.dark *) { background-color: rgb(239 71 111 / 0.4); } .dark\:bg-transparent:is(.dark *) { background-color: transparent; } .dark\:bg-white:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .dark\:bg-yellow-800:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(133 77 14 / var(--tw-bg-opacity, 1)); } .dark\:bg-yellow-ltl:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(253 212 64 / var(--tw-bg-opacity, 1)); } .dark\:bg-yellow\/40:is(.dark *) { background-color: rgb(255 209 102 / 0.4); } .dark\:bg-yellow\/90:is(.dark *) { background-color: rgb(255 209 102 / 0.9); } .dark\:bg-opacity-10:is(.dark *) { --tw-bg-opacity: 0.1; } .dark\:bg-opacity-15:is(.dark *) { --tw-bg-opacity: 0.15; } .dark\:bg-opacity-30:is(.dark *) { --tw-bg-opacity: 0.3; } .dark\:bg-opacity-40:is(.dark *) { --tw-bg-opacity: 0.4; } .dark\:bg-opacity-5:is(.dark *) { --tw-bg-opacity: 0.05; } .dark\:bg-opacity-50:is(.dark *) { --tw-bg-opacity: 0.5; } .dark\:bg-opacity-70:is(.dark *) { --tw-bg-opacity: 0.7; } .dark\:from-gray-600:is(.dark *) { --tw-gradient-from: #4b5563 var(--tw-gradient-from-position); --tw-gradient-to: rgb(75 85 99 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .dark\:from-gray-700:is(.dark *) { --tw-gradient-from: #374151 var(--tw-gradient-from-position); --tw-gradient-to: rgb(55 65 81 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .dark\:from-gray-800:is(.dark *) { --tw-gradient-from: #1f2937 var(--tw-gradient-from-position); --tw-gradient-to: rgb(31 41 55 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .dark\:via-gray-800:is(.dark *) { --tw-gradient-to: rgb(31 41 55 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), #1f2937 var(--tw-gradient-via-position), var(--tw-gradient-to); } .dark\:to-gray-700:is(.dark *) { --tw-gradient-to: #374151 var(--tw-gradient-to-position); } .dark\:fill-white:is(.dark *) { fill: #fff; } .dark\:text-black:is(.dark *) { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .dark\:text-blue-400:is(.dark *) { --tw-text-opacity: 1; color: rgb(96 165 250 / var(--tw-text-opacity, 1)); } .dark\:text-blue-bright:is(.dark *) { --tw-text-opacity: 1; color: rgb(23 189 243 / var(--tw-text-opacity, 1)); } .dark\:text-blue-neon:is(.dark *) { --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } .dark\:text-gray-100:is(.dark *) { --tw-text-opacity: 1; color: rgb(243 244 246 / var(--tw-text-opacity, 1)); } .dark\:text-gray-200:is(.dark *) { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .dark\:text-gray-300:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .dark\:text-gray-400:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .dark\:text-gray-500:is(.dark *) { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } .dark\:text-gray-600:is(.dark *) { --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)); } .dark\:text-gray-900:is(.dark *) { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity, 1)); } .dark\:text-red\/80:is(.dark *) { color: rgb(239 71 111 / 0.8); } .dark\:text-white:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .dark\:text-yellow-200:is(.dark *) { --tw-text-opacity: 1; color: rgb(254 240 138 / var(--tw-text-opacity, 1)); } .dark\:text-yellow-300:is(.dark *) { --tw-text-opacity: 1; color: rgb(253 224 71 / var(--tw-text-opacity, 1)); } .dark\:text-yellow-ltl:is(.dark *) { --tw-text-opacity: 1; color: rgb(253 212 64 / var(--tw-text-opacity, 1)); } .dark\:shadow-none:is(.dark *) { --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .dark\:brightness-110:is(.dark *) { --tw-brightness: brightness(1.1); 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); } .dark\:brightness-125:is(.dark *) { --tw-brightness: brightness(1.25); 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); } .dark\:brightness-150:is(.dark *) { --tw-brightness: brightness(1.5); 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); } .dark\:backdrop-blur-\[4px\]:is(.dark *) { --tw-backdrop-blur: blur(4px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } .dark\:focus-within\:border-gray-600:focus-within:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .dark\:hover\:border-blue-neon:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(79 195 247 / var(--tw-border-opacity, 1)); } .dark\:hover\:border-blue-neon\/75:hover:is(.dark *) { border-color: rgb(79 195 247 / 0.75); } .dark\:hover\:border-gray-300:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(209 213 219 / var(--tw-border-opacity, 1)); } .dark\:hover\:border-gray-500:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); } .dark\:hover\:border-gray-600:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .dark\:hover\:border-gray-700:hover:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .dark\:hover\:border-red\/75:hover:is(.dark *) { border-color: rgb(239 71 111 / 0.75); } .dark\:hover\:bg-blue-brand:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(66 106 247 / var(--tw-bg-opacity, 1)); } .dark\:hover\:bg-gray-500:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .dark\:hover\:bg-gray-600:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .dark\:hover\:bg-gray-700:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .dark\:hover\:bg-gray-800:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .dark\:hover\:bg-red:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(239 71 111 / var(--tw-bg-opacity, 1)); } .dark\:hover\:bg-red\/30:hover:is(.dark *) { background-color: rgb(239 71 111 / 0.3); } .dark\:hover\:bg-transparent:hover:is(.dark *) { background-color: transparent; } .dark\:hover\:text-black:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity, 1)); } .dark\:hover\:text-blue-neon:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } .dark\:hover\:text-gray-300:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .dark\:hover\:text-gray-400:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .dark\:hover\:text-white:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .dark\:hover\:opacity-100:hover:is(.dark *) { opacity: 1; } .dark\:hover\:brightness-105:hover:is(.dark *) { --tw-brightness: brightness(1.05); 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); } .dark\:hover\:brightness-125:hover:is(.dark *) { --tw-brightness: brightness(1.25); 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); } .dark\:focus\:bg-gray-700:focus:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .dark\:active\:border-gray-600:active:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(75 85 99 / var(--tw-border-opacity, 1)); } .dark\:active\:border-gray-700:active:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(55 65 81 / var(--tw-border-opacity, 1)); } .dark\:active\:bg-gray-500:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .dark\:active\:bg-gray-600:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .dark\:active\:bg-gray-700:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .dark\:active\:bg-gray-800:active:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1)); } .dark\:active\:bg-red\/40:active:is(.dark *) { background-color: rgb(239 71 111 / 0.4); } .dark\:active\:text-gray-300:active:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .dark\:active\:text-gray-400:active:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .dark\:active\:text-white:active:is(.dark *) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .dark\:active\:opacity-100:active:is(.dark *) { opacity: 1; } .dark\:active\:brightness-150:active:is(.dark *) { --tw-brightness: brightness(1.5); 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); } .group:hover .dark\:group-hover\:border-gray-500:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(107 114 128 / var(--tw-border-opacity, 1)); } .group\/action:hover .dark\:group-hover\/action\:bg-gray-900:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1)); } .group:hover .dark\:group-hover\:bg-gray-300:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1)); } .group:hover .dark\:group-hover\:bg-gray-500:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .group:hover .dark\:group-hover\:bg-gray-600:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .group:hover .dark\:group-hover\:bg-gray-700:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .group:hover .dark\:group-hover\:bg-green-light:is(.dark *) { background-color: rgba(73, 225, 185, 1); } .group:hover .dark\:group-hover\:bg-white:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .group:hover .dark\:group-hover\:bg-opacity-100:is(.dark *) { --tw-bg-opacity: 1; } .group:hover .dark\:group-hover\:text-gray-200:is(.dark *) { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity, 1)); } .group:hover .dark\:group-hover\:text-gray-300:is(.dark *) { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .group:hover .dark\:group-hover\:text-gray-400:is(.dark *) { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity, 1)); } .group:active .dark\:group-active\:border-gray-400:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity, 1)); } .group\/action:active .dark\:group-active\/action\:bg-black:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)); } .group:active .dark\:group-active\:bg-gray-500:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); } .group:active .dark\:group-active\:bg-gray-600:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .group:active .dark\:group-active\:text-blue-neon:is(.dark *) { --tw-text-opacity: 1; color: rgb(79 195 247 / var(--tw-text-opacity, 1)); } @media (min-width: 370px) { .xxs\:ml-auto { margin-left: auto; } .xxs\:mr-2 { margin-right: 0.5rem; } .xxs\:inline { display: inline; } .xxs\:flex { display: flex; } .xxs\:hidden { display: none; } .xxs\:h-2 { height: 0.5rem; } .xxs\:w-2 { width: 0.5rem; } .xxs\:w-\[100px\] { width: 100px; } .xxs\:w-\[102px\] { width: 102px; } .xxs\:w-\[75px\] { width: 75px; } .xxs\:w-\[83px\] { width: 83px; } .xxs\:flex-row { flex-direction: row; } .xxs\:gap-1 { gap: 0.25rem; } .xxs\:gap-2 { gap: 0.5rem; } .xxs\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } .xxs\:text-5xl { font-size: 3rem; line-height: 1; } .xxs\:text-base { font-size: 1rem; line-height: 1.5rem; } .xxs\:text-lg { font-size: 1.125rem; line-height: 1.75rem; } .xxs\:text-sm { font-size: 0.875rem; line-height: 1.25rem; } } @media (min-width: 475px) { .xs\:-ml-1 { margin-left: -0.25rem; } .xs\:-ml-2 { margin-left: -0.5rem; } .xs\:-mt-5 { margin-top: -1.25rem; } .xs\:ml-0 { margin-left: 0px; } .xs\:flex { display: flex; } .xs\:hidden { display: none; } .xs\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));; } .xs\:justify-start { justify-content: flex-start; } .xs\:gap-2 { gap: 0.5rem; } .xs\:gap-3 { gap: 0.75rem; } .xs\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } .xs\:text-5xl { font-size: 3rem; line-height: 1; } .xs\:text-base { font-size: 1rem; line-height: 1.5rem; } .xs\:text-sm { font-size: 0.875rem; line-height: 1.25rem; } } @media (min-width: 640px) { .sm\:absolute { position: absolute; } .sm\:sticky { position: -webkit-sticky; position: sticky; } .sm\:bottom-0 { bottom: 0px; } .sm\:bottom-3 { bottom: 0.75rem; } .sm\:bottom-7 { bottom: 1.75rem; } .sm\:bottom-auto { bottom: auto; } .sm\:left-0 { left: 0px; } .sm\:right-3 { right: 0.75rem; } .sm\:right-\[18px\] { right: 18px; } .sm\:top-0 { top: 0px; } .sm\:top-1 { top: 0.25rem; } .sm\:top-16 { top: 4rem; } .sm\:top-28 { top: 7rem; } .sm\:top-\[66px\] { top: 66px; } .sm\:top-auto { top: auto; } .sm\:order-2 { order: 2; } .sm\:col-span-2 { grid-column: span 2 / span 2; } .sm\:col-span-3 { grid-column: span 3 / span 3; } .sm\:mx-2 { margin-left: 0.5rem; margin-right: 0.5rem; } .sm\:mx-4 { margin-left: 1rem; margin-right: 1rem; } .sm\:mb-0 { margin-bottom: 0px; } .sm\:mb-24 { margin-bottom: 6rem; } .sm\:mb-3 { margin-bottom: 0.75rem; } .sm\:mb-4 { margin-bottom: 1rem; } .sm\:mb-6 { margin-bottom: 1.5rem; } .sm\:mb-8 { margin-bottom: 2rem; } .sm\:ml-0 { margin-left: 0px; } .sm\:ml-12 { margin-left: 3rem; } .sm\:ml-2 { margin-left: 0.5rem; } .sm\:mr-12 { margin-right: 3rem; } .sm\:mr-3 { margin-right: 0.75rem; } .sm\:mt-0 { margin-top: 0px; } .sm\:mt-2 { margin-top: 0.5rem; } .sm\:mt-20 { margin-top: 5rem; } .sm\:mt-24 { margin-top: 6rem; } .sm\:mt-3 { margin-top: 0.75rem; } .sm\:mt-4 { margin-top: 1rem; } .sm\:mt-6 { margin-top: 1.5rem; } .sm\:block { display: block; } .sm\:inline-block { display: inline-block; } .sm\:inline { display: inline; } .sm\:flex { display: flex; } .sm\:table-cell { display: table-cell; } .sm\:grid { display: grid; } .sm\:hidden { display: none; } .sm\:h-1\/3 { height: 33.333333%; } .sm\:h-10 { height: 2.5rem; } .sm\:h-14 { height: 3.5rem; } .sm\:h-16 { height: 4rem; } .sm\:h-2\/3 { height: 66.666667%; } .sm\:h-3 { height: 0.75rem; } .sm\:h-32 { height: 8rem; } .sm\:h-46 { height: 11.5rem; } .sm\:h-56 { height: 14rem; } .sm\:h-96 { height: 24rem; } .sm\:h-\[2px\] { height: 2px; } .sm\:h-\[500px\] { height: 500px; } .sm\:h-\[72px\] { height: 72px; } .sm\:h-auto { height: auto; } .sm\:h-full { height: 100%; } .sm\:max-h-\[640px\] { max-height: 640px; } .sm\:w-1\/5 { width: 20%; } .sm\:w-10 { width: 2.5rem; } .sm\:w-14 { width: 3.5rem; } .sm\:w-2\/3 { width: 66.666667%; } .sm\:w-3 { width: 0.75rem; } .sm\:w-36 { width: 9rem; } .sm\:w-4\/5 { width: 80%; } .sm\:w-44 { width: 11rem; } .sm\:w-48 { width: 12rem; } .sm\:w-8 { width: 2rem; } .sm\:w-\[100px\] { width: 100px; } .sm\:w-\[144px\] { width: 144px; } .sm\:w-\[160px\] { width: 160px; } .sm\:w-\[164px\] { width: 164px; } .sm\:w-\[196px\] { width: 196px; } .sm\:w-\[200px\] { width: 200px; } .sm\:w-\[204px\] { width: 204px; } .sm\:w-\[4px\] { width: 4px; } .sm\:w-\[612px\] { width: 612px; } .sm\:w-\[650px\] { width: 650px; } .sm\:w-auto { width: auto; } .sm\:w-full { width: 100%; } .sm\:max-w-2xl { max-width: 42rem; } .sm\:max-w-prose { max-width: 65ch; } .sm\:max-w-xl { max-width: 36rem; } .sm\:max-w-xs { max-width: 20rem; } .sm\:-translate-x-48 { --tw-translate-x: -12rem; 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)); } .sm\:-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)); } .sm\:-translate-y-full { --tw-translate-y: -100%; 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)); } .sm\:columns-2 { -moz-columns: 2; columns: 2; } .sm\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));; } .sm\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));; } .sm\:grid-cols-\[auto_1fr\] { grid-template-columns: auto 1fr; } .sm\:flex-row { flex-direction: row; } .sm\:flex-col { flex-direction: column; } .sm\:items-end { align-items: flex-end; } .sm\:items-center { align-items: center; } .sm\:justify-start { justify-content: flex-start; } .sm\:justify-end { justify-content: flex-end; } .sm\:justify-center { justify-content: center; } .sm\:gap-0 { gap: 0px; } .sm\:gap-10 { gap: 2.5rem; } .sm\:gap-12 { gap: 3rem; } .sm\:gap-3 { gap: 0.75rem; } .sm\:gap-4 { gap: 1rem; } .sm\:gap-5 { gap: 1.25rem; } .sm\:gap-6 { gap: 1.5rem; } .sm\:gap-8 { gap: 2rem; } .sm\:space-y-3 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.75rem * var(--tw-space-y-reverse)); } .sm\:rounded-2xl { border-radius: 1rem; } .sm\:rounded-3xl { border-radius: 1.5rem; } .sm\:rounded-lg { border-radius: 0.5rem; } .sm\:rounded-xl { border-radius: 0.75rem; } .sm\:rounded-b-xl { border-bottom-right-radius: 0.75rem; border-bottom-left-radius: 0.75rem; } .sm\:border-\[12px\] { border-width: 12px; } .sm\:border-none { border-style: none; } .sm\:border-white { --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity, 1)); } .sm\:bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .sm\:bg-transparent { background-color: transparent; } .sm\:bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .sm\:bg-white\/80 { background-color: rgb(255 255 255 / 0.8); } .sm\:p-10 { padding: 2.5rem; } .sm\:p-24 { padding: 6rem; } .sm\:p-4 { padding: 1rem; } .sm\:p-6 { padding: 1.5rem; } .sm\:p-8 { padding: 2rem; } .sm\:px-0 { padding-left: 0px; padding-right: 0px; } .sm\:px-12 { padding-left: 3rem; padding-right: 3rem; } .sm\:px-3 { padding-left: 0.75rem; padding-right: 0.75rem; } .sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } .sm\:px-8 { padding-left: 2rem; padding-right: 2rem; } .sm\:py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; } .sm\:py-32 { padding-top: 8rem; padding-bottom: 8rem; } .sm\:pb-0 { padding-bottom: 0px; } .sm\:pb-24 { padding-bottom: 6rem; } .sm\:pl-0 { padding-left: 0px; } .sm\:pl-0\.5 { padding-left: 0.125rem; } .sm\:pl-1 { padding-left: 0.25rem; } .sm\:pl-3 { padding-left: 0.75rem; } .sm\:pl-36 { padding-left: 9rem; } .sm\:pl-5 { padding-left: 1.25rem; } .sm\:pl-6 { padding-left: 1.5rem; } .sm\:pl-\[3px\] { padding-left: 3px; } .sm\:pl-\[6px\] { padding-left: 6px; } .sm\:pr-16 { padding-right: 4rem; } .sm\:pr-24 { padding-right: 6rem; } .sm\:pr-3 { padding-right: 0.75rem; } .sm\:pr-6 { padding-right: 1.5rem; } .sm\:pt-0 { padding-top: 0px; } .sm\:pt-10 { padding-top: 2.5rem; } .sm\:pt-12 { padding-top: 3rem; } .sm\:pt-3 { padding-top: 0.75rem; } .sm\:pt-32 { padding-top: 8rem; } .sm\:pt-\[66px\] { padding-top: 66px; } .sm\:text-left { text-align: left; } .sm\:text-center { text-align: center; } .sm\:text-right { text-align: right; } .sm\:text-2xl { font-size: 1.5rem; line-height: 2rem; } .sm\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; } .sm\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; } .sm\:text-5xl { font-size: 3rem; line-height: 1; } .sm\:text-6xl { font-size: 3.75rem; line-height: 1; } .sm\:text-7xl { font-size: 4.5rem; line-height: 1; } .sm\:text-8xl { font-size: 6rem; line-height: 1; } .sm\:text-\[142px\] { font-size: 142px; } .sm\:text-base { font-size: 1rem; line-height: 1.5rem; } .sm\:text-lg { font-size: 1.125rem; line-height: 1.75rem; } .sm\:text-sm { font-size: 0.875rem; line-height: 1.25rem; } .sm\:text-xl { font-size: 1.25rem; line-height: 1.75rem; } .sm\:text-xs { font-size: 0.75rem; line-height: 1rem; } .sm\:leading-snug { line-height: 1.375; } .sm\:opacity-0 { opacity: 0; } .sm\:hover\:scale-105:hover { --tw-scale-x: 1.05; --tw-scale-y: 1.05; 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)); } .sm\:hover\:bg-gray-200:hover { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)); } .sm\:active\:scale-95:active { --tw-scale-x: .95; --tw-scale-y: .95; 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)); } .sm\:active\:duration-75:active { transition-duration: 75ms; } .group:hover .sm\:group-hover\:scale-105 { --tw-scale-x: 1.05; --tw-scale-y: 1.05; 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)); } .group:hover .sm\:group-hover\:scale-125 { --tw-scale-x: 1.25; --tw-scale-y: 1.25; 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)); } .group:hover .sm\:group-hover\:scale-150 { --tw-scale-x: 1.5; --tw-scale-y: 1.5; 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)); } .group:hover .sm\:group-hover\:border-blue-outlier { --tw-border-opacity: 1; border-color: rgb(53 171 229 / var(--tw-border-opacity, 1)); } .group:hover .sm\:group-hover\:bg-blue-outlier { --tw-bg-opacity: 1; background-color: rgb(53 171 229 / var(--tw-bg-opacity, 1)); } .group:hover .sm\:group-hover\:text-blue-outlier { --tw-text-opacity: 1; color: rgb(53 171 229 / var(--tw-text-opacity, 1)); } .group:hover .sm\:group-hover\:text-red\/60 { color: rgb(239 71 111 / 0.6); } .group:hover .sm\:group-hover\:text-white { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .dark\:sm\:bg-gray-700:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } .sm\:dark\:bg-gray-900\/90:is(.dark *) { background-color: rgb(17 24 39 / 0.9); } .sm\:dark\:bg-transparent:is(.dark *) { background-color: transparent; } .sm\:dark\:hover\:bg-gray-600:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1)); } .group:hover .dark\:sm\:group-hover\:text-red\/80:is(.dark *) { color: rgb(239 71 111 / 0.8); } } @media (min-width: 768px) { .md\:static { position: static; } .md\:fixed { position: fixed; } .md\:absolute { position: absolute; } .md\:bottom-\[41px\] { bottom: 41px; } .md\:bottom-auto { bottom: auto; } .md\:left-0 { left: 0px; } .md\:left-1 { left: 0.25rem; } .md\:left-auto { left: auto; } .md\:right-0 { right: 0px; } .md\:right-auto { right: auto; } .md\:top-16 { top: 4rem; } .md\:top-\[-180px\] { top: -180px; } .md\:top-\[232px\] { top: 232px; } .md\:top-full { top: 100%; } .md\:order-1 { order: 1; } .md\:order-2 { order: 2; } .md\:order-first { order: -9999; } .md\:order-last { order: 9999; } .md\:col-span-2 { grid-column: span 2 / span 2; } .md\:my-12 { margin-top: 3rem; margin-bottom: 3rem; } .md\:-mr-1 { margin-right: -0.25rem; } .md\:mb-0 { margin-bottom: 0px; } .md\:mb-0\.5 { margin-bottom: 0.125rem; } .md\:mb-1 { margin-bottom: 0.25rem; } .md\:mb-12 { margin-bottom: 3rem; } .md\:mb-2 { margin-bottom: 0.5rem; } .md\:mb-3 { margin-bottom: 0.75rem; } .md\:mb-5 { margin-bottom: 1.25rem; } .md\:mb-8 { margin-bottom: 2rem; } .md\:ml-0 { margin-left: 0px; } .md\:ml-12 { margin-left: 3rem; } .md\:ml-20 { margin-left: 5rem; } .md\:ml-3 { margin-left: 0.75rem; } .md\:ml-6 { margin-left: 1.5rem; } .md\:ml-\[18px\] { margin-left: 18px; } .md\:ml-\[37px\] { margin-left: 37px; } .md\:mr-2 { margin-right: 0.5rem; } .md\:mr-3 { margin-right: 0.75rem; } .md\:mr-6 { margin-right: 1.5rem; } .md\:mr-\[37px\] { margin-right: 37px; } .md\:mt-0 { margin-top: 0px; } .md\:mt-14 { margin-top: 3.5rem; } .md\:mt-16 { margin-top: 4rem; } .md\:mt-20 { margin-top: 5rem; } .md\:mt-32 { margin-top: 8rem; } .md\:mt-44 { margin-top: 11rem; } .md\:mt-6 { margin-top: 1.5rem; } .md\:mt-8 { margin-top: 2rem; } .md\:block { display: block; } .md\:inline { display: inline; } .md\:flex { display: flex; } .md\:table-cell { display: table-cell; } .md\:grid { display: grid; } .md\:hidden { display: none; } .md\:h-12 { height: 3rem; } .md\:h-14 { height: 3.5rem; } .md\:h-16 { height: 4rem; } .md\:h-20 { height: 5rem; } .md\:h-36 { height: 9rem; } .md\:h-4 { height: 1rem; } .md\:h-52 { height: 13rem; } .md\:h-72 { height: 18rem; } .md\:h-80 { height: 20rem; } .md\:h-96 { height: 24rem; } .md\:h-\[100px\] { height: 100px; } .md\:h-\[140px\] { height: 140px; } .md\:h-\[50px\] { height: 50px; } .md\:h-auto { height: auto; } .md\:h-full { height: 100%; } .md\:w-1\/2 { width: 50%; } .md\:w-1\/3 { width: 33.333333%; } .md\:w-11 { width: 2.75rem; } .md\:w-2\/3 { width: 66.666667%; } .md\:w-28 { width: 7rem; } .md\:w-3\/4 { width: 75%; } .md\:w-32 { width: 8rem; } .md\:w-44 { width: 11rem; } .md\:w-46 { width: 11.5rem; } .md\:w-52 { width: 13rem; } .md\:w-72 { width: 18rem; } .md\:w-8 { width: 2rem; } .md\:w-80 { width: 20rem; } .md\:w-96 { width: 24rem; } .md\:w-\[100px\] { width: 100px; } .md\:w-\[129px\] { width: 129px; } .md\:w-\[130px\] { width: 130px; } .md\:w-\[166px\] { width: 166px; } .md\:w-\[200px\] { width: 200px; } .md\:w-\[220px\] { width: 220px; } .md\:w-\[360px\] { width: 360px; } .md\:w-\[394px\] { width: 394px; } .md\:w-\[523px\] { width: 523px; } .md\:w-auto { width: auto; } .md\:max-w-3xl { max-width: 48rem; } .md\:max-w-lg { max-width: 32rem; } .md\:max-w-md { max-width: 28rem; } .md\:max-w-sm { max-width: 24rem; } .md\:max-w-xl { max-width: 36rem; } .md\:columns-3 { -moz-columns: 3; columns: 3; } .md\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));; } .md\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));; } .md\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));; } .md\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .md\:flex-row { flex-direction: row; } .md\:items-center { align-items: center; } .md\:justify-start { justify-content: flex-start; } .md\:justify-center { justify-content: center; } .md\:justify-between { justify-content: space-between; } .md\:gap-12 { gap: 3rem; } .md\:gap-16 { gap: 4rem; } .md\:gap-4 { gap: 1rem; } .md\:gap-5 { gap: 1.25rem; } .md\:gap-6 { gap: 1.5rem; } .md\:gap-8 { gap: 2rem; } .md\:space-x-\[18px\] > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(18px * var(--tw-space-x-reverse)); margin-left: calc(18px * calc(1 - var(--tw-space-x-reverse))); } .md\:space-y-8 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(2rem * var(--tw-space-y-reverse)); } .md\:rounded { border-radius: 0.25rem; } .md\:rounded-lg { border-radius: 0.5rem; } .md\:rounded-xl { border-radius: 0.75rem; } .md\:rounded-b-xl { border-bottom-right-radius: 0.75rem; border-bottom-left-radius: 0.75rem; } .md\:rounded-t-lg { border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; } .md\:border { border-width: 1px; } .md\:border-0 { border-width: 0px; } .md\:border-b-0 { border-bottom-width: 0px; } .md\:border-l { border-left-width: 1px; } .md\:border-r-2 { border-right-width: 2px; } .md\:bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .md\:bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .md\:p-0 { padding: 0px; } .md\:p-10 { padding: 2.5rem; } .md\:p-12 { padding: 3rem; } .md\:p-6 { padding: 1.5rem; } .md\:p-8 { padding: 2rem; } .md\:px-0 { padding-left: 0px; padding-right: 0px; } .md\:px-12 { padding-left: 3rem; padding-right: 3rem; } .md\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } .md\:px-8 { padding-left: 2rem; padding-right: 2rem; } .md\:py-0 { padding-top: 0px; padding-bottom: 0px; } .md\:py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; } .md\:py-12 { padding-top: 3rem; padding-bottom: 3rem; } .md\:py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; } .md\:py-20 { padding-top: 5rem; padding-bottom: 5rem; } .md\:py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; } .md\:pb-24 { padding-bottom: 6rem; } .md\:pb-28 { padding-bottom: 7rem; } .md\:pb-3 { padding-bottom: 0.75rem; } .md\:pb-6 { padding-bottom: 1.5rem; } .md\:pl-6 { padding-left: 1.5rem; } .md\:pl-7 { padding-left: 1.75rem; } .md\:pl-\[640px\] { padding-left: 640px; } .md\:pl-\[76px\] { padding-left: 76px; } .md\:pr-12 { padding-right: 3rem; } .md\:pr-6 { padding-right: 1.5rem; } .md\:pr-8 { padding-right: 2rem; } .md\:pr-80 { padding-right: 20rem; } .md\:pr-\[344px\] { padding-right: 344px; } .md\:pr-\[72px\] { padding-right: 72px; } .md\:pt-0 { padding-top: 0px; } .md\:pt-0\.5 { padding-top: 0.125rem; } .md\:pt-20 { padding-top: 5rem; } .md\:pt-3 { padding-top: 0.75rem; } .md\:pt-52 { padding-top: 13rem; } .md\:pt-8 { padding-top: 2rem; } .md\:text-left { text-align: left; } .md\:text-2xl { font-size: 1.5rem; line-height: 2rem; } .md\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; } .md\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; } .md\:text-5xl { font-size: 3rem; line-height: 1; } .md\:text-6xl { font-size: 3.75rem; line-height: 1; } .md\:text-7xl { font-size: 4.5rem; line-height: 1; } .md\:text-8xl { font-size: 6rem; line-height: 1; } .md\:text-base { font-size: 1rem; line-height: 1.5rem; } .md\:text-lg { font-size: 1.125rem; line-height: 1.75rem; } .md\:text-sm { font-size: 0.875rem; line-height: 1.25rem; } .md\:text-xl { font-size: 1.25rem; line-height: 1.75rem; } .md\:leading-9 { line-height: 2.25rem; } .md\:leading-normal { line-height: 1.5; } .md\:leading-relaxed { line-height: 1.625; } .md\:leading-tight { line-height: 1.25; } .md\:text-opacity-50 { --tw-text-opacity: 0.5; } .md\:opacity-0 { opacity: 0; } .md\:opacity-100 { opacity: 1; } .md\:shadow-2xl { --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .md\:shadow-lg { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .md\:shadow-xl { --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .md\:ease-\[cubic-bezier\(0\.34\2c 1\.56\2c 0\.64\2c 1\)\] { transition-timing-function: cubic-bezier(0.34,1.56,0.64,1); } .md\:ease-\[cubic-bezier\(0\.36\2c 0\2c 0\.66\2c -0\.56\)\] { transition-timing-function: cubic-bezier(0.36,0,0.66,-0.56); } .md\:hover\:z-\[60\]:hover { z-index: 60; } .group:hover .md\:group-hover\:flex { display: flex; } .md\:dark\:bg-gray-400:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1)); } .md\:dark\:bg-gray-700:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1)); } } @media (min-width: 1024px) { .lg\:relative { position: relative; } .lg\:-left-0\.5 { left: -0.125rem; } .lg\:-right-0\.5 { right: -0.125rem; } .lg\:bottom-6 { bottom: 1.5rem; } .lg\:left-auto { left: auto; } .lg\:top-3 { top: 0.75rem; } .lg\:top-\[316px\] { top: 316px; } .lg\:top-auto { top: auto; } .lg\:order-1 { order: 1; } .lg\:order-10 { order: 10; } .lg\:order-11 { order: 11; } .lg\:order-12 { order: 12; } .lg\:order-13 { order: 13; } .lg\:order-14 { order: 14; } .lg\:order-15 { order: 15; } .lg\:order-2 { order: 2; } .lg\:order-3 { order: 3; } .lg\:order-4 { order: 4; } .lg\:order-5 { order: 5; } .lg\:order-6 { order: 6; } .lg\:order-7 { order: 7; } .lg\:order-8 { order: 8; } .lg\:order-9 { order: 9; } .lg\:col-span-2 { grid-column: span 2 / span 2; } .lg\:col-span-3 { grid-column: span 3 / span 3; } .lg\:col-start-2 { grid-column-start: 2; } .lg\:mx-3 { margin-left: 0.75rem; margin-right: 0.75rem; } .lg\:my-14 { margin-top: 3.5rem; margin-bottom: 3.5rem; } .lg\:my-20 { margin-top: 5rem; margin-bottom: 5rem; } .lg\:my-6 { margin-top: 1.5rem; margin-bottom: 1.5rem; } .lg\:-mt-12 { margin-top: -3rem; } .lg\:mb-0 { margin-bottom: 0px; } .lg\:mb-12 { margin-bottom: 3rem; } .lg\:mb-16 { margin-bottom: 4rem; } .lg\:mb-20 { margin-bottom: 5rem; } .lg\:mb-6 { margin-bottom: 1.5rem; } .lg\:ml-20 { margin-left: 5rem; } .lg\:ml-3 { margin-left: 0.75rem; } .lg\:ml-auto { margin-left: auto; } .lg\:mr-12 { margin-right: 3rem; } .lg\:mr-3 { margin-right: 0.75rem; } .lg\:mt-0 { margin-top: 0px; } .lg\:mt-10 { margin-top: 2.5rem; } .lg\:mt-12 { margin-top: 3rem; } .lg\:mt-14 { margin-top: 3.5rem; } .lg\:mt-2 { margin-top: 0.5rem; } .lg\:mt-3 { margin-top: 0.75rem; } .lg\:mt-32 { margin-top: 8rem; } .lg\:mt-6 { margin-top: 1.5rem; } .lg\:mt-\[166px\] { margin-top: 166px; } .lg\:block { display: block; } .lg\:inline-block { display: inline-block; } .lg\:inline { display: inline; } .lg\:flex { display: flex; } .lg\:hidden { display: none; } .lg\:h-10 { height: 2.5rem; } .lg\:h-12 { height: 3rem; } .lg\:h-18 { height: 4.5rem; } .lg\:h-24 { height: 6rem; } .lg\:h-40 { height: 10rem; } .lg\:h-52 { height: 13rem; } .lg\:h-60 { height: 15rem; } .lg\:h-8 { height: 2rem; } .lg\:h-96 { height: 24rem; } .lg\:h-auto { height: auto; } .lg\:h-full { height: 100%; } .lg\:w-1\/3 { width: 33.333333%; } .lg\:w-10 { width: 2.5rem; } .lg\:w-24 { width: 6rem; } .lg\:w-32 { width: 8rem; } .lg\:w-4\/9 { width: 44.4444444%; } .lg\:w-48 { width: 12rem; } .lg\:w-5\/9 { width: 55.5555555%; } .lg\:w-56 { width: 14rem; } .lg\:w-72 { width: 18rem; } .lg\:w-96 { width: 24rem; } .lg\:w-\[122px\] { width: 122px; } .lg\:w-\[212px\] { width: 212px; } .lg\:w-\[260px\] { width: 260px; } .lg\:w-\[500px\] { width: 500px; } .lg\:w-\[calc\(100\%_-_260px\)\] { width: calc(100% - 260px); } .lg\:w-auto { width: auto; } .lg\:w-full { width: 100%; } .lg\:max-w-2xl { max-width: 42rem; } .lg\:max-w-3xl { max-width: 48rem; } .lg\:max-w-5xl { max-width: 64rem; } .lg\:shrink-0 { flex-shrink: 0; } .lg\:flex-grow { flex-grow: 1; } .lg\:grow { flex-grow: 1; } .lg\:-translate-x-1\/2 { --tw-translate-x: -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)); } .lg\:translate-x-1\/2 { --tw-translate-x: 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)); } .lg\:translate-y-0 { --tw-translate-y: 0px; 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)); } .lg\:columns-4 { -moz-columns: 4; columns: 4; } .lg\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .lg\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));; } .lg\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));; } .lg\:flex-row { flex-direction: row; } .lg\:flex-nowrap { flex-wrap: nowrap; } .lg\:items-center { align-items: center; } .lg\:justify-start { justify-content: flex-start; } .lg\:justify-end { justify-content: flex-end; } .lg\:justify-center { justify-content: center; } .lg\:justify-between { justify-content: space-between; } .lg\:gap-0 { gap: 0px; } .lg\:gap-12 { gap: 3rem; } .lg\:gap-18 { gap: 4.5rem; } .lg\:gap-6 { gap: 1.5rem; } .lg\:gap-8 { gap: 2rem; } .lg\:rounded { border-radius: 0.25rem; } .lg\:rounded-xl { border-radius: 0.75rem; } .lg\:border-b-0 { border-bottom-width: 0px; } .lg\:border-l-2 { border-left-width: 2px; } .lg\:border-r-2 { border-right-width: 2px; } .lg\:border-t-0 { border-top-width: 0px; } .lg\:bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1)); } .lg\:bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } .lg\:bg-gradient-to-r { background-image: linear-gradient(to right, var(--tw-gradient-stops)); } .lg\:p-0 { padding: 0px; } .lg\:p-1 { padding: 0.25rem; } .lg\:p-10 { padding: 2.5rem; } .lg\:p-12 { padding: 3rem; } .lg\:p-24 { padding: 6rem; } .lg\:p-6 { padding: 1.5rem; } .lg\:p-8 { padding: 2rem; } .lg\:px-0 { padding-left: 0px; padding-right: 0px; } .lg\:px-0\.5 { padding-left: 0.125rem; padding-right: 0.125rem; } .lg\:px-16 { padding-left: 4rem; padding-right: 4rem; } .lg\:px-2 { padding-left: 0.5rem; padding-right: 0.5rem; } .lg\:px-3 { padding-left: 0.75rem; padding-right: 0.75rem; } .lg\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } .lg\:px-8 { padding-left: 2rem; padding-right: 2rem; } .lg\:py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; } .lg\:py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; } .lg\:py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; } .lg\:pb-12 { padding-bottom: 3rem; } .lg\:pb-\[168px\] { padding-bottom: 168px; } .lg\:pb-\[268px\] { padding-bottom: 268px; } .lg\:pl-6 { padding-left: 1.5rem; } .lg\:pl-8 { padding-left: 2rem; } .lg\:pr-48 { padding-right: 12rem; } .lg\:pr-6 { padding-right: 1.5rem; } .lg\:pr-9 { padding-right: 2.25rem; } .lg\:pt-24 { padding-top: 6rem; } .lg\:pt-32 { padding-top: 8rem; } .lg\:pt-4 { padding-top: 1rem; } .lg\:text-left { text-align: left; } .lg\:text-2xl { font-size: 1.5rem; line-height: 2rem; } .lg\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; } .lg\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; } .lg\:text-5xl { font-size: 3rem; line-height: 1; } .lg\:text-6xl { font-size: 3.75rem; line-height: 1; } .lg\:text-7xl { font-size: 4.5rem; line-height: 1; } .lg\:text-base { font-size: 1rem; line-height: 1.5rem; } .lg\:text-lg { font-size: 1.125rem; line-height: 1.75rem; } .lg\:text-sm { font-size: 0.875rem; line-height: 1.25rem; } .lg\:text-xl { font-size: 1.25rem; line-height: 1.75rem; } .lg\:text-gray-300 { --tw-text-opacity: 1; color: rgb(209 213 219 / var(--tw-text-opacity, 1)); } .lg\:shadow-2xl { --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .lg\:hover\:shadow-2xl:hover { --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .dark\:lg\:text-gray-500:is(.dark *) { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity, 1)); } } @media (min-width: 1280px) { .xl\:left-0 { left: 0px; } .xl\:right-auto { right: auto; } .xl\:block { display: block; } .xl\:flex { display: flex; } .xl\:hidden { display: none; } .xl\:w-64 { width: 16rem; } .xl\:w-\[640px\] { width: 640px; } .xl\:max-w-6xl { max-width: 72rem; } .xl\:columns-5 { -moz-columns: 5; columns: 5; } .xl\:grid-cols-16 { grid-template-columns: repeat(16, minmax(0, 1fr)); } .xl\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .xl\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));; } .xl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));; } .xl\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));; } .xl\:gap-\[5px\] { gap: 5px; } .xl\:px-0 { padding-left: 0px; padding-right: 0px; } .xl\:text-6xl { font-size: 3.75rem; line-height: 1; } .xl\:opacity-0 { opacity: 0; } .group:hover .xl\:group-hover\:opacity-100 { opacity: 1; } } @media (min-width: 1536px) { .\32xl\:mr-\[84px\] { margin-right: 84px; } .\32xl\:flex { display: flex; } .\32xl\:w-8 { width: 2rem; } .\32xl\:w-\[196px\] { width: 196px; } .\32xl\:columns-6 { -moz-columns: 6; columns: 6; } .\32xl\:grid-cols-18 { grid-template-columns: repeat(18, minmax(0, 1fr)); } .\32xl\:gap-\[6px\] { gap: 6px; } .\32xl\:p-8 { padding: 2rem; } .\32xl\:px-8 { padding-left: 2rem; padding-right: 2rem; } .\32xl\:pl-8 { padding-left: 2rem; } .\32xl\:pl-9 { padding-left: 2.25rem; } .\32xl\:pr-24 { padding-right: 6rem; } .\32xl\:pr-8 { padding-right: 2rem; } .\32xl\:pr-\[88px\] { padding-right: 88px; } .\32xl\:pt-4 { padding-top: 1rem; } .\32xl\:opacity-0 { opacity: 0; } } .\[\&\&_a\]\:text-blue-600.\[\&\&_a\]\:text-blue-600 a { --tw-text-opacity: 1; color: rgb(37 99 235 / var(--tw-text-opacity, 1)); } .\[\&\&_td\]\:border-b-2.\[\&\&_td\]\:border-b-2 td { border-bottom-width: 2px; } .\[\&\&_td\]\:border-gray-200.\[\&\&_td\]\:border-gray-200 td { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity, 1)); } .\[\&\&_td\]\:p-2.\[\&\&_td\]\:p-2 td { padding: 0.5rem; } .\[\&\&_td\]\:align-top.\[\&\&_td\]\:align-top td { vertical-align: top; } @media(min-width:384px) { .\[\@media\(min-width\:384px\)\]\:inline { display: inline; } .\[\@media\(min-width\:384px\)\]\:hidden { display: none; } } /*# sourceMappingURL=application.css.map */