@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap"); /*** The new CSS reset - version 1.11.3 (last updated 25.08.2024) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Fix mobile Safari increase font-size on landscape mode */ html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu, summary { list-style: none; } /* Firefox: solve issue where nested ordered lists continue numbering from parent (https://bugzilla.mozilla.org/show_bug.cgi?id=1881517) */ ol { counter-reset: revert; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; box-sizing: border-box; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; box-sizing: border-box; } /* Remove details summary webkit styles */ ::-webkit-details-marker { display: none; } :root { color-scheme: dark; --body-bg: #22252a; --text-primary: #3d87f5; --text-hover-primary: #5596f6; --text-secondary: #f66031; --text-hover-secondary: #f7734a; --text-danger: #e4606d; --text-hover-danger: #dc3545; --text-dark: #e0e0e0; --text-hover-dark: #fff; --text-light: #000; --bg-color-light: #272a30; --bg-color-light-transparent: rgba(39, 42, 48, 0); --bg-color: #22252a; --text-color: #f2f2f2; --border-color: #4a4c4f; --border-even-color: #454f5e; --border-highlighted-color: #765d3f; --block-bg-color: #2e3238; --block-even-bg-color: #363e49; --block-highlighted-bg-color: #594126; --block-bg-color-hover: #353941; --block-bg-color-hover-dark: #454b54; --text-muted-color: #9e9e9e; --text-muted-hover-color: #bababa; --text-blockquote-color: #c7c7d1; --link-color: #7dc3f7; --link-hover-bg-color: #4c5767; --header-bg-color: #18191b; --header-bottom-bg-color: #000; --header-bottom-bg-color-hover: #303236; --video-footer-bg-color: #1d1e20; --layout-bg-color: #292d32; --disabled-bg-color: #1d1e20; --disabled-text-color: #787e87; --disabled-border-color: #787e87; --ad-bg-color: #18191b; --ad-border-color: #000; --game-header-bg-color: #2c2f35; --bg-light: #2c2f35; --game-tab-hover-bg-color: #17191c; --price-color: #9fafc6; --blue-light: #414a58; --live-color: #ff4d4d; --live-hover-color: #ff1a1a; --gauge-bg-color: #616161; --blue-gray-color: #9fafc6; --message-delete: #104e60; --message-delete-border: #092a34; --message-delete-gta: #46435b; --message-delete-gta-border: #191820; --input-bg-color: #303236; --input-border-color: #636569; --input-text-color: #f2f2f2; --input-placeholder-color: #616161; --form-select-indicator: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27%3e%3cpath stroke=%27%23e0e0e0%27 stroke-width=%272px%27 d=%27M2 5l6 6 6-6%27 fill=%27none%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3e%3c/svg%3e"); --form-switch-bg-image: url("data:image/svg+xml,"); --admin-color: #f24444; --modo-color: #42b228; --ad-placeholder-opacity: 0.4; --alert-brightness: 0.85; --filters-bg-color: #16191d; --gray-100: #f8f9fa; --gray-200: #e9ecef; --gray-300: #dee2e6; --gray-400: #ced4da; --gray-500: #adb5bd; --gray-600: #6c757d; --gray-700: #495057; --gray-800: #343a40; --gray-900: #212529; --white-rgb: #fff; --black-rgb: #000; --body-color-rgb: var(--text-color); --body-bg-rgb: var(--body-bg); --font-sans-serif: "Roboto", Arial, Helvetica, sans-serif; --font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); --root-font-size: 1rem; --body-font-family: "Roboto", Arial, Helvetica, sans-serif; --body-font-size: 0.9375rem; --body-font-weight: 400; --body-line-height: 1.5; --body-color: var(--text-color); --border-width: 0.0625rem; --border-style: solid; --border-color-translucent: rgba(0, 0, 0, 0.175); --border-radius: 0.75rem; --border-radius-sm: 0.5rem; --border-radius-lg: 0.75rem; --border-radius-xl: 1rem; --border-radius-2xl: 2rem; --border-radius-pill: 50rem; --link-hover-color: var(--text-hover-secondary); --code-color: #d63384; --highlight-bg: #fff3cd; --topic-font-size: 0.8125rem; --topic-font-weight: 700; --topic-line-height: 1.25; --topic-gap: 0.625rem; --topic-title-font-size: 0.9375rem; --topic-title-font-weight: 500; } body { margin: 0; font-family: var(--body-font-family), sans-serif; font-size: var(--body-font-size); font-weight: var(--body-font-weight); line-height: var(--body-line-height); color: var(--body-color); text-align: var(--body-text-align); background-color: var(--body-bg); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } hr { height: 1px; width: 100%; background-color: var(--border-color); display: block; margin: 1.5rem 0; } h2 { font-size: 1.59375rem; line-height: 1.25; font-weight: 500; color: var(--text-color); padding-bottom: 1.5rem; }._header_1hnaa_1 { background-color: var(--header-bg-color); color: var(--text-color); } ._logo_1hnaa_6 { font-size: 2rem; font-weight: 700; }._container_1putz_1 { margin: 0 auto; min-width: 20rem; max-width: 73.5rem; padding: 0 0.5rem; }._spinnerSquare_4vgl0_1 { display: flex; flex-direction: row; width: 90px; height: 120px; } ._spinnerSquare_4vgl0_1 > div { width: 17px; height: 80px; margin: auto auto; border-radius: 4px; } ._square1_4vgl0_14 { animation: _square-anim_4vgl0_1 1200ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 0s infinite; } ._square2_4vgl0_18 { animation: _square-anim_4vgl0_1 1200ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 200ms infinite; } ._square3_4vgl0_22 { animation: _square-anim_4vgl0_1 1200ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 400ms infinite; } @keyframes _square-anim_4vgl0_1 { 0% { height: 80px; background-color: var(--text-secondary); } 20% { height: 80px; } 40% { height: 120px; background-color: var(--text-hover-secondary); } 80% { height: 80px; } 100% { height: 80px; background-color: var(--text-secondary); } }._spinner_1pqws_1 { margin: 5rem auto; } ._list_1pqws_5 { display: grid; grid-template-columns: 10fr 3fr 1fr 3fr; list-style-type: none; background: var(--block-bg-color); border: 0.0625rem solid var(--border-color); border-radius: 0.75rem; width: 100%; padding: 0; overflow: hidden; margin-bottom: 1.5rem; } ._list_1pqws_5 > li { display: contents; list-style: none; padding: 0; margin: 0; } ._list_1pqws_5 > li > span { font-weight: var(--topic-font-weight); font-size: var(--topic-font-size); padding: var(--topic-gap); } ._list_1pqws_5 > li > span a { overflow: hidden; display: -webkit-box; -webkit-line-clamp: var(--topic-title-lines); -webkit-box-orient: vertical; color: var(--link-color); text-decoration: none; font-size: var(--topic-title-font-size); font-weight: var(--topic-title-font-weight); } ._list_1pqws_5 > li > span a:hover { color: var(--text-hover-secondary); } ._list_1pqws_5 > li:nth-child(even) > span { background: var(--block-even-bg-color); } ._list_1pqws_5 > li._highlight_1pqws_44 > span { background: var(--block-highlighted-bg-color); } ._head_1pqws_48 > span { text-transform: uppercase; } ._generationSettings_1pqws_52 { display: grid; grid-template-columns: 1fr 1fr; }._btn_1ts7o_1 { position: relative; display: inline-flex; justify-content: center; align-items: center; padding: 0 1.25rem; margin: 0; border: 0.0625rem solid var(--text-secondary); height: 2.25rem; line-height: 2.25rem; font-size: 0.9375rem; text-decoration: none; color: var(--text-secondary); border-radius: 1.125rem; white-space: nowrap; cursor: pointer; } ._btn_1ts7o_1:not(._disabled_1ts7o_18):hover { border-color: var(--text-hover-secondary); color: var(--text-hover-secondary); } ._btn_1ts7o_1._secondary_1ts7o_22 { color: #fff; background-color: var(--text-secondary); } ._btn_1ts7o_1._secondary_1ts7o_22:not(._disabled_1ts7o_18):hover { border-color: var(--text-hover-secondary); background: var(--text-hover-secondary); color: #fff; } ._spinner_1ts7o_32 { font-size: 10px; margin-right: 1em; width: 1.5em; height: 1.5em; border-radius: 50%; background: #ffffff; background: linear-gradient(to right, #ffffff 10%, rgba(255, 255, 255, 0) 42%); position: relative; animation: _load3_1ts7o_1 1.4s infinite linear; transform: translateZ(0); } ._spinner_1ts7o_32:before { width: 50%; height: 50%; background: #ffffff; border-radius: 100% 0 0 0; position: absolute; top: 0; left: 0; content: ""; } ._spinner_1ts7o_32:after { background: var(--text-secondary); width: 75%; height: 75%; border-radius: 50%; content: ""; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; } @keyframes _load3_1ts7o_1 { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } ._disabled_1ts7o_18 { cursor: not-allowed; } ._disabled_1ts7o_18:after { content: ""; position: absolute; width: 100%; height: 100%; background: #4f4f4f; border: 0.0625rem solid #4f4f4f; border-radius: 1.125rem; opacity: 0.5; box-sizing: content-box; }._formGroup_b3g81_1 { display: flex; flex-direction: column; margin-bottom: 1rem; justify-content: space-between; } ._formGroup_b3g81_1 > * { flex-grow: 0; } ._formGroup_b3g81_1 label { font-size: 1rem; margin-bottom: 1rem; }._slider_1hlzr_1 { --ticks-count: calc(var(--max) - var(--min)) / var(--step); --too-many-ticks: min(1, Max(var(--ticks-count) - 30, 0)); --x-step: max(var(--step), var(--too-many-ticks) * (var(--max) - var(--min))); position: relative; background: linear-gradient(to right, var(--text-muted-color) 1px, transparent 1px) repeat-x; background-size: calc((100% - 20px) / ((var(--max) - var(--min)) / var(--x-step))) 5px; background-position-x: calc(10px - 0.5px); background-position-y: bottom; font-weight: 700; color: var(--text-muted-color); font-size: 0.8125rem; height: 22px; margin-top: 2.5ch; margin-bottom: 2.5ch; } ._slider_1hlzr_1::before, ._slider_1hlzr_1::after { content: counter(x); position: absolute; bottom: calc(-2.5ch - 2px); top: calc(2.5ch + 2px); opacity: 0.5; transform: translateX(calc(50% * var(--before, -1) * -1)); pointer-events: none; } ._slider_1hlzr_1::before { --before: 1; counter-reset: x var(--min); left: 10px; } ._slider_1hlzr_1::after { counter-reset: x var(--max); right: 10px; } ._outputContainer_1hlzr_36 { position: absolute; top: 0; left: 10px; right: 10px; height: 10px; pointer-events: none; } ._output_1hlzr_36 { pointer-events: none; position: absolute; z-index: 5; width: 20px; height: 20px; left: calc((var(--value) - var(--min)) / (var(--max) - var(--min)) * 100% - 10px); bottom: 16px; text-align: center; } ._progress_1hlzr_56 { --completed-a: calc((clamp(var(--min), var(--value, 0), var(--max)) - var(--min)) / (var(--max) - var(--min)) * 100); --completed-b: calc((var(--value) - var(--min)) / (var(--max) - var(--min)) * 100); --cb: max(var(--completed-a), var(--completed-b)); --start-end: 10px; --clip-end: calc(100% - (var(--cb)) * 1%); --clip: inset(-20px var(--clip-end) -20px 0); position: absolute; width: 100%; height: 10px; background: var(--text-color); border-radius: 10px; z-index: -1; } ._progress_1hlzr_56::before { content: ""; position: absolute; left: 0; right: 0; clip-path: var(--clip); top: 0; bottom: 0; background: var(--text-secondary); z-index: 1; border-radius: inherit; } ._input_1hlzr_83 { --thumb-shadow: 0 0 3px rgba(0, 0, 0, 0.4), 0 0 1px rgba(0, 0, 0, 0.5) inset, 0 0 0 99px var(--text-color) inset; -webkit-appearance: none; width: 100%; height: 20px; margin: 0; position: absolute; left: 0; cursor: grab; outline: none; background: none; } ._input_1hlzr_83::-webkit-slider-thumb { appearance: none; height: 20px; width: 20px; transform: translateY(-5px); border-radius: 50%; background: var(--text-color); box-shadow: var(--thumb-shadow); border: none; pointer-events: auto; } ._input_1hlzr_83::-moz-range-thumb { appearance: none; height: 20px; width: 20px; transform: translateY(-5px); border-radius: 50%; background: var(--text-color); box-shadow: var(--thumb-shadow); border: none; pointer-events: auto; } ._input_1hlzr_83::-ms-thumb { appearance: none; height: 20px; width: 20px; transform: translateY(-5px); border-radius: 50%; background: var(--text-color); box-shadow: var(--thumb-shadow); border: none; pointer-events: auto; } ._input_1hlzr_83:active { --thumb-shadow: 0 0 0 5px inset var(--text-color), 0 0 0 99px var(--text-secondary) inset, 0 0 3px rgba(0, 0, 0, 0.4); cursor: grabbing; }._post_uuidr_1 { margin-bottom: 0.9375rem; font-size: 0.9375rem; line-height: 1.5; background: var(--block-bg-color); border: 0.0625rem solid var(--border-color); border-radius: 0.5rem; overflow: hidden; padding: 0.75rem; } ._postHeader_uuidr_12 { border-bottom: 0.0625rem dotted var(--border-color); height: 3.625rem; margin-bottom: 0.75rem; display: grid; grid-template-areas: "avatar user" "avatar date"; grid-template-rows: 1.5rem 1.5rem; grid-template-columns: auto 1fr; column-gap: 0.625rem; } ._avatar_uuidr_23 { grid-area: avatar; height: 3rem; width: 3rem; object-fit: cover; border-radius: 50%; } ._user_uuidr_31 { grid-area: user; font-size: 1.0625rem; font-weight: 500; font-family: "Roboto", Arial, Helvetica, sans-serif; line-height: 1.25; } ._date_uuidr_39 { grid-area: date; color: var(--link-color); text-decoration: none; font-size: 0.8125rem; } ._generationSettings_uuidr_46 { display: grid; grid-template-columns: 1fr 1fr; }._wrapper_cfqzy_1 .bloc-spoil-jv { margin-bottom: 0; display: inline; } ._wrapper_cfqzy_1 .bloc-spoil-jv .open-spoil { position: absolute; left: -999rem; } ._wrapper_cfqzy_1 .bloc-spoil-jv .barre-head { height: auto; line-height: inherit; text-align: center; cursor: pointer; position: relative; display: inline; } ._wrapper_cfqzy_1 .bloc-spoil-jv .barre-head .txt-spoil { position: static; display: inline; padding: 0.125rem 1.25rem; line-height: inherit; top: 0; left: 0; width: 4.6875rem; font-size: 0.9285em; text-align: center; color: #fff; text-transform: uppercase; background: #fd374e; font-weight: 700; border-radius: 0.25rem; } ._wrapper_cfqzy_1 .bloc-spoil-jv .contenu-spoil { background: #f4d6da; color: #212121; padding: 0.625rem; display: none; text-align: left; overflow: hidden; } ._wrapper_cfqzy_1 .bloc-spoil-jv .open-spoil:checked ~ .contenu-spoil { display: inline; } ._wrapper_cfqzy_1 blockquote { text-align: left; border-left: 0.3125rem solid rgba(0, 0, 0, 0.2); color: var(--text-blockquote-color); padding: 0.625rem; background: none; font-style: normal; font-size: inherit; margin: 0 0 0.9375rem 1rem; } ._wrapper_cfqzy_1 a { color: var(--link-color); text-decoration: none; } ._wrapper_cfqzy_1 a:hover { color: var(--text-hover-secondary); text-decoration: none; }._wrapper_1dmrl_1 { position: relative; margin-bottom: 0.9375rem; } ._icon_1dmrl_6 { position: absolute; top: 0.625rem; left: 0.625rem; font-size: 1.125rem; line-height: 1em; } ._input_1dmrl_14 { display: block; width: 100%; font-weight: 400; line-height: 1.5; color: var(--input-text-color); background-color: var(--input-bg-color); background-clip: padding-box; border: 0.0625rem solid var(--input-border-color); -webkit-appearance: none; appearance: none; border-radius: 0.75rem; box-shadow: inset 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.075); transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; padding-top: 0; padding-right: 0.3125rem; padding-left: 2.5rem; padding-bottom: 0; font-weight: 700; height: 2.5rem; font-size: 1rem; } ._input_1dmrl_14::placeholder { color: var(--input-placeholder-color); font-weight: 400; }._breadcrumbs_145yl_1 { font-weight: 700; color: var(--text-muted-color); font-size: 0.8125rem; margin-top: 1.25rem; margin-bottom: 0.9375rem; display: flex; } ._actions_145yl_10 { margin-left: auto; } ._actions_145yl_10 a:hover { color: var(--text-muted-hover-color); }