diff --git a/index.html b/index.html new file mode 100644 index 00000000..e75b33d0 --- /dev/null +++ b/index.html @@ -0,0 +1,4071 @@ + + + + + + + + Theme Preview + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+ +
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Upload to #current-channel
+
+ 
You can add comments before uploading.
+Hold shift to upload directly.
+
+
+
+
+
+
+
+
+
Text Channel +
+

DiscordTest: current-channel

+
+
+
+
Channel description. https://google.com/ +
+
+
+ + + +
+
+
+
+
+
+
Search
+
+
+ +
+
+ +
+
+
+
+ +
+
+ +
+
+
+
+
+
+

current-channel chat

+ +
+
+
+
+
    +
    +
    + +
    This is the start of the #current-channel + private channel. Channel description. + https://google.com/ +
    +
    +
    +
    +
    + +
    +
    +
    +
    + +
  1. +
    +
    +

    + +

    +
    +
    +
    +
    +
    +
    2. +
  2. +
    +
    +
    + + ⁠locked-text +
    +
    +
    +
    +
    +
    3. +
  3. +
    +
    +
    Edited message + +
    +
    +
    +
    +
    +
    4. +
  4. +
    +
    +
    inline + codeblock
    +
    +
    +
    +
    +
    5. +
  5. +
    +
    +
    + 
    multiline codeblock
    +
    +
    +
    +
    +
    +
    6. +
  6. +
    +
    +
    + 
    export const isTrue = (val) => {
+if (val === true) return true;
+else return false;
+}
    +
    +
    +
    +
    +
    +
    7. +
  7. +
    +
    +
    Embed + message: https://www.youtube.com/watch?v=oYmqJl4MoNI +
    +
    +
    + +
    +
    +
    +
    + +
    +
    +
    +
    + +
    +
    +
    +
    + +
    +
    +
    + +
    +
    +
    +
    +
    8. +
  8. +
    +
    +
    +
    +
    +
    started a thread: + Example thread. See all threads. +
    +
    +
    +
    +
    +
    +
    +
    ThreadExample thread1 Message ›
    +
    +
    +
    +
    9. +
  9. +
    +
    +

    + +

    +
    Italics https://google.com/ + Bold https://google.com/ + Italics and bold https://google.com/ + Underline text + Strikethrough text
    +
    +
    +
    +
    +
    10. +
  10. +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    DaniLeigh_-_No_Limits_Skeler_Remix.mp3 +
    3.26 MB
    +
    +
    +
    +
    +
    0:00/2:22
    +
    +
    +
    +
    +
    +
    +
    0:00
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    + +
    + +
    +
    + +
    +
    +
    +
    +
    11. +
  11. +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    + 
    /**
+* @name Fluent
+* @author Gibbu#1211
+* @version 1.0.5
+* @description Brings the look of Windows 11 to Discord.
+* @source https://github.com/DiscordStyles/Fluent... (374 KB left)
    +
    +
    +
    Expand
    +
    +
    Fluent.theme.css424 + KB +
    +
    +
    +
    +
    +
    +
    +
    +
    + +
    + +
    +
    + +
    +
    +
    +
    +
    12. +
  12. +
    +
    +

    + +

    +
    + discord.gg/minecraft +
    +
    +
    +
    +
    +
    +

    You've been invited to + join a server

    +
    +
    +
    +
    +
    +

    +
    MINECRAFT
    +
    +
    +
    +
    + +
    +
    +
    +
    +     +

    +
    +
    225,290 Online
    +
    1,398,741 Members
    +
    +     +
    +
    +
    +
    +
    +
    +
    ThreadAnother tread1 Message ›
    +
    +
    +
    +
    +
    + +
    + +
    +
    + +
    +
    +
    +
    +
    13. + +
  13. +
    +
    +

    + +

    +
    New Message
    +
    +
    +
    +
    +
    14. +
    +
+
+
+
+
+
+
+
+
+ +
+
+
+
+ +
+

+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + + + + + +
+
+ +
+ +
View Profile
+ + +
+
+
+
+
+
+

Gibbu

+
gibbu
+
+
+
+
+
+
+
+
+
+

About Me

+
+
Need some + motivation? Watch this: https://www.youtube.com/watch?v=oYmqJl4MoNI
+
+
+
+

Mutuals

+
+
+
+
+
+
+
+
D
+
+
+
+
+
1 Server +
+
+
+
+
+
+
+

Member Since

+
+
+ + +
27 Apr 2016
+
+
+
+
+
D
+
+
5 Aug 2018
+
+
+
+
+
+
+

Role

+
+
+
+ +
+
+
+
+

Note

+
+
+
+
+
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+ + +
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/main.js b/main.js new file mode 100644 index 00000000..31cc26ce --- /dev/null +++ b/main.js @@ -0,0 +1,111 @@ +const el = { + create(tag, attrs) { + const el = Object.assign(document.createElement(tag), attrs); + document.querySelector('head').appendChild(el); + }, + remove(selector) { + document.querySelectorAll(selector)?.forEach(el => el.remove()); + } +} + +let {href} = window.location; +let url = new URL(href); +let file = url.searchParams.get('file'); + +const checkFile = async(file) => { + try { + const req = await fetch(file); + console.log(req); + } catch (error) { + console.error(error); + } +} + +if (file) { + const files = file.split('|'); + + checkFile(file); + + files.forEach(file => { + const link = document.createElement('link'); + link.setAttribute('rel', 'stylesheet'); + link.setAttribute('href', file); + document.querySelector('head').appendChild(link); + }); +} + +if (url.searchParams.get('lightTheme') === "true") { + document.querySelector('html').classList.remove('theme-dark'); + document.querySelector('html').classList.add('theme-light'); +} + +window.addEventListener('message', event => { + const data = JSON.parse(event.data); + + const actions = { + setPreview() { + document.querySelector('#preview').textContent = data.text; + }, + reset() { + const props = document.documentElement.getAttribute('style').split(';').slice(0, 2).map(e => e += ';').join(' '); + document.documentElement.setAttribute('style', props); + }, + setProp() { + document.documentElement.style.setProperty(`--${data.variable}`, data.value); + }, + removeProp() { + document.documentElement.style.removeProperty(`--${data.variable}`); + }, + addFont() { + const tag = document.querySelector(`#font-${data.index}`) + if (!tag) { + el.create('style', { + id: `font-${data.index}`, + className: 'customfont', + innerText: data.text + }) + } else { + tag.innerHTML = data.text; + } + }, + removeFont() { + el.remove(`#font-${data.index}`) + }, + addAddon() { + if (!document.querySelector(`.${data.class}`)) { + el.create('style', { + className: data.class, + textContent: `@import url('${data.text}')` + }); + } + }, + removeAddon() { + el.remove(`.${data.class}`); + }, + toggleModal() { + if (data.visible) { + document.querySelector('#modal').classList.remove('HIDDEN'); + document.querySelector('#popout').classList.add('HIDDEN'); + } else { + document.querySelector('#modal').classList.add('HIDDEN'); + document.querySelector('#popout').classList.remove('HIDDEN'); + } + }, + toggleTheme() { + if (document.documentElement.classList.contains('theme-dark')) { + document.querySelectorAll('.theme-dark')?.forEach(el => { + el.classList.add('theme-light'); + el.classList.remove('theme-dark'); + }); + } else { + document.querySelectorAll('.theme-light')?.forEach(el => { + el.classList.add('theme-dark'); + el.classList.remove('theme-light'); + }); + } + + } + } + + actions[data.action]?.(); +}) \ No newline at end of file diff --git a/minify.js b/minify.js new file mode 100644 index 00000000..882d807b --- /dev/null +++ b/minify.js @@ -0,0 +1,13 @@ +import { transform } from 'lightningcss'; +import {readFileSync, writeFileSync} from 'fs' + +const css = readFileSync('./styles.css'); + +let { code } = transform({ + filename: 'styles.css', + code: Buffer.from(css), + minify: true, + sourceMap: false +}); + +writeFileSync('./styles.css', code) \ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 00000000..2900d539 --- /dev/null +++ b/package.json @@ -0,0 +1,11 @@ +{ + "type": "module", + "scripts": { + "purge": "node purge.js", + "mini": "node minify.js" + }, + "devDependencies": { + "lightningcss": "^1.24.1", + "purgecss": "^5.0.0" + } +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml new file mode 100644 index 00000000..740b70ef --- /dev/null +++ b/pnpm-lock.yaml @@ -0,0 +1,229 @@ +lockfileVersion: '6.0' + +settings: + autoInstallPeers: true + excludeLinksFromLockfile: false + +devDependencies: + lightningcss: + specifier: ^1.24.1 + version: 1.24.1 + purgecss: + specifier: ^5.0.0 + version: 5.0.0 + +packages: + + /balanced-match@1.0.2: + resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==} + dev: true + + /brace-expansion@2.0.1: + resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==} + dependencies: + balanced-match: 1.0.2 + dev: true + + /commander@9.5.0: + resolution: {integrity: sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==} + engines: {node: ^12.20.0 || >=14} + dev: true + + /cssesc@3.0.0: + resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==} + engines: {node: '>=4'} + hasBin: true + dev: true + + /detect-libc@1.0.3: + resolution: {integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==} + engines: {node: '>=0.10'} + hasBin: true + dev: true + + /fs.realpath@1.0.0: + resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==} + dev: true + + /glob@8.1.0: + resolution: {integrity: sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==} + engines: {node: '>=12'} + dependencies: + fs.realpath: 1.0.0 + inflight: 1.0.6 + inherits: 2.0.4 + minimatch: 5.1.6 + once: 1.4.0 + dev: true + + /inflight@1.0.6: + resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==} + dependencies: + once: 1.4.0 + wrappy: 1.0.2 + dev: true + + /inherits@2.0.4: + resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==} + dev: true + + /lightningcss-darwin-arm64@1.24.1: + resolution: {integrity: sha512-1jQ12jBy+AE/73uGQWGSafK5GoWgmSiIQOGhSEXiFJSZxzV+OXIx+a9h2EYHxdJfX864M+2TAxWPWb0Vv+8y4w==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [darwin] + requiresBuild: true + dev: true + optional: true + + /lightningcss-darwin-x64@1.24.1: + resolution: {integrity: sha512-R4R1d7VVdq2mG4igMU+Di8GPf0b64ZLnYVkubYnGG0Qxq1KaXQtAzcLI43EkpnoWvB/kUg8JKCWH4S13NfiLcQ==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [darwin] + requiresBuild: true + dev: true + optional: true + + /lightningcss-freebsd-x64@1.24.1: + resolution: {integrity: sha512-z6NberUUw5ALES6Ixn2shmjRRrM1cmEn1ZQPiM5IrZ6xHHL5a1lPin9pRv+w6eWfcrEo+qGG6R9XfJrpuY3e4g==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [freebsd] + requiresBuild: true + dev: true + optional: true + + /lightningcss-linux-arm-gnueabihf@1.24.1: + resolution: {integrity: sha512-NLQLnBQW/0sSg74qLNI8F8QKQXkNg4/ukSTa+XhtkO7v3BnK19TS1MfCbDHt+TTdSgNEBv0tubRuapcKho2EWw==} + engines: {node: '>= 12.0.0'} + cpu: [arm] + os: [linux] + requiresBuild: true + dev: true + optional: true + + /lightningcss-linux-arm64-gnu@1.24.1: + resolution: {integrity: sha512-AQxWU8c9E9JAjAi4Qw9CvX2tDIPjgzCTrZCSXKELfs4mCwzxRkHh2RCxX8sFK19RyJoJAjA/Kw8+LMNRHS5qEg==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + requiresBuild: true + dev: true + optional: true + + /lightningcss-linux-arm64-musl@1.24.1: + resolution: {integrity: sha512-JCgH/SrNrhqsguUA0uJUM1PvN5+dVuzPIlXcoWDHSv2OU/BWlj2dUYr3XNzEw748SmNZPfl2NjQrAdzaPOn1lA==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + requiresBuild: true + dev: true + optional: true + + /lightningcss-linux-x64-gnu@1.24.1: + resolution: {integrity: sha512-TYdEsC63bHV0h47aNRGN3RiK7aIeco3/keN4NkoSQ5T8xk09KHuBdySltWAvKLgT8JvR+ayzq8ZHnL1wKWY0rw==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + requiresBuild: true + dev: true + optional: true + + /lightningcss-linux-x64-musl@1.24.1: + resolution: {integrity: sha512-HLfzVik3RToot6pQ2Rgc3JhfZkGi01hFetHt40HrUMoeKitLoqUUT5owM6yTZPTytTUW9ukLBJ1pc3XNMSvlLw==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + requiresBuild: true + dev: true + optional: true + + /lightningcss-win32-x64-msvc@1.24.1: + resolution: {integrity: sha512-joEupPjYJ7PjZtDsS5lzALtlAudAbgIBMGJPNeFe5HfdmJXFd13ECmEM+5rXNxYVMRHua2w8132R6ab5Z6K9Ow==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [win32] + requiresBuild: true + dev: true + optional: true + + /lightningcss@1.24.1: + resolution: {integrity: sha512-kUpHOLiH5GB0ERSv4pxqlL0RYKnOXtgGtVe7shDGfhS0AZ4D1ouKFYAcLcZhql8aMspDNzaUCumGHZ78tb2fTg==} + engines: {node: '>= 12.0.0'} + dependencies: + detect-libc: 1.0.3 + optionalDependencies: + lightningcss-darwin-arm64: 1.24.1 + lightningcss-darwin-x64: 1.24.1 + lightningcss-freebsd-x64: 1.24.1 + lightningcss-linux-arm-gnueabihf: 1.24.1 + lightningcss-linux-arm64-gnu: 1.24.1 + lightningcss-linux-arm64-musl: 1.24.1 + lightningcss-linux-x64-gnu: 1.24.1 + lightningcss-linux-x64-musl: 1.24.1 + lightningcss-win32-x64-msvc: 1.24.1 + dev: true + + /minimatch@5.1.6: + resolution: {integrity: sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==} + engines: {node: '>=10'} + dependencies: + brace-expansion: 2.0.1 + dev: true + + /nanoid@3.3.6: + resolution: {integrity: sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==} + engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} + hasBin: true + dev: true + + /once@1.4.0: + resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==} + dependencies: + wrappy: 1.0.2 + dev: true + + /picocolors@1.0.0: + resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} + dev: true + + /postcss-selector-parser@6.0.13: + resolution: {integrity: sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==} + engines: {node: '>=4'} + dependencies: + cssesc: 3.0.0 + util-deprecate: 1.0.2 + dev: true + + /postcss@8.4.27: + resolution: {integrity: sha512-gY/ACJtJPSmUFPDCHtX78+01fHa64FaU4zaaWfuh1MhGJISufJAH4cun6k/8fwsHYeK4UQmENQK+tRLCFJE8JQ==} + engines: {node: ^10 || ^12 || >=14} + dependencies: + nanoid: 3.3.6 + picocolors: 1.0.0 + source-map-js: 1.0.2 + dev: true + + /purgecss@5.0.0: + resolution: {integrity: sha512-RAnuxrGuVyLLTr8uMbKaxDRGWMgK5CCYDfRyUNNcaz5P3kGgD2b7ymQGYEyo2ST7Tl/ScwFgf5l3slKMxHSbrw==} + hasBin: true + dependencies: + commander: 9.5.0 + glob: 8.1.0 + postcss: 8.4.27 + postcss-selector-parser: 6.0.13 + dev: true + + /source-map-js@1.0.2: + resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==} + engines: {node: '>=0.10.0'} + dev: true + + /util-deprecate@1.0.2: + resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==} + dev: true + + /wrappy@1.0.2: + resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==} + dev: true diff --git a/purge.js b/purge.js new file mode 100644 index 00000000..93f84f32 --- /dev/null +++ b/purge.js @@ -0,0 +1,10 @@ +import { PurgeCSS } from 'purgecss'; +import { unlinkSync, writeFileSync } from 'fs'; + +const purgeResult = await new PurgeCSS().purge({ + content: ['./index.html'], + css: ['./discord.css'] +}); + +writeFileSync('./styles.css', purgeResult[0].css); +unlinkSync('./discord.css'); diff --git a/styles.css b/styles.css new file mode 100644 index 00000000..af9f0650 --- /dev/null +++ b/styles.css @@ -0,0 +1,10474 @@ +.anchor_af404b { + color: var(--text-link); + -webkit-text-decoration: var(--link-decoration); + text-decoration: var(--link-decoration) +} + +.anchorUnderlineOnHover_af404b:hover { + -webkit-text-decoration: underline; + text-decoration: underline +} + +@keyframes spinner-wandering-cubes_b6db20 { + 25% { + transform: translatex(22px)rotate(-90deg)scale(.5) + } + + 50% { + transform: translatex(22px)translatey(22px)rotate(-180deg) + } + + 75% { + transform: translatex(0)translatey(22px)rotate(-270deg)scale(.5) + } + + to { + transform: rotate(-360deg) + } +} + +@keyframes spinner-chasing-dots-rotate_b6db20 { + to { + transform: rotate(360deg) + } +} + +@keyframes spinner-chasing-dots-bounce_b6db20 { + 0%,to { + transform: scale(0) + } + + 50% { + transform: scale(1) + } +} + +@keyframes spinner-pulsing-ellipsis_b6db20 { + 0% { + transform: scale(1); + opacity: 1 + } + + 50% { + transform: scale(.8); + opacity: .3 + } + + to { + transform: scale(1); + opacity: 1 + } +} + +@keyframes spinner-low-motion_b6db20 { + 0% { + opacity: 1 + } + + 50% { + opacity: .6 + } + + to { + opacity: 1 + } +} + +@keyframes spinner-spinning-circle-rotate_b6db20 { + to { + transform: rotate(360deg) + } +} + +@keyframes spinner-spinning-circle-dash_b6db20 { + 0% { + stroke-dasharray: 1,200; + stroke-dashoffset: 0 + } + + 50% { + stroke-dasharray: 130,200 + } + + to { + stroke-dasharray: 130,200; + stroke-dashoffset: -124 + } +} + +.svg_d48241 { + contain: paint +} + +.layerContainer_cd0de5 { + background: none!important; + position: absolute; + top: 0; + left: 0; + right: 0; + right: var(--devtools-sidebar-width,0); + bottom: 0; + pointer-events: none; + z-index: 1002 +} + +.layer_cd0de5 { + position: absolute; + pointer-events: auto +} + +.theme-dark { + --brightness: calc(1.5 - var(--saturation-factor, 1) * 0.5); + --contrast: var(--saturation-factor, 1) +} + +.button_dd4f85 { + position: relative; + display: flex; + justify-content: center; + align-items: center; + box-sizing: border-box; + background: none; + border: none; + border-radius: 3px; + font-size: 14px; + font-weight: 500; + line-height: 16px; + padding: 2px 16px; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none +} + +.button_dd4f85:disabled,.button_dd4f85[aria-disabled=true] { + cursor: not-allowed; + opacity: .5 +} + +.button_dd4f85 .contents_dd4f85 { + --button--underline-color: transparent; + background-image: linear-gradient(to top,transparent,transparent var(--custom-button-link-underline-offset),transparent var(--custom-button-link-underline-offset),transparent var(--custom-button-link-underline-stop),transparent var(--custom-button-link-underline-stop)); + background-image: linear-gradient(to top,transparent,transparent var(--custom-button-link-underline-offset),var(--button--underline-color)var(--custom-button-link-underline-offset),var(--button--underline-color)var(--custom-button-link-underline-stop),transparent var(--custom-button-link-underline-stop)) +} + +.lookFilled_dd4f85.colorBrand_dd4f85 { + color: var(--white-500); + background-color: var(--brand-experiment) +} + +.lookFilled_dd4f85.colorBrand_dd4f85:hover { + background-color: var(--brand-experiment-560) +} + +.lookFilled_dd4f85.colorBrand_dd4f85:active { + background-color: var(--brand-experiment-600) +} + +.lookFilled_dd4f85.colorBrand_dd4f85:disabled,.lookFilled_dd4f85.colorBrand_dd4f85[aria-disabled=true] { + background-color: var(--brand-experiment) +} + +.lookFilled_dd4f85.colorGreen_dd4f85 { + color: var(--white-500); + background-color: var(--button-positive-background) +} + +.lookFilled_dd4f85.colorGreen_dd4f85:hover { + background-color: var(--button-positive-background-hover) +} + +.lookFilled_dd4f85.colorGreen_dd4f85:active { + background-color: var(--button-positive-background-active) +} + +.lookFilled_dd4f85.colorGreen_dd4f85:disabled,.lookFilled_dd4f85.colorGreen_dd4f85[aria-disabled=true] { + background-color: var(--button-positive-background-disabled) +} + +.lookFilled_dd4f85 { + transition: background-color var(--custom-button-transition-duration)ease,color var(--custom-button-transition-duration)ease +} + +.lookBlank_dd4f85 { + background: transparent; + color: currentColor; + border: 0; + padding: 0; + margin: 0 +} + +.sizeMin_dd4f85 { + display: inline; + width: auto; + height: auto; + padding: 2px 4px +} + +.grow_dd4f85 { + width: auto +} + +.lookFilled_dd4f85 .contents_dd4f85 { + margin: 0 auto; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +@media all and (-ms-high-contrast:none),(-ms-high-contrast:active) { + .lookFilled_dd4f85 .contents_dd4f85 { + margin: 0 + } +} + +.scrollerBase_eed6a8 { + position: relative; + box-sizing: border-box; + min-height: 0; + flex: 1 1 auto +} + +.thin_eed6a8::-webkit-scrollbar { + width: 8px; + height: 8px +} + +.thin_eed6a8::-webkit-scrollbar-track { + border: 2px solid var(--scrollbar-thin-track); + background-color: var(--scrollbar-thin-track); + border-color: var(--scrollbar-thin-track) +} + +.thin_eed6a8::-webkit-scrollbar-thumb { + background-clip: padding-box; + border: 2px solid transparent; + border-radius: 4px; + background-color: var(--scrollbar-thin-thumb); + min-height: 40px +} + +.thin_eed6a8::-webkit-scrollbar-corner { + background-color: transparent +} + +.fade_eed6a8::-webkit-scrollbar-thumb,.fade_eed6a8::-webkit-scrollbar-track { + visibility: hidden +} + +.fade_eed6a8:hover::-webkit-scrollbar-thumb,.fade_eed6a8:hover::-webkit-scrollbar-track { + visibility: visible +} + +.content_eed6a8 { + position: relative +} + +.scrollerBase_c49869 { + position: relative; + box-sizing: border-box; + min-height: 0; + flex: 1 1 auto +} + +.thin_c49869::-webkit-scrollbar { + width: 8px; + height: 8px +} + +.thin_c49869::-webkit-scrollbar-track { + border: 2px solid var(--scrollbar-thin-track); + background-color: var(--scrollbar-thin-track); + border-color: var(--scrollbar-thin-track) +} + +.thin_c49869::-webkit-scrollbar-thumb { + background-clip: padding-box; + border: 2px solid transparent; + border-radius: 4px; + background-color: var(--scrollbar-thin-thumb); + min-height: 40px +} + +.thin_c49869::-webkit-scrollbar-corner { + background-color: transparent +} + +.auto_c49869::-webkit-scrollbar { + width: 16px; + height: 16px +} + +.auto_c49869::-webkit-scrollbar-track { + border: 4px solid transparent; + background-clip: padding-box; + border-radius: 8px; + background-color: var(--scrollbar-auto-track) +} + +.auto_c49869::-webkit-scrollbar-thumb { + background-clip: padding-box; + border: 4px solid transparent; + border-radius: 8px; + background-color: var(--scrollbar-auto-thumb); + min-height: 40px +} + +.auto_c49869::-webkit-scrollbar-corner { + background-color: transparent +} + +.none_c49869::-webkit-scrollbar { + width: 0; + height: 0 +} + +.content_c49869 { + position: relative +} + +.disableScrollAnchor_c49869 { + overflow-anchor: none +} + +.managedReactiveScroller_c49869 { + overflow-y: scroll; + overflow-x: hidden +} + +.flex_bba380 { + display: flex +} + +.horizontal_bba380 { + flex-direction: row; + display: flex +} + +.horizontal_bba380>.flex_bba380 { + margin-left: 10px; + margin-right: 10px +} + +.horizontal_bba380>.flex_bba380:first-child { + margin-left: 0 +} + +.horizontal_bba380>.flex_bba380:last-child { + margin-right: 0 +} + +.flex_ec1a20 { + display: flex +} + +.alignCenter_ec1a20 { + align-items: center +} + +.alignStretch_ec1a20 { + align-items: stretch +} + +.justifyStart_ec1a20 { + justify-content: flex-start +} + +.justifyCenter_ec1a20 { + justify-content: center +} + +.noWrap_ec1a20 { + flex-wrap: nowrap +} + +.vertical_ec1a20 { + flex-direction: column; + display: flex +} + + +.wrapper_c51b4e { + position: relative; + border-radius: 50% +} + +.mask_c51b4e { + pointer-events: none; + position: relative; + display: block; + width: auto +} + +.svg_c51b4e { + position: absolute; + contain: paint +} + +.cursorDefault_c51b4e { + cursor: default +} + +.avatarStack_c51b4e { + display: grid; + width: 100%; + height: 100% +} + +.avatar_c51b4e { + width: 100%; + height: 100%; + grid-area: 1/1 +} + +.avatar_c51b4e { + display: block; + -o-object-fit: cover; + object-fit: cover; + pointer-events: none +} + +.avatar_c51b4e:before { + content: ""; + display: block; + width: 100%; + height: 100%; + background-color: var(--background-modifier-accent) +} + +.pointerEvents_c51b4e { + pointer-events: auto +} + +.wrapper_c5f96a { + box-sizing: border-box; + position: relative; + width: 48px; + height: 48px; + cursor: pointer +} + +.wrapperSimple_c5f96a { + border-radius: 50%; + overflow: hidden +} + +.svg_c5f96a { + contain: paint; + box-sizing: border-box; + position: absolute; + top: 0; + left: 0; + width: 48px; + height: 48px +} + +.lowerBadge_c5f96a { + pointer-events: none; + position: absolute; + bottom: 0; + right: 0; + z-index: 2 +} + +.focusTarget_dc8280 { + width: 0; + height: 0; + pointer-events: none +} + +.defaultColor_a595eb { + color: var(--text-normal) +} + +.lineClamp1_a595eb { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + min-width: 0 +} + +.lineClamp2Plus_a595eb { + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden +} + +.defaultColor_e9e35f { + color: var(--header-primary) +} + +.full-motion .translate_f88ae3.animatorLeft_f88ae3 { + transform: translate3d(-10px,0,0) +} + +.full-motion .translate_f88ae3.didRender_f88ae3 { + transition: transform.2s ease-out; + transform: translatez(0) +} + +.inputWrapper_f8bc55 { + display: flex; + flex-direction: column +} + +.input_f8bc55 { + font-size: 16px; + box-sizing: border-box; + width: 100%; + border-radius: 3px; + color: var(--text-normal); + background-color: var(--input-background); + border: none; + transition: border-color.2s ease-in-out +} + +.input_f8bc55::-moz-placeholder { + -moz-user-select: none; + user-select: none; + color: var(--input-placeholder-text) +} + +.input_f8bc55::placeholder { + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + color: var(--input-placeholder-text) +} + +.input_f8bc55:hover { + border-color: var(--deprecated-text-input-border-hover) +} + +.input_f8bc55:focus { + border-color: var(--text-link) +} + +.inputDefault_f8bc55 { + padding: 10px; + height: 40px +} + +.eyebrow_c46f6a { + font-family: var(--font-display); + font-size: 12px; + line-height: 1.3333333333333333; + font-weight: 700; + text-transform: uppercase; + letter-spacing: .02em +} + +.h5_c46f6a { + color: var(--header-secondary) +} + +.eyebrow_c15ff6 { + font-family: var(--font-display); + font-size: 12px; + line-height: 1.3333333333333333; + font-weight: 700; + text-transform: uppercase; + letter-spacing: .02em +} + +.base__5ed84 { + box-sizing: border-box; + height: 16px; + min-width: 16px; + min-height: 16px; + color: var(--white-500); + text-align: center; + flex: 0 0 auto +} + +.baseShapeRound_df8943 { + border-radius: 8px +} + +.numberBadge__40d6f { + display: flex; + align-items: center; + justify-content: center +} + +.scrollbar_c858ce::-webkit-scrollbar-corner { + border: none; + background: none +} + +.scrollbarGhostHairline_c858ce::-webkit-scrollbar { + width: 4px; + height: 4px +} + +.scrollbarGhostHairline_c858ce::-webkit-scrollbar-thumb { + background-color: hsl(var(--primary-800-hsl)/.6); + border-radius: 2px; + cursor: move +} + +.scrollbarGhostHairline_c858ce::-webkit-scrollbar-track { + background-color: transparent; + border: none +} + + +.combo_c90023 { + box-sizing: border-box; + position: relative; + font-size: 12px; + line-height: 12px; + text-transform: uppercase; + font-weight: 600; + display: flex; + height: 23px +} + +.key_c90023 { + background-color: var(--background-accent); + box-sizing: border-box; + border: 1px solid var(--background-primary); + position: relative; + display: block; + height: 23px; + padding: 3px 6px 4px; + border-radius: 4px; + cursor: default; + min-width: 14px; + min-height: 14px; + text-align: center +} + +.key_c90023:not(:last-child) { + margin-right: 3px +} + +.key_c90023 .bindArrow_c90023 { + width: 10px; + height: 10px +} + +.key_c90023 .bindArrow_c90023.up_c90023 { + transform: rotate(180deg) +} + +.key_c90023:active { + transform: translatey(2px); + height: 21px; + padding-bottom: 2px +} + +.theme-dark .combo_c90023 { + color: var(--primary-100) +} + +.theme-dark .combo_c90023 .key_c90023 { + color: var(--primary-100); + box-shadow: inset 0 -4px 0 var(--primary-700) +} + +.theme-dark .combo_c90023 .key_c90023 .bindArrow_c90023 g { + fill: var(--primary-100) +} + +.theme-dark .combo_c90023 .key_c90023:active { + color: var(--primary-300); + box-shadow: inset 0 -2px 0 var(--primary-600); + border: 1px solid var(--primary-700) +} + +.theme-dark .combo_c90023 .key_c90023:active .bindArrow_c90023 g { + fill: var(--primary-300) +} + +.hiddenVisually_a98a7c { + clip: rect(0 0 0 0); + -webkit-clip-path: inset(50%); + clip-path: inset(50%); + height: 1px; + overflow: hidden; + position: absolute; + white-space: nowrap; + width: 1px +} + + +:root { + --custom-paginator-round-button-size: 28px +} + +@keyframes indeterminate1_c6473a { + 0% { + left: -35%; + right: 100% + } + + 60% { + left: 100%; + right: -90% + } + + to { + left: 100%; + right: -90% + } +} + +@keyframes indeterminate2_c6473a { + 0% { + left: -200%; + right: 100% + } + + 60% { + left: 107%; + right: -8% + } + + to { + left: 107%; + right: -8% + } +} + +.roleCircle_a26d7b { + display: flex; + align-items: center; + justify-content: center; + border-radius: 50%; + width: 12px; + height: 12px; + padding: 0; + margin: 0 4px; + flex-shrink: 0; + forced-color-adjust: none +} + +.containerTop_b18d5c { + display: flex; + flex-direction: column; + top: 36px; + z-index: 4999; + position: fixed; + left: 50%; + transform: translatex(-50%) +} + +@keyframes Shine__5dfa9 { + 0% { + transform: translate3d(-50%,0,0) + } + + to { + transform: translate3d(200%,0,0) + } +} + +@keyframes InstantShine_ef1cc2 { + 0% { + transform: translate3d(0%,0,0) + } + + to { + transform: translate3d(200%,0,0) + } +} + +.flowerStarContainer_ff7d90 { + display: flex; + align-items: center; + justify-content: center; + position: relative +} + +.flowerStar_ff7d90 { + width: 100%; + height: 100% +} + +.childContainer_ff7d90 { + position: absolute; + top: -.05px; + left: .05px; + right: 0; + bottom: 0; + display: flex; + align-items: center; + justify-content: center; + pointer-events: none +} + +.redesignIconChildContainer_ff7d90>svg { + width: 12px; + height: 12px +} + +.icon_f11207 { + position: relative; + background-clip: padding-box; + background-color: none; + background-position: center center; + background-size: 100%100% +} + +.iconInactive_f11207 { + border-radius: 50% +} + +.iconActiveLarge_f11207 { + border-radius: 15px +} + +.iconSizeSmol_f11207 { + width: 16px; + height: 16px +} + +.iconSizeLarge_f11207 { + width: 50px; + height: 50px +} + +.acronym_f11207 { + overflow: hidden; + white-space: nowrap; + width: 100% +} + +.noIcon_f11207 { + background-color: var(--background-secondary); + color: var(--text-normal); + text-align: center +} + +.noIcon_f11207.iconSizeSmol_f11207 { + line-height: 16px +} + +.noIcon_f11207.iconSizeLarge_f11207 { + line-height: 50px +} + +.overflow_c74e70 { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + position: relative +} + +.imageWrapper__178ee { + display: block; + position: relative; + -webkit-user-select: text; + -moz-user-select: text; + user-select: text; + overflow: hidden; + border-radius: 3px +} + +.clickableWrapper__2d2ea,.loadingOverlay__35a04 { + width: 100%; + height: 100% +} + +.imageZoom__9528e { + cursor: nesw-resize; + cursor: zoom-in +} + +.clickable__2869d { + cursor: pointer +} + +.originalLink__0d99e { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1 +} + +.mediaBarInteraction_f7877e { + position: relative; + flex: 1 1 auto; + align-self: stretch; + display: flex; + align-items: center; + cursor: pointer; + margin: 0 7px +} + +.mediaBarInteraction_f7877e:hover .mediaBarWrapper_f7877e { + box-shadow: 0 1px 1px hsl(var(--black-500-hsl)/.3) +} + +.mediaBarInteraction_f7877e:hover .bubble_f7877e { + opacity: 1 +} + +.mediaBarInteraction_f7877e:hover .mediaBarGrabber_f7877e { + transform: scale(1); + background-color: var(--brand-experiment-560) +} + +.mediaBarInteraction_f7877e:hover .mediaBarPreview_f7877e { + opacity: .3 +} + +.mediaBarInteraction_f7877e:hover .bubble_f7877e { + opacity: 1 +} + +.mediaBarInteractionVolume_f7877e { + flex: none; + align-self: center; + border-radius: 8px; + background-color: hsl(var(--black-500-hsl)/.7); + padding: 4px 8px; + width: 72px; + margin: 0 4px 0 0 +} + +.vertical_f7877e { + display: flex; + align-items: center; + transform-origin: top; + transform: rotate(270deg); + height: 54px; + width: 140px +} + +.horizontal_f7877e { + width: 100%; + display: flex; + align-self: stretch +} + +.fakeEdges_f7877e { + position: relative +} + +.fakeEdges_f7877e:before,.fakeEdges_f7877e:after { + content: ""; + position: absolute; + top: 0; + height: 100%; + width: 3px; + z-index: 1 +} + +.fakeEdges_f7877e:before { + left: -3px; + border-radius: 3px 0 0 3px +} + +.fakeEdges_f7877e:after { + right: -3px; + border-radius: 0 3px 3px 0 +} + +.buffer_f7877e { + position: absolute; + top: 0; + left: 0; + height: 100%; + opacity: .3; + background-color: var(--white-500) +} + +.buffer_f7877e:before,.buffer_f7877e:after { + background-color: var(--white-500) +} + +.mediaBarWrapper_f7877e { + position: relative; + flex: 1 1 auto; + height: 6px; + background-color: hsl(var(--primary-300-hsl)/.3) +} + +.mediaBarWrapper_f7877e:before,.mediaBarWrapper_f7877e:after { + background-color: hsl(var(--primary-300-hsl)/.3) +} + +.mediaBarWrapperVolume_f7877e { + flex: none; + display: flex; + width: 72px; + justify-content: center +} + +.mediaBarPreview_f7877e,.mediaBarProgress_f7877e { + position: absolute; + top: 0; + left: 0; + height: 100% +} + +.mediaBarPreview_f7877e { + z-index: 0; + opacity: 0; + background-color: var(--white-500) +} + +.mediaBarPreview_f7877e:before,.mediaBarPreview_f7877e:after { + background-color: var(--white-500) +} + +.mediaBarProgress_f7877e { + z-index: 3; + background-color: var(--brand-experiment) +} + +.mediaBarProgress_f7877e:before,.mediaBarProgress_f7877e:after { + background-color: var(--brand-experiment) +} + +.mediaBarGrabber_f7877e { + position: absolute; + top: 50%; + right: 0; + z-index: 2; + width: 10px; + height: 10px; + border-radius: 5px; + margin-top: -5px; + margin-right: -5px; + background-color: var(--brand-experiment); + transform: scale(0); + transform-origin: 50%50%; + transition: transform.25s ease-in-out,background-color.25s linear; + cursor: grab +} + +.bubble_f7877e { + border-radius: 3px; + position: absolute; + top: -28px; + padding: 0 8px; + transform: translatex(-50%); + width: auto; + height: 18px; + line-height: 18px; + text-align: center; + font-weight: 600; + font-size: 12px; + color: var(--primary-100); + opacity: 0; + transition: opacity.2s ease-out; + pointer-events: none; + background-color: var(--black-500) +} + +.bubble_f7877e:before { + position: absolute; + top: 100%; + left: 50%; + border: 5px solid transparent; + content: " "; + width: 0; + height: 0; + pointer-events: none; + margin-left: -5px; + border-top-color: var(--black-500) +} + +.wrapper_c8da25 { + box-sizing: border-box; + display: flex; + padding: 12px; + height: 48px; + border-radius: 24px; + background-color: hsl(var(--black-500-hsl)/.6); + color: var(--white-500); + flex: 0 0 auto; + pointer-events: none +} + +.wrapper_c8da25 a:link,.wrapper_c8da25 a:visited { + color: var(--white-500)!important +} + +.wrapper_c8da25 a:link,.wrapper_c8da25 a:visited { + pointer-events: auto; + cursor: pointer; + display: block +} + +.iconWrapper_c8da25 { + pointer-events: auto; + flex: 0 0 auto; + opacity: .6; + cursor: pointer; + transition: opacity.25s,color.25s; + display: flex; + align-items: center +} + +.iconWrapperActive_c8da25:hover { + opacity: 1 +} + +.iconWrapperActive_c8da25:active { + transform: translatey(1px) +} + +.icon_c8da25 { + display: block; + width: 24px; + height: 24px +} + +.iconPlay_c8da25 { + margin-left: 1px; + margin-right: -1px +} + +.iconExternalMargins_c8da25 { + margin-left: 2px; + margin-right: 4px +} + +.container_c30bea { + justify-content: flex-end; + align-items: center; + flex-direction: column; + display: flex; + position: relative +} + +.volumeButton_c30bea { + line-height: 0 +} + +.volumeButtonSlider_c30bea { + position: absolute; + bottom: calc(100% + 16px); + left: -78px; + right: 0; + display: none; + -webkit-app-region: no-drag +} + +.wrapper_f316dd { + position: relative; + overflow: hidden; + border-radius: 3px; + color: var(--white-500); + -webkit-user-select: none; + -moz-user-select: none; + user-select: none +} + +.wrapperAudio_f316dd { + padding: 10px; + display: flex; + flex-direction: column; + border-style: solid; + border-width: 1px; + justify-content: space-between; + overflow: visible; + max-width: 100%; + box-sizing: border-box +} + +.wrapperAudio_f316dd.newMosaicStyle_f316dd { + padding: 16px; + border-radius: 8px; + width: 432px +} + +.audioControls_f316dd { + width: 100%; + display: flex; + align-items: center; + margin-top: 4px; + background-color: hsl(var(--black-500-hsl)/.6); + border-radius: 3px +} + +.controlIcon_f316dd { + display: block; + width: 24px; + height: 24px; + padding: 4px; + cursor: pointer; + flex: 0 0 auto; + opacity: .6 +} + +.controlIcon_f316dd:hover { + opacity: 1 +} + +.controlIcon_f316dd:active { + transform: translatey(1px) +} + +.volumeSliderWrapper_f316dd { + margin-bottom: 4px; + margin-left: -4px +} + +.durationTimeWrapper_f316dd { + flex: 0 0 auto; + margin: 4px; + height: 12px +} + +.durationTimeSeparator_f316dd,.durationTimeDisplay_f316dd { + font-weight: 500; + display: inline-block; + font-family: var(--font-code); + font-size: 12px; + line-height: 12px; + vertical-align: text-top +} + +.durationTimeSeparator_f316dd { + margin: 0 2px +} + +.audio_f316dd { + position: absolute; + display: block; + width: 0; + height: 0 +} + +.audioMetadata_f316dd { + display: flex +} + +.audioMetadata_f316dd:before { + width: 24px; + height: 40px; + content: ""; + background-image: url(/assets/f2f403e2279383b7e7e3.svg); + background-size: 100%auto; + background-repeat: no-repeat +} + +.audioMetadata_f316dd .metadataContent_f316dd { + padding: 0 8px +} + +.audioMetadata_f316dd .metadataDownload_f316dd { + height: 24px; + opacity: 1 +} + +.audioMetadata_f316dd .metadataSize_f316dd { + color: var(--text-muted) +} + +.metadataContent_f316dd { + flex: 1 1 auto; + white-space: nowrap; + overflow: hidden +} + +.metadataSize_f316dd { + font-size: 12px; + line-height: 16px; + font-weight: 500; + opacity: .7; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +.metadataDownload_f316dd { + flex: 0 0 auto; + opacity: .6 +} + +.metadataDownload_f316dd:hover { + opacity: 1 +} + +.videoButton_f316dd { + margin-right: 8px +} + +@keyframes overlayContentHidden_f316dd { + 0% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +.theme-dark .wrapper_f316dd { + background-color: var(--primary-700) +} + +.theme-dark .wrapperAudio_f316dd { + border-color: var(--background-secondary-alt); + background-color: var(--background-secondary) +} + +.theme-dark { + --__spoiler-background-color--hidden: var(--primary-700); + --__spoiler-background-color--hidden--hover: hsl(var(--primary-700-hsl) / 0.8); + --__spoiler-background-color--revealed: hsl(var(--white-500-hsl) / 0.1); + --__spoiler-text-color--hidden: transparent; + --__spoiler-warning-text-color: var(--primary-200); + --__spoiler-warning-text-color--hover: var(--white-500); + --__spoiler-warning-background-color: hsl(var(--black-500-hsl) / 0.6); + --__spoiler-warning-background-color--hover: hsl(var(--black-500-hsl) / 0.9); + --__spoiler-container-box-shadow-color: hsl(var(--black-500-hsl) / 0.1) +} + +.wrapper_fd07a3 { + position: relative; + overflow: hidden; + width: 8px; + height: 48px; + display: flex; + align-items: center; + justify-content: flex-start; + contain: layout size +} + +.item_fd07a3 { + position: absolute; + display: block; + width: 8px; + border-radius: 0 4px 4px 0; + margin-left: -4px; + background-color: var(--header-primary) +} + + +@use postcss-pxtorem; + +.container_ad9cbd { + width: 100%; + display: grid +} + +.textContainer_ad9cbd { + min-height: 118px; + height: 100%; + overflow: hidden; + background-color: var(--background-secondary); + border: 1px solid var(--background-secondary-alt); + box-sizing: border-box; + border-radius: 4px 4px 0 0 +} + +.textContainer_ad9cbd pre { + box-sizing: border-box; + border-radius: 4px 4px 0 0 +} + +.newMosaicStyle_ad9cbd .textContainer_ad9cbd { + border-radius: 8px 8px 0 0 +} + +.codeView_ad9cbd { + font-size: .875rem; + line-height: 1rem; + min-height: 100px +} + +.codeView_ad9cbd::-webkit-scrollbar-track { + margin: 0 .5em +} + +.newMosaicStyle_ad9cbd .codeView_ad9cbd { + margin: 8px 8px 0; + padding: 8px +} + +.footer_ad9cbd { + background-color: var(--background-secondary); + display: flex; + align-items: center; + justify-content: flex-end; + flex-shrink: 0; + height: 40px; + border: 1px solid var(--background-secondary-alt); + border-top: 0; + box-sizing: border-box; + border-radius: 0 0 4px 4px; + padding: 0 10px; + font-size: .875rem; + min-width: 0 +} + +.newMosaicStyle_ad9cbd .footer_ad9cbd { + border-radius: 0 0 8px 8px; + padding: 0 16px +} + +.toggleExpandSection_ad9cbd { + cursor: pointer; + display: flex; + align-items: center; + flex-shrink: 0; + padding-right: 10px +} + +.toggleExpandSection_ad9cbd:hover { + color: var(--interactive-hover) +} + +.openFullPreviewSection_ad9cbd { + cursor: pointer; + padding-top: 4px +} + +.openFullPreviewSection_ad9cbd:hover { + color: var(--interactive-hover) +} + +.footerGap_ad9cbd { + flex: 200 0 auto +} + +.downloadSection_ad9cbd { + color: var(--interactive-normal) +} + +.downloadSection_ad9cbd:hover { + color: var(--interactive-hover); + -webkit-text-decoration: none; + text-decoration: none +} + +.attachmentName_ad9cbd { + flex: 0 1 auto; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + display: inline-block; + text-align: right +} + +.formattedSize_ad9cbd { + padding-left: 2px; + color: var(--interactive-muted); + text-align: right; + flex: 1 0 auto +} + +.downloadButton_ad9cbd { + padding-left: 4px +} + +.codeIcon_ad9cbd { + min-width: 24px; + padding-left: 4px; + padding-bottom: 4px +} + +.codeIcon_ad9cbd:hover { + color: var(--interactive-hover) +} + +.nowrap_c74e8c { + white-space: nowrap +} + +.icon_b52c3f { + width: 1em; + height: 1em; + vertical-align: middle; + margin-bottom: .2rem; + margin-right: var(--spacing-4) +} + +.name_b52c3f { + text-overflow: ellipsis; + overflow: hidden +} + +.wrapper_a7c28c { + border-radius: 3px; + padding: 0 2px; + font-weight: 500; + unicode-bidi: plaintext; + color: var(--mention-foreground); + background: var(--mention-background) +} + +.interactive { + transition: background-color 50ms ease-out,color 50ms ease-out; + cursor: pointer +} + +.interactive:hover { + color: var(--white-500); + background-color: var(--brand-experiment) +} + +.markup_d6076c { + font-size: 1rem; + line-height: 1.375rem; + white-space: pre-wrap; + white-space: wrap; + word-wrap: break-word; + -webkit-user-select: text; + -moz-user-select: text; + user-select: text; + color: var(--text-normal) +} + +.markup_d6076c a { + color: var(--text-link); + word-break: break-word; + -webkit-text-decoration: var(--link-decoration); + text-decoration: var(--link-decoration); + cursor: pointer +} + +.markup_d6076c a:hover { + -webkit-text-decoration: underline; + text-decoration: underline +} + +.markup_d6076c strong { + font-weight: 700 +} + +.markup_d6076c em { + font-style: italic +} + +.markup_d6076c pre { + box-sizing: border-box; + border-radius: 4px; + padding: 0; + font-family: var(--font-code); + font-size: .75rem; + line-height: 1rem; + margin-top: 6px; + max-width: 90%; + white-space: pre-wrap; + background-clip: border-box +} + +.markup_d6076c code { + font-size: .875rem; + line-height: 1.125rem; + text-indent: 0; + text-indent: 0; + white-space: pre-wrap; + background: var(--background-secondary); + border: 1px solid var(--background-tertiary) +} + +.markup_d6076c .inline { + width: auto; + height: auto; + padding: .2em; + margin: -.2em 0; + border-radius: 3px; + font-size: 85%; + font-family: var(--font-code); + text-indent: 0; + text-indent: 0; + border: none; + white-space: wrap +} + +.markup_d6076c .codeContainer_d6076c { + position: relative +} + +.markup_d6076c .codeActions_d6076c { + position: absolute; + display: none; + right: 4px; + top: 8px +} + +.markup_d6076c .codeActions_d6076c>div { + cursor: pointer +} + +.markup_d6076c .codeContainer_d6076c:hover .codeActions_d6076c { + display: block +} + +.markup_d6076c li { + white-space: break-spaces; + margin-bottom: 4px +} + +.markup_d6076c ul,.markup_d6076c ol { + margin: 4px 0 0 16px; + list-style-position: outside +} + +.markup_d6076c ul { + list-style-type: disc +} + +.markup_d6076c ol { + list-style-type: decimal; + margin-left: calc(.4em + .6em*var(--totalCharacters)) +} + +.markup_d6076c ul ul,.markup_d6076c ol ul { + list-style-type: circle; + margin-bottom: 0 +} + +.markup_d6076c ol ol,.markup_d6076c ul ol { + margin-bottom: 0 +} + +.markup_d6076c h1,.markup_d6076c h2,.markup_d6076c h3 { + font-family: var(--font-display); + font-weight: 700; + color: var(--header-primary); + line-height: 1.375em; + margin: 16px 0 4px +} + +.markup_d6076c h1 { + font-size: 1.5rem; + margin: 16px 0 8px +} + +.markup_d6076c h2 { + font-size: 1.25rem; + margin: 16px 0 8px +} + +.markup_d6076c h3 { + font-size: 1rem; + margin: 16px 0 8px +} + +.markup_d6076c h1:first-child,.markup_d6076c h2:first-child { + margin-top: 8px +} + +.markup_d6076c h3:first-child { + margin-top: 4px +} + +@keyframes placeholderPulse__92648 { + 0% { + opacity: .5 + } + + 50% { + opacity: 1 + } + + to { + opacity: .5 + } +} + +.container_e9f61e { + box-sizing: border-box; + display: block; + padding: 1px 0; + border-radius: 4px; + transition: none; + color: var(--channels-default) +} + +.clickable_e9f61e.container_e9f61e:hover { + color: var(--interactive-hover) +} + +.clickable_e9f61e.container_e9f61e:hover .avatar_e9f61e { + opacity: 1 +} + +.clickable_e9f61e.container_e9f61e:active,.selected_e9f61e.container_e9f61e { + color: var(--interactive-active) +} + +.layout_e9f61e { + display: flex; + align-items: center; + border-radius: 4px; + height: 42px; + padding: 0 8px +} + +.clickable_e9f61e:hover .layout_e9f61e { + background-color: var(--background-modifier-hover); + cursor: pointer +} + +.clickable_e9f61e:active .layout_e9f61e { + background-color: var(--background-modifier-active) +} + +.selected_e9f61e .layout_e9f61e { + background-color: var(--background-modifier-selected) +} + +.avatar_e9f61e { + display: flex; + align-items: center; + justify-content: center; + flex: 0 0 auto; + width: 32px; + height: 32px; + margin-right: 12px +} + +.content_e9f61e { + min-width: 0; + flex: 1 1 auto; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +.name_e9f61e { + font-size: 16px; + line-height: 20px; + font-weight: 500; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + flex: 0 1 auto +} + +.nameAndDecorators_e9f61e { + display: flex; + justify-content: flex-start; + align-items: center +} + +.subText_e9f61e { + margin-top: -2px; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +.subText_e9f61e:empty { + display: none +} + +.container_cc72c1 { + box-sizing: border-box; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + text-transform: uppercase; + font-size: 12px; + line-height: 16px; + letter-spacing: .02em; + font-family: var(--font-display); + font-weight: 600; + flex: 1 1 auto; + color: var(--channels-default) +} + +.divider_fc5f50 { + z-index: 1; + height: 0; + border-top: thin solid var(--background-modifier-accent); + display: flex; + align-items: center; + justify-content: center; + position: relative; + flex: 0 0 auto; + pointer-events: none; + box-sizing: border-box; + --divider-color: var(--status-danger) +} + +.isUnread_fc5f50 { + border-color: var(--divider-color) +} + +.hasContent_fc5f50 { + position: relative; + left: auto; + right: auto +} + +.endCap_fc5f50 { + position: absolute; + display: flex; + align-items: center; + justify-content: center; + top: -7px; + height: 13px; + right: 0; + font-size: 10px; + line-height: 9px; + font-weight: 700; + padding: 0 4px 0 1px; + border-radius: 0 4px 4px 0; + text-transform: uppercase; + color: var(--white-500); + box-sizing: border-box; + border-left: none +} + +.unreadPill_fc5f50 { + background-color: var(--divider-color) +} + +.unreadPillCap_fc5f50 { + display: block; + position: absolute; + left: -8px; + top: 0; + height: 13px +} + +.unreadPillCapStroke_fc5f50 { + color: var(--divider-color); + fill: var(--divider-color) +} + +.content_fc5f50 { + display: block; + flex: 0 0 auto; + padding: 2px 4px; + color: var(--text-muted); + background: var(--bg-overlay-chat,var(--background-primary)); + line-height: 13px; + font-size: 12px; + margin-top: -1px; + font-weight: 600; + border-radius: 8px +} + +.isUnread_fc5f50 .content_fc5f50 { + color: var(--divider-color) +} + +.emojiButton_af14ca { + max-height: 50px; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center +} + +.spriteContainer_af14ca { + position: relative; + width: var(--custom-emoji-sprite-size); + height: var(--custom-emoji-sprite-size); + display: block; + --custom-emoji-sprite-bg-position: calc(-1 * var(--custom-emoji-sprite-col) * var(--custom-emoji-sprite-size)) calc(-1 * var(--custom-emoji-sprite-row) * var(--custom-emoji-sprite-size)); + --custom-emoji-sprite-bg-size: calc(20 * var(--custom-emoji-sprite-size)) calc(4 * var(--custom-emoji-sprite-size)) +} + +.sprite_af14ca { + position: absolute; + top: 0; + left: 0; + width: var(--custom-emoji-sprite-size); + height: var(--custom-emoji-sprite-size); + display: block +} + +.spriteColored_af14ca { + background-image: url(/assets/1cc4d6bf26f571d0c695.png); + background-position: var(--custom-emoji-sprite-bg-position); + background-size: var(--custom-emoji-sprite-bg-size) +} + +.spriteGreyscale_af14ca { + -webkit-mask-image: url(/assets/0c81fb35c18e223d2745.png); + mask-image: url(/assets/0c81fb35c18e223d2745.png); + -webkit-mask-position: var(--custom-emoji-sprite-bg-position); + mask-position: var(--custom-emoji-sprite-bg-position); + -webkit-mask-size: var(--custom-emoji-sprite-bg-size); + mask-size: var(--custom-emoji-sprite-bg-size); + background-color: var(--interactive-normal) +} + +.inactive_af14ca { + opacity: 0 +} + +.active_af14ca { + opacity: 1 +} + +.titleBar_a934d8 { + z-index: 3001; + -webkit-app-region: drag; + flex-shrink: 0 +} + +.withFrame_a934d8 { + height: 18px; + margin-top: 4px +} + +.typeWindows_a934d8 { + align-items: stretch; + justify-content: flex-start; + flex-direction: row-reverse; + display: flex +} + +.wordmark_a934d8 { + pointer-events: none; + font-size: 0 +} + +.wordmarkWindows_a934d8 { + position: absolute; + top: 0; + left: 0; + padding: 4px 9px 3px; + color: var(--text-muted) +} + +.winButton_a934d8 { + position: relative; + top: -4px; + cursor: pointer; + justify-content: center; + align-items: center; + display: flex; + width: 28px; + height: 22px; + pointer-events: auto; + -webkit-app-region: no-drag +} + +.winButtonMinMax_a934d8:hover { + background-color: var(--background-modifier-hover); + color: var(--interactive-hover) +} + +.winButtonMinMax_a934d8:active { + background-color: var(--background-modifier-active); + color: var(--interactive-active) +} + +.winButtonClose_a934d8:hover { + color: var(--white-500); + background-color: var(--status-danger) +} + +.winButton_a934d8 { + color: var(--interactive-normal) +} + +.lottieIcon_f73ef7 :not(defs *)[fill][fill-opacity] { + fill: var(--__lottieIconColor,var(--interactive-normal)) +} + +.lottieIcon_f73ef7 :not(defs *)[stroke][stroke-opacity] { + stroke: var(--__lottieIconColor,var(--interactive-normal)) +} + +.lottieIcon_f73ef7 svg { + transform: none!important +} + +@keyframes pulseIcon_cecf00 { + 0%,to { + transform: scale(var(--custom-channel-text-area-button-hover-scale)) + } + + 50% { + transform: none + } +} + +@keyframes pulseButton_cecf00 { + 0%,to { + opacity: .3 + } + + 50% { + opacity: 1 + } +} + +@keyframes sparkle__4f97f { + 0% { + opacity: 0; + transform: rotate(-50deg)scale(0) + } + + 20% { + opacity: 1; + transform: rotate(0)scale(1) + } + + 40% { + opacity: 0; + transform: rotate(50deg)scale(0) + } + + to { + opacity: 0; + transform: rotate(-50deg)scale(0) + } +} + +.buttonWrapper_cecf00 { + cursor: pointer +} + +.button_cecf00 { + display: flex; + align-items: center; + justify-content: center; + color: var(--interactive-normal) +} + +.button_cecf00:hover { + color: var(--interactive-hover) +} + +.button_cecf00:active { + color: var(--interactive-active) +} + +.buttonWrapper_cecf00 svg { + display: block +} + +.buttonWrapper_cecf00:hover { + color: var(--interactive-active) +} + +:root { + --legacy-elevation-low: 0 1px 5px hsl(var(--black-500-hsl) / 0.2); + --legacy-elevation-high: 0 2px 10px 0 hsl(var(--black-500-hsl) / 0.1); + --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-300-hsl) / 0.3) +} + +.theme-dark { + --legacy-elevation-low: 0 1px 5px 0 hsl(var(--black-500-hsl) / 0.3); + --legacy-elevation-high: 0 2px 10px 0 hsl(var(--black-500-hsl) / 0.2); + --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-700-hsl) / 0.6) +} + +.wrapper_ef319f { + background-color: var(--background-primary); + box-shadow: var(--elevation-stroke); + display: grid; + grid-auto-flow: column; + box-sizing: border-box; + height: 32px; + border-radius: 4px; + align-items: center; + justify-content: flex-start; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + transition: box-shadow.1s ease-out; + position: relative; + overflow: hidden +} + +.full-motion .wrapper_ef319f:hover { + box-shadow: var(--elevation-stroke),var(--elevation-medium) +} + +.button_ef319f { + display: flex; + align-items: center; + justify-content: center; + height: 24px; + padding: 4px; + min-width: 24px; + flex: 0 0 auto; + color: var(--interactive-normal); + cursor: pointer; + position: relative +} + +.button_ef319f:hover { + color: var(--interactive-hover); + background-color: var(--background-modifier-hover) +} + +.button_ef319f:active { + padding-top: 5px; + padding-bottom: 3px; + color: var(--interactive-active); + background-color: var(--background-modifier-active) +} + + + +@use postcss-pxtorem;.wrapper_ec86aa { + position: relative; + word-wrap: break-word; + -webkit-user-select: text; + -moz-user-select: text; + user-select: text; + flex: 0 0 auto; + padding-right: var(--custom-message-margin-horizontal); + min-height: 1.375rem +} + +.cozy_ec86aa.wrapper_ec86aa { + padding-top: var(--custom-message-spacing-vertical-container-cozy); + padding-bottom: var(--custom-message-spacing-vertical-container-cozy); + padding-left: var(--custom-message-margin-left-content-cozy) +} + +.cozy_ec86aa .contents_ec86aa { + position: static; + margin-left: 0; + padding-left: 0; + text-indent: 0 +} + +.cozy_ec86aa .header_ec86aa { + display: block; + position: relative; + line-height: 1.375rem; + min-height: 1.375rem; + color: var(--text-muted); +} + +.zalgo_ec86aa.cozy_ec86aa .header_ec86aa { + overflow: hidden +} + +.buttonContainer_ec86aa { + position: absolute; + top: 0; + right: 0 +} + +.avatar_ec86aa { + position: absolute; + left: var(--custom-message-margin-horizontal); + margin-top: calc(4px - var(--custom-message-spacing-vertical-container-cozy)); + width: 40px; + height: 40px; + border-radius: 50%; + overflow: hidden; + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + flex: 0 0 auto; + pointer-events: none; + z-index: 1 +} + +.avatar_ec86aa:before { + content: ""; + display: block; + width: 100%; + height: 100%; + background-color: var(--background-modifier-accent) +} + +.avatar_ec86aa.clickable_ec86aa { + pointer-events: auto +} + +.full-motion .avatar_ec86aa.clickable_ec86aa:hover { + filter: drop-shadow(var(--elevation-medium)) +} + +.avatar_ec86aa.clickable_ec86aa:active { + transform: translatey(1px) +} + +.timestamp_ec86aa { + display: inline-block; + height: 1.25rem; + cursor: default; + pointer-events: none; + font-weight: 500 +} + +.timestampInline_ec86aa { + margin-left: .25rem +} + +.timestamp_ec86aa.latin12CompactTimeStamp_ec86aa { + width: 2.25rem +} + +.cozy_ec86aa .timestamp_ec86aa { + font-size: .75rem; + line-height: 1.375rem; + color: var(--text-muted); + vertical-align: baseline +} + +.cozy_ec86aa .timestamp_ec86aa.alt_ec86aa { + text-align: right; + font-size: .6875rem; + line-height: 1.375rem; + margin-right: var(--custom-message-meta-space); + color: var(--text-muted); + text-indent: 0 +} + +.cozy_ec86aa .timestamp_ec86aa.alt_ec86aa { + position: absolute; + left: 0; + height: 1.375rem; + line-height: 1.375rem; + width: 56px; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + text-align: right; + z-index: 1 +} + +.timestampVisibleOnHover_ec86aa { + opacity: 0 +} + +.username_ec86aa { + font-size: 1rem; + font-weight: 500; + line-height: 1.375rem; + color: var(--header-primary); + display: inline; + vertical-align: baseline; + position: relative; + overflow: hidden; + flex-shrink: 0 +} + +.cozy_ec86aa .headerText_ec86aa { + margin-right: .25rem +} + +.username_ec86aa.clickable_ec86aa:hover { + cursor: pointer; + -webkit-text-decoration: underline; + text-decoration: underline +} + +.separator_ec86aa { + position: absolute; + opacity: 0; + display: inline-block; + font-style: normal +} + +.messageContent_ec86aa { + text-indent: 0 +} + +.cozy_ec86aa .messageContent_ec86aa { + position: relative +} + +.cozy_ec86aa.hasThread_ec86aa:after { + border-left: 2px solid var(--interactive-muted); + border-bottom: 2px solid var(--interactive-muted); + border-bottom-left-radius: 8px; + bottom: 29px; + content: ""; + position: absolute +} + +.font-size-16 .cozy_ec86aa.hasThread_ec86aa:after { + width: 2rem; + left: 2.2rem; + top: 3rem +} + +.font-size-16 .cozy_ec86aa.hasThread_ec86aa.isSystemMessage_ec86aa:after { + top: 1.75rem +} + +.zalgo_ec86aa .messageContent_ec86aa { + overflow: hidden +} + +.messageContent_ec86aa:empty { + display: none +} + +.cozy_ec86aa .messageContent_ec86aa { + -webkit-user-select: text; + -moz-user-select: text; + user-select: text; + margin-left: calc(-1*var(--custom-message-margin-left-content-cozy)); + padding-left: var(--custom-message-margin-left-content-cozy) +} + +.edited_ec86aa { + font-size: .625rem; + font-weight: 400; + line-height: 1; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none +} + +.mention { + border-radius: 3px; + padding: 0 2px +} + +@use postcss-pxtorem; + +.embed_ad0b71 { + position: relative; + display: grid; + max-width: -moz-max-content; + max-width: max-content; + box-sizing: border-box; + border-radius: 4px +} + +.embed_ad0b71 .emoji { + width: 18px; + height: 18px +} + +.embed_ad0b71 h1 .emoji,.embed_ad0b71 h2 .emoji,.embed_ad0b71 h3 .emoji { + width: 1.375em; + height: 1.375em +} + +.embed_ad0b71 pre { + max-width: 100%; + border: none +} + +.embed_ad0b71 code { + border: none; + background: var(--background-tertiary) +} + +.embedFull_ad0b71 { + border-left: 4px solid var(--background-tertiary); + background: var(--background-secondary) +} + +.embedProvider_ad0b71,.embedLink_ad0b71,.embedAuthorName_ad0b71,.embedAuthorNameLink_ad0b71,.embedTitle_ad0b71,.embedTitleLink_ad0b71 { + unicode-bidi: plaintext; + text-align: left +} + +.gridContainer_ad0b71 { + max-width: 516px +} + +.grid_ad0b71 { + overflow: hidden; + padding: .5rem 1rem 1rem .75rem; + display: grid; + grid-template-columns: auto; + grid-template-rows: auto +} + +.embedMargin_ad0b71 { + margin-top: 8px +} + +.embedLink_ad0b71 { + -webkit-text-decoration: none; + text-decoration: none; + cursor: pointer +} + +.embedLink_ad0b71:hover { + -webkit-text-decoration: underline; + text-decoration: underline +} + +.embedSuppressButton_ad0b71 { + opacity: 0; + position: absolute; + top: -2px; + right: -20px; + cursor: pointer; + padding: 2px; + color: var(--interactive-normal) +} + +.embed_ad0b71:hover .embedSuppressButton_ad0b71,.embed_ad0b71:focus-within .embedSuppressButton_ad0b71 { + opacity: 1 +} + +.embedSuppressButton_ad0b71:hover { + color: var(--interactive-hover) +} + +.embedProvider_ad0b71 { + font-size: .75rem; + line-height: 1rem; + font-weight: 400; + grid-column: 1/1 +} + +.embedAuthor_ad0b71 { + display: flex; + align-items: center; + grid-column: 1/1 +} + +.embedAuthorName_ad0b71 { + font-size: .875rem; + font-weight: 600 +} + +.embed_ad0b71 .embedAuthorNameLink_ad0b71 { + color: var(--embed-title) +} + +.embedTitle_ad0b71 { + font-size: 1rem; + font-weight: 600; + display: inline-block; + grid-column: 1/1 +} + +.embedVideo_ad0b71 { + display: block; + -o-object-fit: fill; + object-fit: fill +} + +.embedVideo_ad0b71 img { + display: block; + border-radius: 4px +} + +.embedVideo_ad0b71 { + display: flex; + position: relative +} + +.centerContent_ad0b71,.embedVideoImageComponent_ad0b71,.embedVideoActions_ad0b71 { + display: flex; + align-items: center; + justify-content: center +} + +.embedVideoImageComponent_ad0b71 { + width: 100%!important; + height: 100%!important; + max-height: 100%; + border-radius: 0 +} + +.embedVideoImageComponentInner_ad0b71 { + width: 100%!important; + height: 100%!important; + -o-object-fit: cover; + object-fit: cover +} + +.embedVideoActions_ad0b71 { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + pointer-events: none; + z-index: 1 +} + +.embedMedia_ad0b71 { + grid-column: 1/1; + border-radius: 4px; + contain: paint +} + +.embedFull_ad0b71 .embedMedia_ad0b71 { + margin-top: 16px +} + +.embedProvider_ad0b71 .embedLink_ad0b71 { + color: var(--interactive-normal) +} + +.embedProvider_ad0b71 .embedLink_ad0b71:hover { + color: var(--interactive-hover) +} + +.embedAuthorName_ad0b71,.embedTitle_ad0b71 { + color: var(--embed-title) +} + +.embedProvider_ad0b71,.embedAuthor_ad0b71,.embedTitle_ad0b71,.embedMedia_ad0b71 { + min-width: 0 +} + +.justifyAuto_ad0b71 { + justify-self: auto!important +} + +.hljs { + display: block; + overflow-x: auto; + padding: .5em; + border-radius: 4px; + -webkit-text-size-adjust: none; + text-size-adjust: none; + color: var(--text-normal); + background: var(--background-secondary) +} + +.theme-dark .hljs-keyword { + color: #ff7b72 +} + +.theme-dark .hljs-title,.theme-dark .hljs-title.function_ { + color: #d2a8ff +} + +.theme-dark .hljs-literal { + color: #79c0ff +} + +.theme-dark .hljs-comment { + color: #8b949e +} + +@keyframes sparkle_bce2e6 { + 0% { + background-position: 0 + } + + 40% { + background-position: -731px + } + + to { + background-position: -731px + } +} + +@keyframes pop_bce2e6 { + 0% { + background-position: 0 + } + + 40% { + background-position: -816px + } + + to { + background-position: -816px + } +} + +@keyframes light_bce2e6 { + 0% { + background-position: 0 + } + + 40% { + background-position: -600px + } + + to { + background-position: -600px + } +} + +@keyframes cross_bce2e6 { + 0% { + background-position: 0 + } + + 40% { + background-position: -600px + } + + to { + background-position: -600px + } +} + +@keyframes outgoing-call-pulse__82794 { + 0% { + opacity: 0; + transform: scalex(1) + } + + 11.56% { + opacity: 1 + } + + 39.02% { + opacity: 0; + transform: scale3d(1.1,1.1,1) + } + + 39.03% { + transform: scalex(1) + } + + 39.04% { + opacity: 1 + } + + 66.48% { + opacity: 0; + transform: scale3d(1.1,1.1,1) + } + + to { + opacity: 0; + transform: scalex(1) + } +} + +@keyframes incoming-call-pulse_ce510e { + 0% { + opacity: 0; + transform: scalex(1) + } + + .7% { + opacity: 1 + } + + 25.54% { + opacity: 0; + transform: scale3d(1.1,1.1,1) + } + + 25.55% { + transform: scalex(1) + } + + 25.56% { + opacity: 1 + } + + 49.98% { + opacity: 0; + transform: scale3d(1.1,1.1,1) + } + + 49.99% { + transform: scalex(1) + } + + 50% { + opacity: 1 + } + + 74.69% { + opacity: 0; + transform: scale3d(1.1,1.1,1) + } + + 74.7% { + transform: scalex(1) + } + + 74.71% { + opacity: 1 + } + + to { + opacity: 0; + transform: scale3d(1.1,1.1,1) + } +} + +.wrapper__8436d { + display: flex; + width: 48px; + height: 48px; + align-items: center; + justify-content: center; + transition: background-color.1s ease-out,color.1s ease-out +} + +.childWrapper_a6ce15 { + width: 48px; + height: 48px; + display: flex; + align-items: center; + justify-content: center; + transition: scale.15s ease-out,background-color.15s ease-out,color.15s ease-out; + color: var(--text-normal) +} + +.childWrapperNoHoverBg__7e8f1 { + background-color: var(--background-primary) +} + +.wrapper__8436d:hover .childWrapper_a6ce15,.wrapper__8436d.selected_ae80f7 .childWrapper_a6ce15 { + color: var(--white-500); + background-color: var(--brand-experiment) +} + +.acronym_fb7739 { + font-weight: 500; + line-height: 1.2em; + white-space: nowrap +} + +.container_c10249 { + position: absolute; + z-index: 2; + overflow: hidden; + padding: 8px; + height: 24px; + pointer-events: none +} + +.bar_c10249 { + display: flex; + align-items: center; + justify-content: center; + position: relative; + font-size: 12px; + line-height: 16px; + font-family: var(--font-display); + font-weight: 600; + color: var(--white-500); + height: 24px; + cursor: pointer; + text-transform: uppercase; + border-radius: 12px; + pointer-events: auto; + box-shadow: 0 2px 6px hsl(var(--black-500-hsl)/.24); + -webkit-app-region: no-drag +} + +.active_c10249:active { + top: 1px +} + +.unread_c10249 { + background-color: var(--background-accent); + opacity: .9 +} + +.unread_c10249:hover,.unread_c10249:active { + opacity: 1 +} + +.text_c10249 { + display: block +} + +strong { + font-weight: 600 +} + +.wrapper_b9fe76 { + cursor: default; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + background-color: var(--background-secondary); + border-radius: 4px; + padding: 16px; + max-width: 432px; + min-width: 160px; + width: 100%; + box-sizing: border-box; + display: flex; + flex-direction: column +} + +.header_b9fe76 { + font-weight: 700; + margin-bottom: 12px; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + color: var(--interactive-normal) +} + +.content_b9fe76 { + display: flex; + flex-flow: row wrap; + gap: 16px +} + +.guildIcon_b9fe76 { + background-color: var(--background-primary); + flex: 0 0 auto +} + +.inviteDestination_b9fe76 { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + margin-bottom: 2px +} + +.status_b9fe76 { + display: block; + flex: 0 0 auto; + margin-right: 4px; + width: 8px; + height: 8px; + border-radius: 50% +} + +.statusWrapper_b9fe76 { + display: flex; + flex: 0 1 auto; + align-items: center; + flex-flow: nowrap; + min-width: 0 +} + +.statusOnline_b9fe76 { + background-color: var(--green-360) +} + +.statusOffline_b9fe76 { + background-color: var(--primary-400) +} + +.count_b9fe76 { + flex: 0 1 auto; + margin-right: 8px; + color: var(--interactive-normal); + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +.count_b9fe76:last-child { + margin-right: 0 +} + +.guildNameWrapper_b9fe76 { + align-items: center; + display: flex; + flex: 0 1 auto; + overflow: hidden; + max-width: 100% +} + +.guildName_b9fe76 { + flex: 1 1 auto; + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap +} + +.guildInfo_b9fe76 { + min-width: 1px +} + +.guildDetail_b9fe76 { + font-size: 14px; + color: var(--interactive-normal); + line-height: 16px +} + +.statusCounts_b9fe76 { + display: flex; + flex-flow: row wrap; + align-items: center; + -moz-column-gap: 12px; + column-gap: 12px +} + +.inviteSplash_b9fe76 { + position: relative; + background-color: var(--background-modifier-accent); + border-radius: 4px 4px 0 0; + height: 64px; + margin-top: -16px; + margin-right: -16px; + margin-bottom: 16px; + margin-left: -16px; + overflow: hidden +} + +.inviteSplashImage_b9fe76 { + display: block; + -o-object-fit: cover; + object-fit: cover; + opacity: 0; + transition: opacity.125s; + width: 100%; + height: 100% +} + +.inviteSplashImageLoaded_b9fe76 { + opacity: 1 +} + +.button_b9fe76 { + line-height: 20px; + align-self: center; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + flex: 1 0 auto +} + +.button_b9fe76.buttonSize_b9fe76 { + height: 40px +} + +@keyframes invite-button-resolving_b9fe76 { + 0% { + transform: translate3d(calc(-1*var(--custom-invite-button-resolving-background-width)),0,0) + } + + 50% { + transform: translatez(0) + } + + to { + transform: translate3d(calc(-1*var(--custom-invite-button-resolving-background-width)),0,0) + } +} + +.theme-dark .guildIconImage_b9fe76 { + background-color: var(--primary-600) +} + +.mosaicItemContent_ab8b23 { + flex: auto +} + +.mosaicItem_ab8b23 { + display: flex; + flex-flow: row nowrap; + align-items: start; + max-width: 100%; + height: 100% +} + +.mosaicItemFullWidth_ab8b23 { + width: 100%; + align-items: center +} + +.mosaicItemMediaMosaic_ab8b23 { + position: relative; + max-height: inherit; + border-radius: 2px +} + +:hover+.hoverButtonGroup_ab8b23,.hoverButtonGroup_ab8b23:hover { + opacity: 1 +} + +.hoverButtonGroup_ab8b23 { + display: flex; + opacity: 0; + z-index: 2; + position: absolute; + border-radius: 5px; + top: 4px; + right: 4px; + background-color: var(--background-primary); + overflow: hidden +} + +.nonMediaMosaicItem_ab8b23 { + top: -8px; + right: -8px; + outline: 1px solid var(--background-secondary) +} + +.hoverButtonGroup_ab8b23:hover,.hoverButtonGroup_ab8b23:focus { + cursor: pointer +} + +.hoverButton_ab8b23 { + display: flex; + padding: 6px; + color: var(--interactive-normal) +} + +.hoverButton_ab8b23:hover { + background-color: var(--background-modifier-hover); + color: var(--interactive-hover) +} + +.hoverButton_ab8b23:active { + background-color: var(--background-modifier-active); + color: var(--interactive-active) +} + +.downloadHoverButtonIcon_ab8b23 { + width: 20px; + height: 20px +} + +.nonVisualMediaItemContainer_df7417 { + max-width: 100%; + display: flex; + flex-direction: column +} + +.nonVisualMediaItem_df7417 { + width: -moz-fit-content; + width: fit-content; + max-width: 100% +} + +.nonVisualMediaItemContainer_df7417,.nonVisualMediaItem_df7417+.nonVisualMediaItem_df7417 { + margin-top: 8px +} + +@use postcss-pxtorem;.container_e62b38 { + position: relative; + display: flex; + align-items: flex-start; + color: var(--channels-default); + flex: 0 0 auto; + padding-top: .125rem; + padding-bottom: .125rem +} + +.content_e62b38 { + font-weight: 400; + font-size: 1rem; + line-height: 1.375rem; + display: flex; + align-items: center; + flex-wrap: wrap +} + +.content_e62b38 a { + cursor: pointer; + color: var(--interactive-active); + font-weight: 500 +} + +.iconContainer_e62b38 { + position: absolute; + width: 2.5rem; + right: 100%; + display: flex; + align-items: center; + justify-content: center; + padding-top: .25rem +} + +.font-size-16 .cozy_e62b38 .iconContainer_e62b38 { + width: 4.5rem +} + +.icon_f054bd { + height: 1.125rem; + width: 1.125rem +} + +@keyframes shadowPulse__6c08a { + 0% { + box-shadow: 0 0 6px hsl(var(--red-400-hsl)/.3) + } + + 50% { + box-shadow: 0 0 10px hsl(var(--red-400-hsl)/.6) + } + + to { + box-shadow: 0 0 6px hsl(var(--red-400-hsl)/.3) + } +} + +.container_e44302 { + position: relative; + display: flex; + flex-direction: column; + justify-content: center; + min-width: 0; + width: 100%; + flex: 0 0 auto; + padding: 8px; + min-height: 48px; + box-sizing: border-box; + font-size: 16px; + line-height: 20px; + cursor: default; + z-index: 2; + color: var(--text-normal); + --__header-bar-background: var(--background-primary) +} + +.container_e44302 * { + box-sizing: border-box +} + +.upperContainer_e44302 { + display: flex; + flex: 1 +} + +.children_e44302 { + position: relative; + flex: 1 1 auto; + display: flex; + align-items: center; + min-width: 0; + overflow: hidden +} + +.children_e44302:after { + content: ""; + position: absolute; + top: 0; + right: 0; + width: 8px; + height: 100% +} + +.theme-dark .children_e44302:after { + background: linear-gradient(to right,rgba(54,57,63,0)0%,var(--__header-bar-background)100%) +} + +.toolbar_e44302 { + flex: 0 0 auto; + display: flex; + align-items: center; + min-width: 0 +} + +.title_e44302 { + display: flex; + justify-content: flex-start; + align-items: center; + overflow: hidden; + white-space: nowrap +} + +.titleWrapper_e44302 { + margin: 0 8px 0 0; + flex: 0 0 auto; + min-width: auto +} + +.clickable_e44302 { + cursor: pointer +} + +.iconWrapper_e44302 { + position: relative; + height: 24px; + width: auto; + flex: 0 0 auto; + margin: 0 8px +} + +.icon_e44302 { + display: block; + width: 24px; + height: 24px; + -webkit-app-region: no-drag; + color: var(--channel-icon) +} + +.clickable_e44302 .icon_e44302 { + color: var(--interactive-normal) +} + +.clickable_e44302:hover .icon_e44302 { + color: var(--interactive-hover) +} + +.selected_e44302 .icon_e44302 { + color: var(--interactive-active) +} + +.iconBadge_e44302 { + position: absolute; + right: 2px; + bottom: 2px; + width: 8px; + height: 8px; + border-radius: 8px; + background-color: var(--status-danger) +} + +.divider_e44302 { + width: 1px; + height: 24px; + margin: 0 8px; + flex: 0 0 auto; + background: var(--background-modifier-accent) +} + +.theme-dark .themed_e44302 { + background: var(--bg-overlay-2,var(--__header-bar-background)) +} + +.role_deddac { + display: inline-flex; + align-items: center; + width: auto; + padding: 4px 8px; + font-size: 12px; + line-height: 16px; + color: var(--interactive-active); + background-color: var(--background-secondary-alt); + border-radius: 4px +} + +.roleColor_deddac { + display: inline-block; + height: 8px; + width: 8px; + margin-right: 4px; + border-radius: 50%; + filter: saturate(1); + filter: saturate(var(--saturation-factor,1)) +} + +.button_da85cf { + display: inline-flex +} + +.role_da85cf:hover { + background-color: var(--background-modifier-hover) +} + + +@use postcss-pxtorem; + +@keyframes placeholderPulse__30bba { + 0% { + opacity: .6 + } + + 50% { + opacity: .8 + } + + to { + opacity: .6 + } +} + +.hoverRoll_c0d6c6 { + display: inline-block; + vertical-align: top; + cursor: default; + text-align: left; + box-sizing: border-box; + position: relative; + width: 100%; + contain: paint +} + +.hoverRoll_c0d6c6:hover:not(.disabled_c0d6c6) .default_c0d6c6 { + transform: translate3d(0,-107%,0); + opacity: 0; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none +} + +.hoverRoll_c0d6c6:hover:not(.disabled_c0d6c6) .hovered_c0d6c6 { + transform: translatez(0); + opacity: 1 +} + +.default_c0d6c6,.hovered_c0d6c6 { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + display: block; + transition: all.22s ease; + transform-style: preserve-3d; + pointer-events: none; + width: 100% +} + +.hovered_c0d6c6 { + opacity: 0; + transform: translate3d(0,107%,0); + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0 +} + +button.button_f67531,span.button_f67531 { + line-height: 0; + width: 32px; + height: 32px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 4px; + position: relative; + color: var(--interactive-normal) +} + +button.button_f67531.enabled_f67531:hover,span.button_f67531.enabled_f67531:hover { + color: var(--interactive-hover); + background-color: var(--background-modifier-selected) +} + +.subtext_e06aad { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + color: var(--header-secondary); + line-height: 13px +} + +.title_d1da5f { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + color: var(--header-primary); + line-height: 18px; + font-weight: 600 +} + + +@media screen and (max-width: 848px) { +} + +@keyframes footer-blob-animation_ad7a9f { + 0% { + d: path("M140.881198,194.260295 C257.600568,129.32862 342.939626,119.84993 418.009939,203.154617 C493.080251,286.459305 545.728689,70.9046172 636.439626,63.9593047 C727.150564,57.0139922 768.99822,139.670242 858.802907,119.431961 C948.607595,99.1936797 1071.91228,-32.9977266 1243.91228,7.75227342 C1415.91228,48.5022734 1404.10369,208.584305 1508.27166,178.709305 C1612.43963,148.834305 1633.73291,79.913472 1711.63588,98.8569055 C1776.28676,114.577866 1819.96778,221.391836 1889.37253,185.808108 C2017.32661,120.206212 2004.01952,336.769569 2004.01952,336.769569 L271.635881,337 L-149.063338,337 C-149.063338,337 -245.850307,175.637635 -58.0633382,228.867188 C33.8652851,254.92501 64.1722713,236.933925 140.881198,194.260295 Z") + } + + 50% { + d: path("M-60.13579,199.189799 C-33.8674767,-71.7287911 170.194454,11.9640675 274.985105,83.0972992 C379.775756,154.230531 409.072181,161.653171 521.54913,124.460269 C634.026079,87.2673683 645.348165,219.42808 735.152853,199.189799 C824.95754,178.951518 948.262228,46.7601116 1120.26223,87.5101116 C1292.26223,128.260112 1309.89513,321.347957 1414.0631,291.472957 C1518.23106,261.597957 1580.53259,89.5639434 1732.07052,88.5665294 C1892.57296,87.5101116 1897.70372,225.708266 2049.59054,199.189799 C2201.47736,172.671332 2002.94707,336.794682 2002.94707,336.794682 L270.563429,337.025114 L-60.13579,337.025114 C-60.13579,337.025114 -469.886827,134.917309 -282.099858,188.146862 C-190.171235,214.204685 -65.9645849,259.30515 -60.13579,199.189799 Z") + } + + to { + d: path("M-160.553381,263.533987 C-124.4955,243.377988 -18.6139605,181.080724 56.456352,264.385412 C131.526664,347.690099 165.148428,226.409513 223.668826,168.5 C282.189224,110.590487 372.68516,208.331261 462.489847,188.09298 C552.294535,167.854699 723.262827,-40.1656225 847.424394,40.7522734 C971.58596,121.670169 1156.59375,252.295176 1300.40314,228.958726 C1444.21253,205.622277 1478.90991,106.221579 1563.51957,124.699258 C1655.80276,144.85274 1595.69955,250.007434 1832.41793,206.740235 C2069.1363,163.473036 2002.94707,336.794682 2002.94707,336.794682 L270.563429,337.025114 L-60.13579,337.025114 C-60.13579,337.025114 -495.794798,256.512987 -308.007829,309.74254 C-216.079206,335.800362 -208.740043,290.469854 -160.553381,263.533987 Z") + } +} + +.pictureInPicture_d0596b { + position: absolute; + top: 0; + left: 0 +} + +html { + --brand-experiment-100: var(--brand-100); + --brand-experiment-130: var(--brand-130); + --brand-experiment-160: var(--brand-160); + --brand-experiment-200: var(--brand-200); + --brand-experiment-230: var(--brand-230); + --brand-experiment-260: var(--brand-260); + --brand-experiment-300: var(--brand-300); + --brand-experiment-330: var(--brand-330); + --brand-experiment-360: var(--brand-360); + --brand-experiment-400: var(--brand-400); + --brand-experiment-430: var(--brand-430); + --brand-experiment-460: var(--brand-460); + --brand-experiment: var(--brand-500); + --brand-experiment-500: var(--brand-500); + --brand-experiment-530: var(--brand-530); + --brand-experiment-560: var(--brand-560); + --brand-experiment-600: var(--brand-600); + --brand-experiment-630: var(--brand-630); + --brand-experiment-660: var(--brand-660); + --brand-experiment-700: var(--brand-700); + --brand-experiment-730: var(--brand-730); + --brand-experiment-760: var(--brand-760); + --brand-experiment-800: var(--brand-800); + --brand-experiment-830: var(--brand-830); + --brand-experiment-860: var(--brand-860); + --brand-experiment-900: var(--brand-900); + --brand-experiment-05a: hsl(var(--brand-500-hsl) / 0.05); + --brand-experiment-10a: hsl(var(--brand-500-hsl) / 0.1); + --brand-experiment-15a: hsl(var(--brand-500-hsl) / 0.15); + --brand-experiment-20a: hsl(var(--brand-500-hsl) / 0.2); + --brand-experiment-25a: hsl(var(--brand-500-hsl) / 0.25); + --brand-experiment-30a: hsl(var(--brand-500-hsl) / 0.3); + --brand-experiment-35a: hsl(var(--brand-500-hsl) / 0.35); + --brand-experiment-40a: hsl(var(--brand-500-hsl) / 0.4); + --brand-experiment-45a: hsl(var(--brand-500-hsl) / 0.45); + --brand-experiment-50a: hsl(var(--brand-500-hsl) / 0.5); + --brand-experiment-55a: hsl(var(--brand-500-hsl) / 0.55); + --brand-experiment-60a: hsl(var(--brand-500-hsl) / 0.6); + --brand-experiment-65a: hsl(var(--brand-500-hsl) / 0.65); + --brand-experiment-70a: hsl(var(--brand-500-hsl) / 0.7); + --brand-experiment-75a: hsl(var(--brand-500-hsl) / 0.75); + --brand-experiment-80a: hsl(var(--brand-500-hsl) / 0.8); + --brand-experiment-85a: hsl(var(--brand-500-hsl) / 0.85); + --brand-experiment-90a: hsl(var(--brand-500-hsl) / 0.9); + --brand-experiment-95a: hsl(var(--brand-500-hsl) / 0.95) +} + +.emoji { + -o-object-fit: contain; + object-fit: contain; + width: var(--custom-emoji-size-emoji); + height: var(--custom-emoji-size-emoji); + vertical-align: bottom +} + +.appAsidePanelWrapper_bd26cc { + flex: 1 1 auto; + display: flex; + flex-direction: row; + min-height: 0 +} + +.notAppAsidePanel_bd26cc { + flex: 1; + min-width: 0 +} + +.app_bd26cc { + position: relative; + z-index: auto; + height: 100% +} + + + +@keyframes spin_f8ae9c { + 0% { + transform: rotate(0) + } + + to { + transform: rotate(360deg) + } +} + + + + + + + + +.heading-md-semibold__76ba1 { + font-family: var(--font-display); + font-size: 16px; + line-height: 1.25; + font-weight: 600 +} + +.heading-lg-semibold__58a54 { + font-family: var(--font-display); + font-size: 20px; + line-height: 1.2; + font-weight: 600 +} + +.heading-xxl-extrabold__3d05f { + font-family: var(--font-display); + font-size: 32px; + line-height: 1.25; + font-weight: 800 +} + +.eyebrow_dc00ef { + font-family: var(--font-display); + font-size: 12px; + line-height: 1.3333333333333333; + font-weight: 700; + text-transform: uppercase; + letter-spacing: .02em +} + +.text-xs-normal__46d75 { + font-family: var(--font-primary); + font-size: 12px; + line-height: 1.3333333333333333; + font-weight: 400 +} + +.text-xs-medium_d3e0f1 { + font-family: var(--font-primary); + font-size: 12px; + line-height: 1.3333333333333333; + font-weight: 500 +} + +.text-sm-normal__95a78 { + font-family: var(--font-primary); + font-size: 14px; + line-height: 1.2857142857142858; + font-weight: 400 +} + +.text-md-normal__6e567 { + font-family: var(--font-primary); + font-size: 16px; + line-height: 1.25; + font-weight: 400 +} + +.text-md-semibold__8664f { + font-family: var(--font-primary); + font-size: 16px; + line-height: 1.25; + font-weight: 600 +} + + + +.app_a01fb1 { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + background-color: var(--background-tertiary); + display: flex; + flex-direction: column +} + +.app_a01fb1 button { + cursor: pointer +} + +.layers_a01fb1 { + display: flex; + flex-direction: column; + flex: 1 1 auto; + overflow: hidden; + min-width: 0; + min-height: 0 +} + + + + + + +@use postcss-pxtorem; + +@keyframes placeholderPulse_b9f1a6 { + 0% { + opacity: .5 + } + + 50% { + opacity: 1 + } + + to { + opacity: .5 + } +} + +.container_cbd271 { + display: flex; + flex-direction: column; + background: var(--bg-overlay-chat,var(--background-secondary)); + height: 100% +} + +.membersWrap_cbd271 { + min-width: 240px; + display: flex; + position: relative; + max-height: 100% +} + +.members_cbd271 { + width: 240px; + padding: 0 0 20px; + flex: 0 0 auto; + height: auto; + background: var(--bg-overlay-chat,var(--background-secondary)) +} + +.member_cbd271 { + background: var(--bg-overlay-chat,var(--background-secondary)) +} + +.membersGroup_cbd271 { + padding: 24px 8px 0 16px; + height: 40px +} + +.hiddenMembers_cbd271 { + justify-content: center +} + +@media(max-width: 485px) { + .membersWrap_cbd271 { + position:relative; + min-width: 100%; + display: flex; + height: 100% + } + + .members_cbd271 { + min-width: 100% + } +} + +@keyframes pulse-animation__1d99b { + 70% { + box-shadow: 0 0 0 20px hsl(var(--green-360-hsl)/0) + } + + to { + box-shadow: 0 0 0 0 hsl(var(--green-360-hsl)/0) + } +} + +@keyframes slide_f14ade { + to { + right: -800px + } +} + +@keyframes Shine__8e34a { + 0% { + transform: translate3d(-75%,0,0) + } + + to { + transform: translate3d(200%,0,0) + } +} + + +@keyframes completeLeft_b1717f { + 0% { + transform: translatex(-50%) + } + + 10% { + transform: translatex(10%)rotate(-8deg) + } + + 34% { + transform: translatex(30%) + } + + 42% { + transform: translatex(30%) + } + + 60% { + transform: rotate(-15deg) + } + + 90% { + transform: rotate(-15deg); + opacity: 1 + } + + to { + transform: rotate(-15deg); + opacity: 0 + } +} + +@keyframes completeRight_b1717f { + 0% { + transform: translatex(50%) + } + + 10% { + transform: translatex(10%)rotate(8deg) + } + + 34% { + transform: translatex(-30%) + } + + 42% { + transform: translatex(-30%) + } + + 60% { + transform: rotate(15deg) + } + + 90% { + transform: rotate(15deg); + opacity: 1 + } + + to { + transform: rotate(15deg); + opacity: 0 + } +} + +@keyframes wave__67cd3 { + 0% { + transform: rotate(-45deg) + } + + 50% { + transform: rotate(45deg) + } + + to { + transform: rotate(-45deg) + } +} + +@keyframes outgoing-call-pulse__6709d { + 0% { + opacity: 0; + transform: scalex(1) + } + + 11.56% { + opacity: 1 + } + + 39.02% { + opacity: 0; + transform: scale3d(1.025,1.025,1) + } + + 39.03% { + transform: scalex(1) + } + + 39.04% { + opacity: 1 + } + + 66.48% { + opacity: 0; + transform: scale3d(1.025,1.025,1) + } + + to { + opacity: 0; + transform: scalex(1) + } +} + +@keyframes floating-animation-1_effc3c { + 0% { + opacity: .6; + bottom: 0; + transform: scale(1); + left: 0 + } + + 33% { + opacity: .8; + transform: scale(1.75); + bottom: 100px; + left: -10px + } + + 66% { + opacity: .8; + transform: scale(1.75); + bottom: 200px; + left: -20px + } + + to { + opacity: 0; + transform: scale(1.25); + bottom: 300px; + left: -20px + } +} + +@keyframes floating-animation-2_cdecd8 { + 0% { + opacity: 0; + bottom: 25px; + transform: scale(1.4); + left: 0 + } + + 25% { + opacity: .6; + transform: scale(2); + bottom: 100px; + left: 15px + } + + 50% { + opacity: .8; + transform: scale(1.75); + bottom: 175px; + left: 10px + } + + 75% { + opacity: .8; + transform: scale(1.5); + bottom: 250px; + left: 15px + } + + to { + opacity: 0; + transform: scale(1); + bottom: 325px; + left: 20px + } +} + +@keyframes floating-animation-3__6bf51 { + 0% { + opacity: 0; + bottom: -20px; + transform: scale(1); + left: 0 + } + + 33% { + opacity: .8; + transform: scale(1.6); + bottom: 80px; + left: 5px + } + + 66% { + opacity: .8; + transform: scale(1.3); + bottom: 190px; + left: 10px + } + + to { + opacity: 0; + transform: scale(1); + bottom: 290px; + left: 15px + } +} + +@keyframes floating-animation-4__22580 { + 0% { + opacity: .4; + bottom: 60px; + transform: scale(1); + left: 0 + } + + 33% { + opacity: .8; + transform: scale(1.75); + bottom: 160px; + left: -5px + } + + 66% { + opacity: .8; + transform: scale(1.25); + bottom: 260px; + left: -10px + } + + to { + opacity: 0; + transform: scale(1); + bottom: 360px; + left: -15px + } +} + + +@use postcss-pxtorem;.attachWrapper_f298d4 { + position: sticky; + flex: 0 0 auto; + align-self: stretch +} + +.attachButton_f298d4 { + height: 44px; + padding: 10px 16px; + position: sticky; + top: 0 +} + +.attachButtonInner_f298d4 { + height: 24px +} + +.attachButtonPlus_f298d4 { + transform-origin: 50%50%; + width: 24px; + height: 24px +} + +.attachButtonPlus_f298d4 { + fill: var(--interactive-normal) +} + +.attachButton_f298d4:hover .attachButtonPlus_f298d4 { + fill: var(--interactive-hover) +} + +.uploadInput_f298d4 { + position: relative; + width: 0; + height: 0; + pointer-events: none +} + +@keyframes loading_cbbca4 { + 0% { + transform: translate3d(calc(-1*var(--custom-responsive-embed-tile-loading-background-width)),0,0) + } + + 50% { + transform: translatez(0) + } + + to { + transform: translate3d(calc(-1*var(--custom-responsive-embed-tile-loading-background-width)),0,0) + } +} + + + +.barBase_cf58b5 { + position: absolute; + left: 16px; + right: 16px; + display: flex; + align-items: center; + z-index: 2; + min-height: 24px; + text-transform: capitalize; + transition: opacity.15s; + opacity: .95; + cursor: pointer +} + +.barBase_cf58b5:hover { + opacity: 1 +} + +.barButtonBase_cf58b5 { + text-align: left; + background: none; + color: var(--white-500); + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + font-weight: 500; + padding: 0 12px; + font-size: 14px; + line-height: 24px; + height: 24px; + display: flex; + align-items: center; + justify-content: flex-start +} + +.barButtonIcon_cf58b5 { + display: block; + position: relative; + top: -1px; + width: 16px; + height: 16px; + margin-left: 8px +} + +.newMessagesBar_cf58b5 { + height: 32px; + top: 0; + border-radius: 0 0 8px 8px; + background-color: var(--brand-experiment); + box-shadow: var(--elevation-low) +} + +.newMessagesBar_cf58b5:active { + padding-top: 1px; + box-shadow: 0 0 0 hsl(var(--black-500-hsl)/0) +} + +.barButtonMain_cf58b5 { + flex: 1 1 auto; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + display: block; + position: relative +} + +.span_cf58b5 { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +.barButtonAlt_cf58b5 { + flex: 0 0 auto; + font-weight: 600; + position: relative +} + +.imageContent_cf58b5 { + display: flex; + flex-flow: column nowrap; + flex: auto +} + +.imageContainer_cf58b5 { + display: flex; + flex-flow: row nowrap; + flex: auto; + width: 100%; + height: 100% +} + +@keyframes popout-loading_e71bb3 { + 0% { + transform: translate3d(calc(-1*var(--custom-message-helpers-popout-content-width)),0,0) + } + + 50% { + transform: translatez(0) + } + + to { + transform: translate3d(calc(-1*var(--custom-message-helpers-popout-content-width)),0,0) + } +} + +.hljs { + display: block; + overflow-x: auto; + padding: .5em; + border-radius: 4px; + -webkit-text-size-adjust: none; + text-size-adjust: none; + color: var(--text-normal); + background: var(--background-secondary) +} + +.theme-dark .hljs-keyword { + color: #ff7b72 +} + +.theme-dark .hljs-title,.theme-dark .hljs-title.function_ { + color: #d2a8ff +} + +.theme-dark .hljs-literal { + color: #79c0ff +} + +.theme-dark .hljs-comment { + color: #8b949e +} + +@keyframes uploadIconAnimateInLeft_f82cc7 { + 0% { + transform: translatez(0)rotate(0); + opacity: .6 + } + + 4.1667% { + transform: translate3d(0,-1px,0)rotate(0); + opacity: .68 + } + + 30.8334% { + transform: translate3d(-48px,-10px,0)rotate(-36deg); + opacity: 1 + } + + 58.3334% { + transform: translate3d(-41px,-3px,0)rotate(-28deg); + opacity: 1 + } + + 75% { + transform: translate3d(-45px,-8px,0)rotate(-32deg); + opacity: 1 + } + + 83.3334% { + transform: translate3d(-44px,-7px,0)rotate(-30.7deg); + opacity: 1 + } + + to { + transform: translate3d(-44px,-6px,0)rotate(-30deg); + opacity: 1 + } +} + +@keyframes uploadIconAnimateInMiddle_f82cc7 { + 0% { + transform: translatez(0) + } + + 30.8334% { + transform: translate3d(0,-10px,0) + } + + 58.3334% { + transform: translate3d(0,-3px,0) + } + + 75% { + transform: translate3d(0,-8px,0) + } + + 83.3334% { + transform: translate3d(0,-7px,0) + } + + to { + transform: translate3d(0,-6px,0) + } +} + +@keyframes uploadIconAnimateInRight_f82cc7 { + 0% { + transform: translatez(0)rotate(0); + opacity: .6 + } + + 4.1667% { + transform: translate3d(0,-1px,0)rotate(0); + opacity: .68 + } + + 30.8334% { + transform: translate3d(48px,-10px,0)rotate(36deg); + opacity: 1 + } + + 58.3334% { + transform: translate3d(41px,-3px,0)rotate(28deg); + opacity: 1 + } + + 75% { + transform: translate3d(45px,-8px,0)rotate(32deg); + opacity: 1 + } + + 83.3334% { + transform: translate3d(44px,-7px,0)rotate(30.7deg); + opacity: 1 + } + + to { + transform: translate3d(44px,-6px,0)rotate(30deg); + opacity: 1 + } +} + +@keyframes uploadModalShake_f82cc7 { + 10%,90% { + transform: translate3d(-1px,0,0) + } + + 20%,80% { + transform: translate3d(2px,0,0) + } + + 30%,50%,70% { + transform: translate3d(-4px,0,0) + } + + 40%,60% { + transform: translate3d(4px,0,0) + } +} + +@keyframes uploadTextFadeIn_f82cc7 { + 0%,8.334% { + transform: translate3d(0,-4px,0); + opacity: 0 + } + + 45.8%,to { + transform: translatez(0); + opacity: 1 + } +} + +@keyframes uploadModalBounceTransition_f82cc7 { + 0% { + transform: translatez(0)scale(.99,.99) + } + + 50% { + transform: translatez(0)scale(1.005,1.005) + } + + to { + transform: translatez(0)scale(1) + } +} + +@keyframes uploadModalBounce_f82cc7 { + 0% { + transform: translatez(0)scale(.99,.99) + } + + 15%,to { + top: -10px; + left: -10px; + right: -10px; + bottom: -10px + } + + 33.3334% { + transform: translatez(0)scale(1.005,1.005) + } + + 54.1667% { + transform: translatez(0)scale(.995,.995) + } + + 70.8334%,to { + transform: translatez(0)scale(1) + } +} + +.uploadArea_f82cc7 { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + visibility: hidden; + background: hsl(var(--black-500-hsl)/.8); + font-size: 36px; + color: var(--white-500); + display: flex; + align-items: center; + justify-content: center; + opacity: 0; + z-index: 2000 +} + +.uploadArea_f82cc7 strong { + font-weight: 700 +} + +.uploadArea_f82cc7 * { + pointer-events: none +} + +.uploadDropModal_f82cc7 { + animation: uploadIconAnimateIn_f82cc7.25s ease-in-out 0s forwards normal; + width: 310px; + height: 170px; + display: flex; + position: relative +} + +.uploadDropModal_f82cc7 .title_f82cc7,.uploadDropModal_f82cc7 .instructions_f82cc7 { + opacity: 0; + animation: uploadTextFadeIn_f82cc7 1s ease.175s forwards normal +} + +.uploadDropModal_f82cc7 .instructions_f82cc7 { + animation-delay: .185s; + animation-duration: 1.25s +} + +.uploadDropModal_f82cc7 .bgScale_f82cc7 { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: -1; + border-radius: 10px; + background: var(--brand-experiment); + animation: uploadModalBounce_f82cc7.8s ease 0s forwards normal +} + +.uploadDropModal_f82cc7 .inner_f82cc7 { + flex: 1; + color: var(--white-500); + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + border: 2px dashed hsl(var(--white-500-hsl)/.4); + border-radius: 6px; + width: 100% +} + +.uploadDropModal_f82cc7 .inner_f82cc7 .title_f82cc7 { + font-size: 22px; + font-weight: 700; + padding: 0 8px; + width: 100%; + color: var(--white-500); + text-align: center; + box-sizing: border-box +} + +.uploadDropModal_f82cc7 .inner_f82cc7 .title_f82cc7 strong { + color: var(--white-500) +} + +.uploadDropModal_f82cc7 .inner_f82cc7 .instructions_f82cc7 { + text-align: center; + font-size: 12px; + line-height: 16px; + margin-top: 4px; + margin-left: 4px; + color: var(--white-500) +} + +.icons_f82cc7 { + position: relative; + width: 100px; + height: 60px +} + +.icon_f82cc7 { + flex-shrink: 0; + width: 100px; + height: 130px; + background-repeat: no-repeat; + background-position: center; + transform: translatez(0) +} + +.icon_f82cc7.one_f82cc7 { + opacity: 0; + animation: uploadIconAnimateInLeft_f82cc7.8s ease 0s forwards normal; + position: absolute +} + +.icon_f82cc7.two_f82cc7 { + filter: drop-shadow(0 0 48px rgba(88,101,242,.5)); + animation: uploadIconAnimateInMiddle_f82cc7.8s ease 0s forwards normal; + position: absolute +} + +.icon_f82cc7.three_f82cc7 { + opacity: 0; + animation: uploadIconAnimateInRight_f82cc7.8s ease 0s forwards normal; + position: absolute +} + +.wrapOne_f82cc7 { + transform: translate3d(0,-70px,0) +} + +.wrapTwo_f82cc7 { + transform: translate3d(0,-80px,0) +} + +.wrapThree_f82cc7 { + transform: translate3d(0,-70px,0) +} + +.document_f82cc7 { + background-image: url(/assets/6ce078beae8ec47e8849.svg) +} + +.image_f82cc7 { + background-image: url(/assets/b72ca55b9c58b903a23d.svg) +} + +.code_f82cc7 { + background-image: url(/assets/4d245830fb62000c910e.svg) +} + +@keyframes zoomInFromBottomRight_d27025 { + 0% { + transform: translatex(80%)translatey(80%)scalex(20%)scaley(20%); + opacity: 0 + } + + to { + transform: translatex(0)translatey(0)scalex(100%)scaley(100%); + opacity: 1 + } +} + +@keyframes shine__83b63 { + 0% { + left: -12% + } + + 20% { + left: 110% + } + + to { + left: 110% + } +} + +.member_a31c43 { + position: relative; + max-width: 224px; + margin-left: 8px +} + +.memberInner_a31c43 { + padding-top: calc(.5*var(--custom-member-list-item-avatar-decoration-padding)); + padding-bottom: calc(.5*var(--custom-member-list-item-avatar-decoration-padding)) +} + +.offline_a31c43 { + opacity: .3 +} + +.offline_a31c43:hover { + opacity: 1 +} + +.username_a31c43 { + display: flex; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +.name_a31c43 { + flex: 1 1 auto; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +.banner_c3e427 { + transition: background-color.1s; + width: 100% +} + +.popoutBanner_c3e427 { + height: var(--custom-user-banner-banner-height-popout) +} + +.userProfileOuter_c69a7b { + border-radius: var(--radius-sm); + position: relative; + overflow: hidden; + --custom-user-popout-outside-components-height: 1px +} + +.userPopoutOuter_c69a7b { + box-shadow: var(--elevation-high); + max-height: calc(100vh - 20px - var(--custom-user-popout-outside-components-height)); + width: var(--custom-user-profile-themed-container-user-popout-width) +} + +.userProfileOuterUnthemed_c69a7b { + background-color: var(--profile-gradient-primary-color) +} + +.userProfileInner_c69a7b { + display: flex; + flex-direction: column; + flex-grow: 1; + border-radius: var(--radius-sm)var(--radius-sm)0 0 +} + +.userProfileInner_c69a7b:before { + content: ""; + pointer-events: none; + background-color: var(--profile-gradient-overlay-color); + position: absolute +} + +.userPopoutInner_c69a7b { + max-height: calc(100vh - 28px - var(--custom-user-popout-outside-components-height)) +} + +.userPopoutInner_c69a7b:before { + border-radius: var(--radius-xs); + height: calc(100% - 8px); + width: calc(100% - 8px) +} + +.userProfileInnerThemedNonPremium_c69a7b { + background: linear-gradient(var(--profile-gradient-primary-color),var(--profile-gradient-primary-color)var(--custom-user-banner-banner-height-popout),var(--profile-gradient-secondary-color)) +} + +.overlayBackground_c69a7b { + position: relative; + background-color: var(--profile-body-background-color); + border-radius: var(--radius-sm); + display: flex; + flex-direction: column; + overflow: hidden +} + +.overlayBackground_c69a7b ::-webkit-scrollbar-thumb { + background-color: var(--profile-body-divider-color) +} + +.userPopoutOverlayBackground_c69a7b { + margin: 28px 16px 16px; + max-height: calc(100vh - 128px - var(--custom-user-popout-outside-components-height)) +} + +.info_e86508 { + display: flex; + flex-direction: row; + justify-content: flex-start; + overflow: hidden; + align-items: center; + white-space: nowrap +} + +.avatars_ccc074 { + display: flex; + flex-grow: 0; + align-items: center; + position: relative +} + +.avatar_ccc074 { + margin-left: -2px; + -webkit-mask: url(/assets/63be946dd46f9da58f29.svg); + mask: url(/assets/63be946dd46f9da58f29.svg); + -webkit-mask-size: 100%; + mask-size: 100%; + mask-type: alpha +} + +.avatar_ccc074:first-child { + margin-left: 0 +} + +.avatar_ccc074:last-child { + -webkit-mask: none; + mask: none +} + +.mainContainer_f005b2 { + display: flex; + flex-direction: column; + align-items: flex-start; + justify-content: flex-start; + gap: 4px +} + +.compactItemContainer_f005b2 { + display: flex; + flex-direction: row; + align-items: center; + vertical-align: middle; + gap: 8px; + overflow: hidden; + flex-wrap: wrap; + max-width: 100%; + height: 19px +} + +.avatarAndTextContainer_f005b2 { + display: flex; + flex-direction: row; + align-items: center; + justify-content: flex-start; + gap: 4px; + overflow: hidden; + white-space: wrap; + cursor: pointer +} + +.serverContainer_f005b2 { + flex: 1 +} + +.itemizedListText_f005b2 { + overflow: hidden; + text-overflow: ellipsis; + white-space: wrap +} + +.itemizedListText_f005b2 strong { + color: var(--interactive-active) +} + +@keyframes placeholderPulse__1352d { + 0% { + opacity: .3 + } + + 50% { + opacity: 1 + } + + to { + opacity: .3 + } +} + +.section_d7a21f { + padding-top: 12px +} + +.section_d7a21f:empty { + display: none +} + +.lastSection_d7a21f { + padding-bottom: 12px +} + + +.divider_ae36e5 { + margin-top: 12px; + height: 1px; + position: sticky; + top: 0; + background-color: var(--profile-body-divider-color) +} + +@use postcss-pxtorem; + + +@keyframes Shine__245a1 { + 0% { + transform: translate3d(-100%,0,0) + } + + to { + transform: translate3d(200%,0,0) + } +} + +.iconLayout_effbe2 { + box-sizing: border-box; + display: flex; + justify-content: center; + align-items: center; + width: 22px; + height: 22px; + cursor: text +} + +.iconContainer_effbe2 { + box-sizing: border-box; + position: relative; + width: 16px; + height: 16px +} + +.icon_effbe2 { + box-sizing: border-box; + position: absolute; + top: 0; + left: 0; + opacity: 0; + width: 100%; + height: 100%; + z-index: 2; + transition: transform.1s ease-out,opacity.1s ease-out; + transform: rotate(90deg); + color: var(--text-muted) +} + +.icon_effbe2.visible_effbe2 { + transform: rotate(0); + opacity: 1 +} + + +@keyframes ripple__0832e { + 0% { + transform: scale(.8); + opacity: 1 + } + + to { + transform: scale(1.6); + opacity: 0 + } +} + +@keyframes ripple__58c0d { + 0% { + transform: scale(.4); + opacity: 1 + } + + 90% { + transform: scale(1.4); + opacity: 0 + } + + to { + transform: scale(1.6); + opacity: 0 + } +} + +@keyframes bounce_f63dbc { + 25% { + transform: scale(.6) + } + + 50% { + transform: scale(1.2) + } + + to { + transform: scale(1) + } +} + +@keyframes loadIN_aaf88b { + 0% { + transform: translate3d(0,24px,0); + opacity: 0 + } + + to { + transform: translatez(0); + opacity: 1 + } +} + +.container_ccd3df { + bottom: 100%; + margin-bottom: 12px; + min-height: 16px; + position: absolute; + transition: opacity.125s ease-in,transform.125s cubic-bezier(.48,1.93,1,.68); + opacity: 1; + will-change: opacity,transform; + left: auto; + right: 4px +} + +.container_ccd3df.hidden_ccd3df { + transform: translatey(12px); + opacity: 0; + pointer-events: none +} + +.stickerIconOffset_ccd3df { + right: 40px +} + +.containerBackground_ccd3df { + background-color: var(--background-floating); + border: 1px solid var(--background-modifier-selected); + border-radius: 8px; + bottom: 0; + box-shadow: var(--elevation-high); + left: 0; + min-height: 16px; + opacity: .95; + position: absolute; + right: 0; + top: 0; + z-index: 0 +} + +.containerBackground_ccd3df:after { + border: 7px solid transparent; + border-top-color: var(--background-floating); + border-top-width: 7px; + content: ""; + height: 0; + margin-top: -1px; + position: absolute; + right: 14px; + top: 100%; + width: 0 +} + +.bottomInformationTextContainer_ccd3df { + z-index: 1; + position: relative; + padding: 0 8px 10px; + height: 24px +} + +.bottomInformationLayout_ccd3df { + display: flex; + flex-direction: row; + justify-content: space-between +} + +.textDivider_ccd3df { + height: 1px; + margin: 0 0 4px; + background-color: var(--background-modifier-accent) +} + +.descriptionText_ccd3df { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden +} + +.stickerResults_ccd3df { + display: grid; + grid-gap: var(--custom-expression-suggestions-sticker-suggestion-margin); + grid-auto-flow: column; + grid-template-columns: repeat(auto-fit,var(--custom-expression-suggestions-sticker-suggestion-size)); + padding: var(--custom-expression-suggestions-container-padding); + position: relative; + z-index: 1 +} + +.keybind_ccd3df { + display: inline-block +} + +.closeIcon_ccd3df { + color: var(--text-muted); + cursor: pointer +} + +.closeIcon_ccd3df:hover { + color: var(--interactive-hover) +} + +.theme-dark .keybind_ccd3df span { + box-shadow: inset 0 -4px 0 rgba(32,34,37,.6) +} + +.theme-dark .containerBackground_ccd3df { + opacity: .95 +} + +.editor_a552a6 { + white-space: break-spaces!important; + caret-color: var(--text-normal); + text-align: left; + word-break: break-word +} + +.editor_a552a6 pre { + max-width: none +} + +.placeholder_a552a6 { + position: absolute; + left: 0; + right: 0; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + color: var(--channel-text-area-placeholder); + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + pointer-events: none +} + +.slateContainer_e52116 { + position: relative +} + +.slateTextArea_e52116 { + padding-right: 10px; + position: absolute; + left: 0; + right: 10px +} + +@use postcss-pxtorem;.channelTextArea_d0696b { + position: relative; + width: 100%; + text-indent: 0; + border-radius: 8px +} + +.scrollableContainer_d0696b { + overflow-x: hidden; + overflow-y: scroll; + max-height: 50vh; + border-radius: 8px; + backface-visibility: hidden +} + +.themedBackground_d0696b { + background: var(--bg-overlay-3,var(--channeltextarea-background)) +} + +.scrollableContainer_d0696b::-webkit-scrollbar { + width: 12px; + height: 12px +} + +.scrollableContainer_d0696b::-webkit-scrollbar-thumb,.scrollableContainer_d0696b::-webkit-scrollbar-track { + border-width: 4px; + background-clip: padding-box; + border-style: solid; + border-color: transparent +} + +.scrollableContainer_d0696b::-webkit-scrollbar-track { + border-width: medium; + border-width: initial +} + +.scrollableContainer_d0696b::-webkit-scrollbar-thumb { + background-color: hsl(var(--primary-800-hsl)/.6); + border-radius: 8px +} + +.inner_d0696b { + display: flex; + position: relative +} + +.sansAttachButton_d0696b { + padding-left: 16px +} + +.attachButton_d0696b { + margin-left: -16px +} + +.textArea_d0696b { + background-color: transparent; + resize: none; + border: none; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + box-sizing: border-box; + font-weight: 400; + font-size: 1rem; + line-height: 1.375rem; + width: 100%; + height: var(--custom-channel-textarea-text-area-height); + min-height: var(--custom-channel-textarea-text-area-height); + color: var(--text-normal); + padding-left: 0; + padding-right: 10px +} + +.textArea_d0696b::-moz-placeholder { + -moz-user-select: none; + user-select: none; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + color: var(--text-muted) +} + +.textArea_d0696b::placeholder { + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + color: var(--text-muted) +} + +.textAreaSlate_d0696b { + padding: 0 +} + +.buttons_d0696b { + display: flex; + flex-direction: row; + height: var(--custom-channel-textarea-text-area-height); + position: sticky; + top: 0; + margin-right: 6px +} + +.has-webkit-scrollbar .buttons_d0696b { + margin-right: -6px +} + +.buttonContainer_d0696b { + display: flex; + align-items: center +} + +.button_d0696b { + padding: 4px; + margin-left: 4px; + margin-right: 4px +} + +.stickerButton_d0696b { + transition: transform.2s +} + +.fontSize16Padding_d0696b { + padding-bottom: 11px; + padding-top: 11px +} + +.title_c4a579 { + display: flex; + font-weight: 700; + margin-bottom: 6px +} + +.body__07791 { + font-size: 14px; + line-height: 18px +} + +.buttonsContainer_b709ea { + display: flex; + flex-wrap: wrap; + gap: 6px +} + +.input_df4dd0 { + font-size: 14px; + background-color: var(--background-secondary-alt) +} + +.section_f2c0a8 { + position: relative +} + +.messageInputContainer_f2c0a8 { + border: 1px solid var(--profile-message-input-border-color); + border-radius: var(--radius-xs) +} + +.messageInput_f2c0a8 { + background-color: transparent +} + +.memberSinceWrapper__03059 { + display: flex; + align-items: center; + gap: 8px +} + +.memberSince__2eba7 { + display: flex; + align-items: center; + gap: 4px +} + +.discordIcon__1e1be { + height: 16px; + width: 16px; + color: var(--interactive-normal) +} + +.divider__979dc { + height: 4px; + width: 4px; + border-radius: 50%; + background-color: var(--interactive-normal) +} + +.textarea_dde0a8 { + background-color: transparent; + border: none; + box-sizing: border-box; + color: var(--text-normal); + font-size: 12px; + line-height: 14px; + max-height: 88px; + padding: 4px; + resize: none; + width: 100% +} + +.textarea_dde0a8::-moz-placeholder { + color: var(--header-secondary) +} + +.textarea_dde0a8::placeholder { + color: var(--header-secondary) +} + +.textarea_dde0a8:focus { + background-color: var(--background-tertiary) +} + +.note_c90ad7 textarea:focus { + background-color: var(--profile-note-background-color) +} + +.note_c90ad7 textarea:focus::-moz-placeholder { + color: transparent +} + +.note_c90ad7 textarea:focus::placeholder { + color: transparent +} + +.root_e4010c { + position: relative; + flex-wrap: wrap; + display: flex; + margin-top: 2px +} + +.role_f9575e { + align-items: center; + display: flex; + font-size: 12px; + font-weight: 500; + background: var(--background-secondary-alt); + border-radius: 4px; + box-sizing: border-box; + height: 22px; + margin: 0 4px 4px 0; + padding: 4px +} + +.roleRemoveButton_f9575e { + position: relative +} + +.roleRemoveIcon_e4010c { + display: none; + width: 10px; + height: 10px; + position: absolute; + top: 50%; + left: 50%; + margin: -5px 0 0 -5px +} + +.role_f9575e:hover .roleRemoveIcon_e4010c,.role_f9575e:focus .roleRemoveIcon_e4010c { + display: block +} + +.roleName_e4010c { + max-width: 200px; + margin-right: 4px; + overflow: hidden +} + +.roleNameOverflow_e4010c { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden +} + +.actionButton_e4010c { + justify-content: center; + color: var(--interactive-active); + font-size: 11px; + line-height: 11px +} + +.addButton_e4010c { + padding: 4px 5px +} + +.addButtonIcon_e4010c { + cursor: pointer; + width: 14px; + height: 14px +} + +.roles_fa2f72 { + color: var(--text-normal) +} + +.rolePill_fa2f72 { + background-color: var(--profile-role-pill-background-color) +} + +.container_c9ccf6 { + display: flex; + justify-content: space-between; + flex-direction: column +} + +.userText_c9ccf6 { + -webkit-user-select: text; + -moz-user-select: text; + user-select: text +} + +.nickname_c9ccf6 { + word-break: break-word +} + +.userTag_c9ccf6 { + font-size: 14px; + font-weight: 500; + display: block; + font-family: var(--font-display) +} + +.userTagWithNickname_c9ccf6 { + font-family: var(--font-primary); + line-height: 18px +} + +.userTagUsernameBase_c9ccf6 { + overflow: auto; + word-break: break-all; + text-overflow: clip; + white-space: normal; + color: var(--header-primary); + vertical-align: top; + display: inline +} + +.usernameSection_d2b491 { + padding-top: 12px; + padding-right: 12px; + padding-left: 12px +} + +.profileMutuals_d2b491 { + padding-top: 12px; + flex: 1 +} + +.divider_d2b491 { + margin: 12px 12px 0 +} + +.scroller_d2b491 { + flex: 0 1 auto; + min-height: 0; + padding: 0 12px +} + +.scroller_d2b491::-webkit-scrollbar-track { + margin-bottom: 4px +} + +@keyframes slideInFromBottom_c16bcb { + 0% { + transform: translatey(90px); + opacity: .8 + } + + to { + transform: translatey(0%); + opacity: 1 + } +} + +@keyframes slideInFromTop__7193a { + 0% { + transform: translatey(-90px) + } + + to { + transform: translatey(0%) + } +} + +.bannerSVGWrapper_b32cc2 { + z-index: 0; + contain: paint +} + +.container_b64375 { + display: flex; + flex-wrap: wrap; + justify-content: flex-end; + align-items: center; + gap: 2px; + min-height: 22px +} + +.containerWithContent_b64375 { + padding: 4px +} + +.profileBadge_b64375 { + filter: saturate(1); + filter: saturate(var(--saturation-factor,1)); + display: block; + background-repeat: no-repeat; + background-size: contain; + background-position: center; + overflow: hidden; + pointer-events: none; + -o-object-fit: cover; + object-fit: cover +} + +.profileBadge_b64375:active { + opacity: .8 +} + +.profileBadge_b64375:before { + content: ""; + display: block; + width: 100%; + height: 100%; + background-color: var(--background-modifier-accent); + border-radius: 50% +} + +.profileBadge22_b64375 { + width: 22px; + height: 22px +} + +.profileBadges_f89da9 { + position: relative; + top: 12px; + right: 16px; + width: -moz-fit-content; + width: fit-content; + align-self: flex-end; + background-color: var(--profile-body-background-color); + border-radius: 8px; + max-width: 190px +} + +.profileBadges_f89da9.profileBadges_f89da9 { + box-sizing: content-box +} + +.avatarHint_f89da9 { + position: absolute; + opacity: 0; + transition: opacity.1s ease; + pointer-events: none; + top: 0; + left: 0 +} + +.avatarHintInner_f89da9 { + box-sizing: border-box; + font-size: 10px; + line-height: 12px; + font-weight: 700; + width: 100%; + padding-top: 4px; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + text-transform: uppercase; + box-shadow: inset 0 0 120px hsl(var(--black-500-hsl)/.75); + color: var(--white-500) +} + +.avatarWrapper_f89da9 { + border-radius: 50%; + position: absolute; + z-index: 0; + top: 80px; + left: 22px +} + +.avatarWrapperNormal_f89da9:hover .avatarHint_f89da9 { + opacity: 1 +} + +.clickable_f89da9 { + cursor: pointer +} + +.avatarPositionNormal_f89da9 { + top: 16px +} + +.avatarHoverTarget_f89da9 { + border-radius: 50% +} + + + + +.infoTitle_bf4cdc { + display: flex; + align-items: center; + overflow: hidden +} + +.infoBadge_bf4cdc { + margin-left: 4px +} + +.headerLine_bf4cdc { + display: flex; + flex: 1000 0 auto; + align-items: center; + max-width: 100%; + gap: 16px +} + +@use postcss-pxtorem;.spine_c15230 { + border-bottom-left-radius: 8px; + border-bottom: 2px solid var(--background-accent); + border-left: 2px solid var(--background-accent); + bottom: 29px; + position: absolute; + top: 0; + left: -2.5rem; + width: 2.25rem +} + +.spine_c15230.systemMessageSpine_c15230 { + bottom: 32px; + left: -2rem; + width: 1.75rem +} + +.spine_c15230.cozy_c15230 { + display: none +} + +.container_c15230 { + background-color: var(--background-secondary); + border-radius: 4px; + cursor: pointer; + margin-top: 8px; + max-width: 480px; + min-width: 0; + padding: 8px +} + +.systemMessageContainer_c15230 { + margin-top: 0 +} + +.topLine_c15230 { + display: flex +} + +.name_c15230 { + color: var(--header-primary); + font-size: .875rem; + font-weight: 600; + line-height: 1.125rem; + margin-right: 8px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap +} + +.cta_c15230 { + color: var(--text-link); + flex-shrink: 0; + font-size: .875rem; + font-weight: 600; + line-height: 1.125rem +} + +.container_c15230:hover .cta_c15230 { + -webkit-text-decoration: underline; + text-decoration: underline +} + +.bottomLine_c15230 { + align-items: center; + color: var(--header-secondary); + display: flex; + font-size: .875rem; + line-height: 1.125rem; + margin-top: 2px; + white-space: nowrap +} + +.guildIconV2Container_ed9816 { + margin-right: 8px +} + +@keyframes shake_f61c73 { + 0% { + transform: translate(1px,1px)rotate(0) + } + + 10% { + transform: translate(-1px,-1px)rotate(-1deg) + } + + 20% { + transform: translate(-2px)rotate(1deg) + } + + 30% { + transform: translate(2px,1px)rotate(0) + } + + 40% { + transform: translate(1px,-1px)rotate(1deg) + } + + 50% { + transform: translate(-1px,1px)rotate(-1deg) + } + + 60% { + transform: translate(-2px,1px)rotate(0) + } + + 70% { + transform: translate(2px,1px)rotate(-1deg) + } + + 80% { + transform: translate(-1px,-1px)rotate(1deg) + } + + 90% { + transform: translate(1px,1px)rotate(0) + } + + to { + transform: translate(1px,-1px)rotate(-1deg) + } +} + +.reactions_ec6b19 { + display: flex; + flex: 1 0 auto; + align-items: center; + flex-wrap: wrap; + margin-bottom: -.5rem; + padding-bottom: .25rem +} + +.icon_ec6b19 { + width: 1rem; + height: 1rem +} + +.reactionBtn_ec6b19 { + margin-left: .25rem; + margin-right: .25rem; + margin-bottom: .125rem; + width: 1rem; + height: 1rem; + cursor: pointer; + visibility: hidden; + color: var(--interactive-normal) +} + +.reactionBtn_ec6b19:hover .icon_ec6b19 { + color: var(--interactive-hover) +} + +.reactionBtn_ec6b19:active .icon_ec6b19 { + color: var(--interactive-active) +} + +.reactions_ec6b19:hover .reactionBtn_ec6b19 { + visibility: visible +} + +.reaction_ec6b19 { + border-radius: .5rem; + cursor: pointer; + box-sizing: border-box; + flex-shrink: 0; + margin-right: .25rem; + margin-bottom: .25rem; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + transition: none.1s ease; + transition-property: background-color,border-color; + background: var(--background-secondary); + border: .0625rem solid transparent +} + +.reaction_ec6b19 .emoji { + width: 1rem; + height: 1rem; + margin: .125rem 0; + min-width: auto; + min-height: auto +} + +.reaction_ec6b19:hover { + background-color: var(--background-primary); + border-color: hsl(var(--white-500-hsl)/.2) +} + +.reaction_ec6b19:hover .reactionCount_ec6b19 { + color: var(--interactive-hover) +} + +.reaction_ec6b19:active { + background-color: var(--background-secondary-alt); + border-color: transparent +} + +.reaction_ec6b19:active .reactionCount_ec6b19 { + color: var(--interactive-active) +} + +.reactionInner_ec6b19 { + display: flex; + align-items: center; + padding: .125rem .375rem; + position: relative +} + +.reactionCount_ec6b19 { + font-weight: 600; + margin-left: .375rem; + text-align: center; + color: var(--interactive-normal) +} + +@keyframes shake_ec6b19 { + 0% { + transform: translate(.0625rem,.0625rem)rotate(0) + } + + 10% { + transform: translate(-.0625rem,-.0625rem)rotate(-1deg) + } + + 20% { + transform: translate(-.125rem)rotate(1deg) + } + + 30% { + transform: translate(.125rem,.0625rem)rotate(0) + } + + 40% { + transform: translate(.0625rem,-.0625rem)rotate(1deg) + } + + 50% { + transform: translate(-.0625rem,.0625rem)rotate(-1deg) + } + + 60% { + transform: translate(-.125rem,.0625rem)rotate(0) + } + + 70% { + transform: translate(.125rem,.0625rem)rotate(-1deg) + } + + 80% { + transform: translate(-.0625rem,-.0625rem)rotate(1deg) + } + + 90% { + transform: translate(.0625rem,.0625rem)rotate(0) + } + + to { + transform: translate(.0625rem,-.0625rem)rotate(-1deg) + } +} + +.container_b558d0 { + display: grid; + height: -moz-fit-content; + height: fit-content; + grid-auto-flow: row; + grid-row-gap: .25rem; + grid-template-columns: repeat(auto-fill,minmax(100%,1fr)); + text-indent: 0; + min-height: 0; + min-width: 0; + padding-top: .125rem; + padding-bottom: .125rem; + position: relative +} + +.container_b558d0:empty { + display: none +} + +.container_b558d0>* { + justify-self: start; + align-self: start +} + +@keyframes placeholderPulse_c94767 { + 0% { + opacity: .2 + } + + 50% { + opacity: .5 + } + + to { + opacity: .2 + } +} + +.mentioned_d5deea { + position: relative; + background: var(--background-mentioned) +} + +.mentioned_d5deea:before { + content: ""; + position: absolute; + display: block; + top: 0; + left: 0; + bottom: 0; + pointer-events: none; + width: 2px +} + +.mentioned_d5deea:before { + background: var(--info-warning-foreground) +} + +.messageListItem_d5deea { + outline: none; + position: relative +} + +.message_d5deea { + padding-right: 48px!important +} + +.buttons_d5deea { + opacity: 0; + pointer-events: none +} + +.cozyMessage_d5deea.groupStart_d5deea { + min-height: 2.75rem +} + +.systemMessage_d5deea.groupStart_d5deea { + min-height: 1.375rem +} + +.divider_d5deea { + margin-left: 1rem; + margin-right: .875rem +} + +.theme-dark .mentioned_d5deea .mention.interactive:hover { + -webkit-text-decoration: underline; + text-decoration: underline +} + +.group-spacing-16 .groupStart_d5deea { + margin-top: 1.0625rem +} + +.group-spacing-16 .divider_d5deea { + margin-top: 4px; + margin-bottom: 4px +} + +.group-spacing-16 .divider_d5deea.hasContent_d5deea { + margin-top: 1.5rem; + margin-bottom: .5rem +} + +.icon_a14cf7 { + width: 20px; + height: 20px; + display: block; + -o-object-fit: contain; + object-fit: contain +} + +.container_a3b500 { + position: absolute; + right: 0; + z-index: 1; + top: -25px; + padding: 0 14px 0 32px +} + +.isHeader_a3b500 { + top: -16px +} + +.icon_a3b500 { + width: 20px; + height: 20px; + display: block; + -o-object-fit: contain; + object-fit: contain +} + +.container_c2668b { + display: flex; + flex-direction: column; + flex: 0 0 auto; + justify-content: flex-end; + margin: 16px 16px 0; + margin-bottom: 16px +} + +.header_c2668b { + font-weight: 700; + margin: 8px 0 +} + +.description_c2668b { + color: var(--header-secondary) +} + +.emptyChannelIcon_c2668b { + width: 68px; + height: 68px; + margin-top: 16px; + border-radius: 50%; + background-color: var(--background-accent) +} + +.emptyChannelIconComponent_c2668b { + display: flex; + align-items: center; + justify-content: center +} + +.button_ccfa44 { + color: var(--text-link); + margin-right: 8px; + padding: 6px; + border-radius: 4px +} + +.button_ccfa44:hover { + background-color: var(--background-modifier-hover) +} + +.buttonIcon_ccfa44 { + margin-right: 6px +} + +.members_f1044f { + display: flex; + flex-wrap: wrap; + margin-top: 16px +} + +.avatars_f1044f { + display: flex; + align-items: center; + margin-right: 12px; + margin-bottom: 6px +} + +.role_f1044f { + margin-right: 6px; + margin-bottom: 6px +} + +.role_f1044f.last_f1044f { + margin-right: 12px +} + +.channelSettingButtons_f1044f { + margin-top: 16px +} + +@keyframes completed_f9902b { + 0% { + transform: scale(.8); + background-color: var(--interactive-muted) + } + + 20% { + box-shadow: 0 0 0 0 hsl(var(--green-360-hsl)/.5) + } + + 60% { + transform: scale(1.2); + background-color: var(--green-230) + } + + to { + transform: scale(1); + box-shadow: 0 0 0 8px hsl(var(--green-360-hsl)/0) + } +} + +@use postcss-pxtorem; + +.messagesWrapper_e2e187 { + position: relative; + display: flex; + flex: 1 1 auto; + min-height: 0; + min-width: 0; + z-index: 0 +} + +.scrollerContent_e2e187 { + overflow-anchor: none; + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: stretch; + min-height: 100% +} + +.scroller_e2e187 { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0 +} + +.scroller_e2e187::-webkit-scrollbar-track { + margin-bottom: 8px +} + +.scrollerInner_e2e187 { + min-height: 0; + overflow: hidden +} + +.scrollerInner_e2e187:focus { + outline: none +} + +.scrollerSpacer_e2e187 { + display: block; + height: 30px; + width: 1px; + flex: 0 0 auto; + pointer-events: none +} + +.navigationDescription_e2e187 { + display: none +} + +@keyframes exclaim-loop__5ce1a { + 0% { + top: -10px + } + + 21% { + top: -14px + } + + 46%,51% { + top: -10px + } + + 72% { + top: -14px + } + + to { + top: -10px + } +} + +@keyframes dot-loop__922dd { + 0% { + top: 14px + } + + 19% { + top: 9px + } + + 44%,49% { + top: 14px + } + + 70% { + top: 9px + } + + 95%,to { + top: 14px + } +} + +@keyframes inner-circle-loop_efbea7 { + 0% { + opacity: .1; + transform: scale(1.1,1.1) + } + + 42% { + opacity: .25; + transform: scale(.9,.9) + } + + to { + opacity: .1; + transform: scale(1.1,1.1) + } +} + +@keyframes outer-circle-loop_ad86d8 { + 0% { + opacity: 0; + transform: scale(1.1,1.1) + } + + 51% { + opacity: .2; + transform: scale(.9,.9) + } + + to { + opacity: 0; + transform: scale(1.1,1.1) + } +} + +@keyframes inner-circle-loop-high-priority_efd637 { + 0% { + opacity: .1; + transform: scale(1.1,1.1) + } + + 42% { + opacity: .5; + transform: scale(.9,.9) + } + + to { + opacity: .1; + transform: scale(1.1,1.1) + } +} + +@keyframes outer-circle-loop-high-priority_fff214 { + 0% { + opacity: 0; + transform: scale(1.1,1.1) + } + + 51% { + opacity: .4; + transform: scale(.9,.9) + } + + to { + opacity: 0; + transform: scale(1.1,1.1) + } +} + +@keyframes quick-fade-out__1fd5a { + to { + opacity: 0 + } +} + + +@keyframes fadeIn__0663f { + 0% { + opacity: 0 + } + + to { + opacity: 1 + } +} + +@keyframes fadeOut_de0df3 { + 0% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +.chat_a7d72e { + min-width: 0; + min-height: 0; + display: flex; + flex-direction: column; + position: relative; + overflow: hidden; + background: var(--bg-overlay-chat,var(--background-primary)); + flex: 1 1 auto +} + +.chat_a7d72e .uploadArea_a7d72e { + position: fixed +} + +.form_a7d72e { + position: relative; + flex-shrink: 0; + padding-left: 16px; + padding-right: 16px; + margin-top: -8px +} + +.form_a7d72e:before,.form_a7d72e:after { + content: ""; + position: absolute; + height: .5rem; + width: 1.25rem +} + +.form_a7d72e:before { + top: 0; + left: 0 +} + +.form_a7d72e:after { + top: 0; + right: 0 +} + +.theme-dark .form_a7d72e:before,.theme-dark .form_a7d72e:after { + background: linear-gradient(to bottom,rgba(54,57,63,0)0%,var(--background-primary)100%) +} + +.chatContent_a7d72e { + position: relative; + display: flex; + flex-direction: column; + min-width: 0; + min-height: 0; + flex: 1 1 auto; + background: var(--bg-overlay-chat,var(--background-primary)) +} + +.content_a7d72e { + min-width: 0; + min-height: 0; + flex: 1 1 auto; + display: flex; + flex-direction: row; + justify-content: stretch; + align-items: stretch; + position: relative +} + +.content_a7d72e:before { + content: ""; + position: absolute; + display: block; + top: -1px; + left: 0; + right: 0; + height: 1px; + box-shadow: var(--elevation-low); + z-index: 1; + pointer-events: none +} + +.channelTextArea_a7d72e { + margin-bottom: 24px; + background-color: var(--background-primary) +} + +.title_a7d72e { + position: relative; + flex: 0 0 auto; + z-index: 100 +} + +.subtitleContainer_a7d72e { + display: flex; + flex-direction: column; + position: relative +} + +.recentsIcon_ea0547 { + position: relative +} + +.theme-dark { + --search-popout-option-fade: linear-gradient( 90deg, hsl(var(--primary-800-hsl) / 0) 0%, hsl(var(--primary-800-hsl) / 1) 80% ); + --search-popout-option-fade-hover: linear-gradient(90deg, hsl(var(--primary-600-hsl) / 0) 0%, var(--primary-600) 50%); + --search-popout-option-user-nickname: var(--text-normal); + --search-popout-option-user-username: var(--text-muted); + --search-popout-option-filter-text: var(--primary-400); + --search-popout-option-non-text-color: #caccce; + --search-popout-option-filter-color: #caccce; + --search-popout-option-answer-color: #caccce; + --search-popout-date-picker-border: 1px solid hsl(var(--primary-660-hsl) / 0.3); + --search-popout-date-picker-hint-text: #caccce; + --search-popout-date-picker-hint-value-text: white; + --search-popout-date-picker-hint-value-background: var(--brand-experiment); + --search-popout-date-picker-hint-value-background-hover: var(--brand-experiment-430) +} + +.search_a46bef { + position: relative; + overflow: visible; + z-index: 100; + -webkit-app-region: no-drag +} + +.search_a46bef .DraftEditor-root { + flex: 1; + font-size: 14px; + font-weight: 500; + line-height: 20px; + overflow: hidden; + padding: 2px 0 +} + +.search_a46bef .DraftEditor-root .DraftEditor-editorContainer { + border: none; + overflow: hidden; + border-radius: 2px; + height: 20px +} + +.search_a46bef .DraftEditor-root .public-DraftEditorPlaceholder-root,.search_a46bef .DraftEditor-root .public-DraftEditor-content { + box-sizing: content-box; + padding-bottom: 20px; + padding-left: 2px; + padding-right: 2px +} + +.search_a46bef .DraftEditor-root .public-DraftEditorPlaceholder-root { + color: var(--text-muted); + padding-left: 4px +} + +.search_a46bef .DraftEditor-root .public-DraftEditor-content { + overflow-x: auto; + overflow-y: hidden +} + +.search_a46bef .DraftEditor-root .public-DraftStyleDefault-block { + display: inline-block; + min-width: 1px; + white-space: pre +} + +.search_a46bef .DraftEditor-root .public-DraftStyleDefault-block span { + min-width: 1px +} + +.searchBar_a46bef { + box-sizing: border-box; + display: flex; + align-items: stretch; + height: 24px; + width: 144px; + border-radius: 4px; + box-shadow: none; + cursor: text; + overflow: hidden; + padding: 0 2px; + color: var(--text-normal); + background: var(--bg-overlay-3,var(--background-tertiary)) +} + +.searchBar_a46bef .icon_a46bef { + width: 24px; + height: 24px +} + +.full-motion .searchBar_a46bef { + transition: width.25s ease +} + +.DraftEditor-editorContainer,.DraftEditor-root,.public-DraftEditor-content { + height: inherit; + text-align: left; + text-align: initial +} + +.public-DraftEditor-content[contenteditable=true] { + -webkit-user-modify: read-write-plaintext-only +} + +.DraftEditor-root { + position: relative +} + +.DraftEditor-editorContainer { + background-color: rgba(255,255,255,0); + border-left: .1px solid transparent; + position: relative; + z-index: 1 +} + +.public-DraftEditorPlaceholder-root { + color: #9197a3; + position: absolute; + z-index: 1 +} + +.public-DraftStyleDefault-block { + position: relative; + white-space: pre-wrap +} + +.public-DraftStyleDefault-ltr { + direction: ltr; + text-align: left +} + +@keyframes arrowBounce__3b62c { + 0% { + transform: translate3d(0,-2px,0) + } + + 50% { + transform: translatez(0) + } + + to { + transform: translate3d(0,-2px,0) + } +} + +.search_ff5f90 { + margin: 0 8px +} + +.topic_bf3bbb { + flex: 1 1 auto; + position: relative; + min-width: 0; + margin: 0 0 0 8px; + font-weight: 500; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + font-size: 14px; + line-height: 18px; + color: var(--header-secondary) +} + +.topic_bf3bbb a { + color: var(--text-link) +} + +.topic_bf3bbb a:hover { + -webkit-text-decoration: underline; + text-decoration: underline +} + +.topicClickTarget_bf3bbb { + pointer-events: none; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0 +} + +.topic_bf3bbb.expandable_bf3bbb { + cursor: pointer +} + + +@keyframes horizontalBounce_a4d389 { + 0% { + transform: translatez(0) + } + + 50% { + transform: translate3d(-8px,0,0) + } + + to { + transform: translatez(0) + } +} + + + + + +.icon_f542fc { + align-items: center; + display: flex +} + +@keyframes fadeOut_baa6c5 { + 0% { + opacity: 1; + visibility: visible + } + + 99% { + opacity: .01; + visibility: visible + } + + to { + opacity: 0; + visibility: hidden + } +} + +@use postcss-pxtorem; + +@keyframes placeholderPulse__8767a { + 0% { + opacity: .3 + } + + 50% { + opacity: .8 + } + + to { + opacity: .3 + } +} + +div:has(>div>.modal_a78559) { + padding: 0 +} + + + + + +@keyframes placeholderPulse__3a528 { + 0% { + opacity: .6 + } + + 50% { + opacity: .8 + } + + to { + opacity: .6 + } +} + +:root { + --legacy-elevation-low: 0 1px 5px hsl(var(--black-500-hsl) / 0.2); + --legacy-elevation-high: 0 2px 10px 0 hsl(var(--black-500-hsl) / 0.1); + --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-300-hsl) / 0.3) +} + +.theme-dark { + --legacy-elevation-low: 0 1px 5px 0 hsl(var(--black-500-hsl) / 0.3); + --legacy-elevation-high: 0 2px 10px 0 hsl(var(--black-500-hsl) / 0.2); + --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-700-hsl) / 0.6) +} + +@keyframes blinkAsEdited__5e222 { + 0% { + background-color: var(--background-accent) + } + + to { + background-color: var(--background-modifier-accent) + } +} + + + + + +.button_a79c58 { + position: relative; + top: 3px; + opacity: .8; + transition: transform.2s ease-out,stroke-dasharray.2s ease-out; + margin-left: 4px +} + +.button_a79c58 path { + stroke-width: 2px; + stroke-dasharray: 7; + stroke-dashoffset: 1; + transition: stroke-dasharray.2s ease +} + +.content_cc29d1 { + display: flex; + justify-content: center; + align-items: center +} + +.containerDefault_f6f816 { + position: relative; + transition: opacity.2s ease-in-out +} + +.iconBase_f6f816 { + position: relative; + cursor: pointer; + line-height: 0 +} + +.iconItem_f6f816 { + display: none; + margin-left: 4px +} + +.containerDefault_f6f816.selected_f6f816 .iconNoChannelInfo_f6f816,.iconVisibility_f6f816:focus .iconItem_f6f816,.iconVisibility_f6f816:focus-within .iconItem_f6f816 { + display: block +} + +.containerDefault_f6f816.selected_f6f816 .iconWithChannelInfo_f6f816 { + display: none +} + +.iconItem_f6f816:focus,.iconItem_f6f816:focus-within { + display: block; + position: relative +} + +.actionIcon_f6f816 { + width: 16px; + height: 16px; + display: block +} + +.actionIcon_f6f816:active { + transform: translatey(.5px) +} + +.channelInfo_f6f816 { + display: block; + margin-left: 12px +} + +.iconVisibility_f6f816:focus .channelInfo_f6f816,.iconVisibility_f6f816:focus-within .channelInfo_f6f816 { + display: none +} + +.actionIcon_f6f816 { + color: var(--interactive-normal) +} + +.iconItem_f6f816:hover .actionIcon_f6f816 { + color: var(--interactive-hover) +} + +.actionIcon_f6f816:active { + color: var(--interactive-active) +} + +@media(hover: hover) { + .iconVisibility_f6f816:hover .iconItem_f6f816 { + display:block + } + + .iconVisibility_f6f816:hover .channelInfo_f6f816 { + display: none + } +} + +.wrapper_d8bfb3 { + padding: 1px 0; + overflow: visible; + position: relative; + margin-left: 8px +} + +.icon_d8bfb3 { + color: var(--channel-icon) +} + +.wrapper_d8bfb3.modeSelected_d8bfb3 { + cursor: default +} + +.icon_d8bfb3 { + display: block; + width: 20px; + height: 20px; + flex: 0 0 auto +} + +.iconContainer_d8bfb3 { + position: relative; + margin-right: 6px +} + +.link_d8bfb3 { + cursor: pointer; + position: relative; + box-sizing: border-box; + padding: 6px 8px; + border-radius: var(--radius-xs); + display: flex; + flex-direction: column +} + +.link_d8bfb3:before { + content: ""; + display: block; + position: absolute; + top: -1px; + right: 0; + bottom: -1px; + left: 0 +} + +.basicChannelRowLink_d8bfb3 { + min-height: 32px +} + +.linkTop_d8bfb3 { + position: relative; + display: flex; + justify-content: center; + align-items: center +} + +.linkBottom_d8bfb3 { + position: relative; + display: flex; + align-items: center; + margin-left: 26px +} + +.name_d8bfb3 { + font-size: 16px; + line-height: 20px; + font-weight: 500; + flex: 1 1 auto +} + +.subtitle_d8bfb3,.name_d8bfb3 { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis +} + +.unread_d8bfb3 { + position: absolute; + height: 8px; + width: 4px; + border-radius: 0 var(--radius-xs)var(--radius-xs)0; + top: 50%; + margin-top: -4px; + left: -8px; + background-color: var(--channels-default) +} + +.children_d8bfb3 { + display: flex; + align-items: center; + justify-content: center; + flex: 0 0 auto +} + +.modeMuted_d8bfb3 .icon_d8bfb3,.modeMuted_d8bfb3 .name_d8bfb3 { + color: var(--interactive-muted) +} + +.modeUnreadImportant_d8bfb3 .icon_d8bfb3,.modeUnreadImportant_d8bfb3:hover .icon_d8bfb3,.modeSelected_d8bfb3 .icon_d8bfb3,.modeSelected_d8bfb3:hover .icon_d8bfb3 { + color: var(--channel-icon) +} + +.wrapper_d8bfb3:hover .link_d8bfb3 { + background: var(--bg-overlay-hover,var(--background-modifier-hover)) +} + +.wrapper_d8bfb3:active .link_d8bfb3 { + background: var(--bg-overlay-active,var(--background-modifier-active)) +} + +.modeSelected_d8bfb3 .link_d8bfb3,.modeSelected_d8bfb3:hover .link_d8bfb3 { + background: var(--bg-overlay-selected,var(--background-modifier-selected)) +} + +.name_d8bfb3 { + color: var(--channels-default) +} + +.wrapper_d8bfb3:hover .name_d8bfb3,.modeMuted_d8bfb3:hover .name_d8bfb3 { + color: var(--interactive-hover) +} + +.modeSelected_d8bfb3 .name_d8bfb3,.modeSelected_d8bfb3:hover .name_d8bfb3,.modeUnreadImportant_d8bfb3 .name_d8bfb3,.modeUnreadImportant_d8bfb3:hover .name_d8bfb3 { + color: var(--interactive-active); + font-weight: 500; + font-weight: var(--font-weight-semibold-1x-light-theme,500) +} + +.unreadImportant_d8bfb3 { + background-color: var(--interactive-active) +} + +@media(max-width: 485px) { + .modeSelected_d8bfb3 .link_d8bfb3 { + background-color:transparent; + background-color: initial + } +} + +@keyframes progressPulse_a2c1e3 { + 0% { + background-position: 100% + } + + to { + background-position: 0 + } +} + +.containerDefault_a08117 { + position: relative; + padding-top: var(--custom-category-channel-space-before-category) +} + +.containerDefault_a08117:active { + transform: translatez(0) +} + +.addButton_a08117 { + width: 18px; + height: 18px; + display: none +} + +.addButton_a08117.forceVisible_a08117 { + display: block +} + +.iconVisibility_a08117:hover .addButton_a08117 { + display: block +} + +.addButton_a08117:focus,.addButton_a08117:focus-within { + display: block; + position: relative +} + +.addButtonIcon_a08117:hover { + color: var(--interactive-hover) +} + +.addButtonIcon_a08117:active { + transform: translatey(.5px); + color: var(--interactive-active) +} + +.wrapperCommon_a08117 { + position: relative; + box-sizing: border-box; + height: 24px; + padding-right: 8px; + padding-left: 16px; + display: flex; + align-items: center; + justify-content: space-between; + cursor: default; + color: var(--channels-default) +} + +.clickable_a08117 { + cursor: pointer +} + +.children_a08117 { + display: flex; + align-items: center; + justify-content: center; + flex: 0 0 auto +} + +.children_a08117:empty { + display: none +} + +.mainContent_a08117 { + flex: 1 1 auto; + overflow: hidden +} + +.mainContent_a08117:before { + content: ""; + display: block; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0 +} + +.icon_a08117 { + position: absolute; + left: 2px; + top: 6px; + width: 12px; + height: 12px +} + +.collapsed_a08117 .icon_a08117 { + --custom-icon-collapse-rotate: -90deg; + transform: rotate(270deg); + transform: rotate(var(--custom-icon-collapse-rotate)) +} + +.wrapper_a08117:hover .icon_a08117,.wrapper_a08117:hover .name_a08117 { + color: var(--interactive-hover) +} + +.scroller_c43953 { + z-index: 1; + padding-right: 8px +} + +.unread_c43953 { + left: 0; + right: 0 +} + +.unreadBar_c43953:before { + content: ""; + position: absolute; + top: 0; + left: -8px; + right: -8px; + bottom: 0 +} + +.unreadBottom_c43953 { + bottom: 0 +} + +.unreadBottom_c43953 .unreadBar_c43953:before { + bottom: -8px +} + +.positionedContainer_c43953 { + position: relative +} + +.unreadTop_c43953 { + top: 0 +} + +.unreadTop_c43953 .unreadBar_c43953:before { + top: -8px +} + +.sectionDivider_c43953 { + height: 1px; + width: 100%; + margin-top: 11px; + margin-left: 8px; + background-color: var(--background-modifier-accent) +} + +.wrapper_a5bc92 { + display: flex; + align-items: stretch; + flex: 0 0 auto; + font-size: 12px; + line-height: 20px; + font-weight: 500; + height: 20px; + border-radius: 10px; + overflow: hidden; + color: var(--channels-default) +} + +.users_a5bc92,.total_a5bc92 { + display: block; + text-align: center +} + +.users_a5bc92 { + display: flex; + align-items: center; + box-sizing: border-box; + width: 28px; + padding: 0 8px 0 6px; + background-color: var(--background-primary) +} + +.total_a5bc92 { + box-sizing: border-box; + width: 20px; + position: relative; + padding: 0 6px 0 0; + background-color: var(--background-tertiary) +} + +.total_a5bc92:after { + content: ""; + position: absolute; + top: 0; + left: -8px; + width: 0; + height: 0; + border-top: 20px solid transparent; + border-bottom: 0 solid transparent; + border-right: 8px solid transparent; + border-right-color: var(--background-tertiary) +} + +.iconBase_e2a798 { + position: relative; + cursor: pointer; + line-height: 0 +} + +.mentionsBadge_e2a798 { + pointer-events: none +} + +.container_fd6364 { + position: relative +} + +.clickable_fd6364 { + cursor: pointer +} + +.header_fd6364 { + position: relative; + font-family: var(--font-display); + font-weight: 500; + padding: 12px 16px; + box-sizing: border-box; + z-index: 3; + transition: background-color.1s linear; + box-shadow: var(--elevation-low) +} + +.headerContent_fd6364 { + display: flex; + align-items: center; + color: var(--header-primary) +} + +.primaryInfo_fd6364 { + justify-content: space-between; + height: 24px +} + +.headerButton_fd6364 { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + pointer-events: none +} + +.headerChildren_fd6364 { + position: relative; + z-index: 4 +} + +.clickable_fd6364 .header_fd6364:hover { + background-color: var(--background-modifier-hover) +} + +.name_fd6364 { + z-index: 1; + margin-right: auto; + color: inherit +} + +.container_ee69e0 { + display: flex; + flex-direction: column; + align-items: stretch; + justify-content: flex-start; + flex: 1 1 auto; + min-height: 0; + position: relative +} + +.dropdownButton_ee69e0 { + position: relative; + z-index: 2 +} + +.theme-dark .container_ee69e0 { + background: var(--bg-overlay-3,var(--background-secondary)) +} + +@keyframes pulse_b80cf1 { + 0% { + opacity: .7 + } + + to { + opacity: 1 + } +} + +.listItem_c96c45 { + position: relative; + margin: 0 0 8px; + display: flex; + justify-content: center; + width: var(--custom-list-items-list-item-width) +} + +.tutorialContainer_c96c45 { + position: relative +} + +.listItemWrapper_dfb2f8:active { + transform: translatey(1px)translatez(0) +} + +.circleIconButton_db6521 { + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + box-sizing: border-box; + width: 48px; + height: 48px; + transition: color.15s ease-out,background-color.15s ease-out; + color: var(--green-360); + background-color: var(--background-primary) +} + +.circleIcon_db6521 { + width: 24px; + height: 24px +} + +.pill_db6521 { + position: absolute; + top: 0; + left: 0 +} + +.wrapper_b7c66a { + position: absolute; + top: -16px; + bottom: -4px; + left: 0; + right: 0; + pointer-events: none; + display: flex; + flex-direction: column; + align-items: stretch +} + +.target_b7c66a { + flex: 1 0 50% +} + +.centerTarget_b7c66a { + flex: 1 0 50% +} + +.pill_f9623d { + position: absolute; + top: 0; + left: 0 +} + +.tutorialContainer_f9623d { + position: relative +} + +.wrapper_bc7085 { + position: relative; + width: var(--custom-list-items-list-item-width) +} + +.wrapper_bc7085:active { + transform: translatez(0) +} + +.expandedFolderBackground_bc7085 { + position: absolute; + top: 0; + left: 12px; + bottom: var(--custom-folder-item-guild-icon-margin); + width: var(--custom-folder-item-guild-icon-size); + border-radius: 24px; + transition: background-color var(--custom-folder-item-animation-duration)ease-out; + background-color: var(--background-secondary) +} + +.expandedFolderBackground_bc7085.collapsed_bc7085 { + background-color: transparent +} + +.folderIconWrapper_bc7085 { + width: var(--custom-folder-item-guild-icon-size); + height: var(--custom-folder-item-guild-icon-size); + border-radius: 16px; + overflow: hidden; + transition: background-color var(--custom-folder-item-animation-duration)ease-out +} + +.folder_bc7085 { + cursor: pointer; + width: var(--custom-folder-item-guild-icon-size); + height: var(--custom-folder-item-guild-icon-size); + transition: background-color var(--custom-folder-item-animation-duration)ease-out; + background-color: var(--background-secondary) +} + +.closedFolderIconWrapper_bc7085 { + width: var(--custom-folder-item-guild-icon-size); + height: var(--custom-folder-item-guild-icon-size); + padding: 4px; + box-sizing: border-box; + display: grid; + grid-template: 1fr 1fr/1fr 1fr; + justify-items: center; + align-items: center +} + +.guildIcon_bc7085 { + overflow: hidden; + position: static +} + +.blobContainer_a5ad63:active { + position: relative; + transform: translatey(1px)translatez(0); + backface-visibility: hidden +} + +.pill_a5ad63 { + position: absolute; + left: 0; + top: 0 +} + +@keyframes wobble_a5ad63 { + 0%,to { + transform: rotate(0) + } + + 25% { + transform: rotate(2deg) + } + + 75% { + transform: rotate(-2deg) + } +} + +.guildSeparator_d0c57e { + height: 2px; + width: 32px; + border-radius: 1px; + background-color: var(--background-modifier-accent) +} + +.wrapper_fea3ef { + overflow: hidden; + display: flex; + width: 72px; + flex-direction: column; + flex-shrink: 0; + position: relative; + background-color: var(--background-tertiary) +} + +.tree_fea3ef { + display: flex; + flex-direction: column; + height: 100%; + position: relative +} + +.scroller_fea3ef { + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + padding: 12px 0 0 +} + +.platform-win .scroller_fea3ef { + padding-top: 4px +} + +.unreadMentionsIndicatorTop_fea3ef,.unreadMentionsIndicatorBottom_fea3ef { + position: absolute; + left: 0; + right: 0; + z-index: 10; + overflow: hidden; + padding: 8px; + height: 40px; + pointer-events: none; + width: 72px; + box-sizing: border-box +} + +.unreadMentionsIndicatorTop_fea3ef { + padding-top: 8px +} + +.unreadMentionsIndicatorBottom_fea3ef { + padding-bottom: 8px +} + +.unreadMentionsBar_fea3ef:before { + position: absolute; + top: 0; + left: -8px; + right: -8px; + bottom: 0; + content: "" +} + +.unreadMentionsIndicatorTop_fea3ef { + top: 0 +} + +.unreadMentionsIndicatorTop_fea3ef .unreadMentionsBar_fea3ef:before { + top: -8px +} + +.unreadMentionsIndicatorBottom_fea3ef { + bottom: 0 +} + +.unreadMentionsIndicatorBottom_fea3ef .unreadMentionsBar_fea3ef:before { + bottom: -8px +} + +.container_b2ca13 { + height: 52px; + font-size: 14px; + font-weight: 500; + display: flex; + align-items: center; + padding: 0 8px 1px; + flex-shrink: 0; + position: relative +} + +.container_b2ca13 .avatar_b2ca13 { + flex-shrink: 0; + cursor: pointer +} + +.container_b2ca13 .avatar_b2ca13:hover { + opacity: .8 +} + +.avatarWrapper_b2ca13 { + margin-right: 8px +} + +.nameTag_b2ca13 { + -webkit-user-select: text; + -moz-user-select: text; + user-select: text; + flex-grow: 1; + margin-right: 4px; + min-width: 0 +} + +.nameTag_b2ca13.canCopy_b2ca13 { + cursor: pointer +} + +.withTagAsButton_b2ca13 { + align-items: center; + display: flex; + margin-left: -2px; + min-width: 120px; + padding-left: 2px +} + +.withTagAsButton_b2ca13:hover { + background-color: var(--background-modifier-selected); + border-radius: 4px; + color: var(--interactive-hover) +} + +.withTagAsButton_b2ca13 .nameTag_b2ca13 { + padding-bottom: 4px; + padding-left: 8px; + padding-top: 4px +} + +.withTagAsButton_b2ca13 .avatar_b2ca13:hover { + opacity: 1 +} + +.theme-dark .container_b2ca13 { + background: var(--bg-overlay-1,var(--background-secondary-alt)) +} + +.wrapper_adcaac { + position: relative; + overflow: visible +} + + + + + + + + + + +@keyframes Shine_af0e48 { + 0% { + transform: translate3d(-50%,0,0) + } + + to { + transform: translate3d(200%,0,0) + } +} + + + + + +@keyframes pulse__23510 { + 0% { + transform: scale(1); + opacity: 1 + } + + to { + transform: scale(.9); + opacity: .6 + } +} + +@keyframes rotate-spinner { + 0% { + transform: rotate(0) + } + + to { + transform: rotate(1turn) + } +} + +@keyframes cvc-indicate-location { + 0% { + opacity: 1 + } + + to { + opacity: .3 + } +} + + + +@keyframes demoEffect_d38a7a { + 0% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +@keyframes pulse__04ef1 { + 0% { + border-color: rgba(255,255,255,0) + } + + 25% { + border-color: rgba(255,255,255,.16) + } + + 50%,to { + border-color: rgba(255,255,255,0) + } +} + +@keyframes darkerPulse__02d62 { + 0% { + border-color: rgba(255,255,255,0) + } + + 25% { + border-color: rgba(255,255,255,.32) + } + + 50%,to { + border-color: rgba(255,255,255,0) + } +} + +@keyframes slidein_e1ab41 { + 0% { + margin-right: calc(-1*(var(--custom-client-themes-editor-content-width) + 2*var(--custom-client-themes-editor-editor-padding))) + } + + to { + margin-right: 0 + } +} + +@keyframes fadeOut__0eecc { + 0% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +@keyframes scale-bounce-wiggle_efce5d { + 0% { + transform: scale(0)rotate(10deg) + } + + 30% { + transform: scale(1.3)rotate(10deg) + } + + 55% { + transform: scale(.7)rotate(-10deg) + } + + 75% { + transform: scale(1.2)rotate(20deg) + } + + 85% { + transform: scale(.98)rotate(-20deg) + } + + 92% { + transform: scale(1.1)rotate(-5deg) + } + + 97% { + transform: scale(.99)rotate(-5deg) + } + + to { + transform: scale(1)rotate(0) + } +} + +@keyframes slidein_a3a57a { + 0% { + margin-right: calc(-1*(var(--custom-client-themes-editor-content-width) + 2*var(--custom-client-themes-editor-editor-padding))) + } + + to { + margin-right: 0 + } +} + +.canvas_a41a9d { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + z-index: 10000; + pointer-events: none +} + + + +@keyframes avatarAnimation__02544 { + 0% { + transform: rotate(0) + } + + to { + transform: rotate(360deg) + } +} + +:root { + --emojiInputHorizontalPadding: 8px +} + + +:root { + --legacy-elevation-low: 0 1px 5px hsl(var(--black-500-hsl) / 0.2); + --legacy-elevation-high: 0 2px 10px 0 hsl(var(--black-500-hsl) / 0.1); + --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-300-hsl) / 0.3) +} + +.theme-dark { + --legacy-elevation-low: 0 1px 5px 0 hsl(var(--black-500-hsl) / 0.3); + --legacy-elevation-high: 0 2px 10px 0 hsl(var(--black-500-hsl) / 0.2); + --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-700-hsl) / 0.6) +} + +@keyframes jiggle_dfdd24 { + 0% { + transform: rotate(0) + } + + 25% { + transform: rotate(5deg) + } + + 75% { + transform: rotate(-5deg) + } + + to { + transform: rotate(0) + } +} + +input::-webkit-outer-spin-button,input::-webkit-inner-spin-button { + -webkit-appearance: none; + appearance: none +} + + +@keyframes fly_b3eb18 { + 0% { + opacity: 1; + transform: translate(-10vw,110vh)rotate(0)scale(1) + } + + 10% { + transform: translate(50vw,50vh)rotate(90deg)scale(3) + } + + 20% { + transform: translate(110vw,-10vh)rotate(180deg)scale(1) + } + + 21% { + transform: translate(-10vw,-10vh)rotate(0)scale(1) + } + + 30% { + transform: translate(50vw,50vh)rotate(360deg)scale(2) + } + + 40% { + transform: translate(110vw,110vh)rotate(1080deg)scale(1) + } + + 40.5% { + transform: translate(-10vw,110vh)rotate(1080deg)scale(1) + } + + 41% { + transform: translate(-10vw,50vh)rotate(0)scale(1) + } + + 60% { + transform: translate(-10vw,50vh)rotate(0)scale(.1) + } + + 65% { + transform: translate(20vw,50vh)rotate(0)scale(1) + } + + 70% { + transform: translate(20vw,50vh)rotate(0)scale(1) + } + + 75% { + transform: translate(60vw,50vh)rotate(-30deg)scale(1) + } + + 99% { + transform: translate(300vw,50vh)rotate(-30deg)scale(1); + opacity: 1 + } + + to { + transform: translate(-200%,110vh)rotate(0); + opacity: 0 + } +} + +@keyframes fadeIn_cd54a1 { + 0% { + opacity: 0 + } + + to { + opacity: 1 + } +} + +@keyframes fadeOut__0f8b9 { + 0% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +@keyframes fadeIn__18cab { + 0% { + opacity: 0 + } + + to { + opacity: 1 + } +} + +@keyframes fadeOut__374f4 { + 0% { + opacity: 1 + } + + to { + opacity: 0 + } +} + + + +@keyframes scaleIn__8a961 { + 0% { + transform: scale(.7) + } + + to { + transform: scale(1) + } +} + + + + + +@keyframes gemGlow_e7051d { + 0%,50%,to { + filter: drop-shadow(0 0 0 hsl(var(--premium-tier-2-pink-for-gradients-2-hsl)/.6)) + } + + 25%,75% { + filter: drop-shadow(0 0 20px hsl(var(--premium-tier-2-pink-for-gradients-2-hsl)/.6)) + } +} + +@keyframes glow_b03664 { + 0%,50%,to { + filter: none + } + + 25%,75% { + filter: drop-shadow(0 0 5px var(--premium-tier-2-pink-for-gradients-2)) + } +} + +@keyframes pulse__17942 { + 0%,50%,to { + stroke-width: 2 + } + + 25%,75% { + stroke-width: 3 + } +} + +@keyframes glowEffect_d1f04f { + 0% { + box-shadow: var(--elevation-medium) + } + + 50% { + box-shadow: 0 0 16px 16px hsl(var(--premium-tier-2-pink-for-gradients-2-hsl)/.3) + } + + to { + box-shadow: var(--elevation-medium) + } +} + + +@keyframes glow__8789a { + 0% { + opacity: 1 + } + + 20% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +.container_a4d4d9 { + position: relative; + overflow: hidden; + width: 100%; + height: 100%; + display: flex +} + +.guilds_a4d4d9 { + position: relative; + width: 72px; + flex-shrink: 0 +} + +.base_a4d4d9 { + display: flex; + flex-direction: column; + overflow: hidden; + position: relative; + flex-grow: 1 +} + +.sidebar_a4d4d9 { + display: flex; + flex-direction: column; + min-height: 0; + width: 240px; + flex: 0 0 auto; + overflow: hidden; + background: var(--background-secondary) +} + +.platform-win .sidebar_a4d4d9 { + border-radius: 8px 0 0; + overflow: hidden +} + +.panels_a4d4d9 { + flex: 0 0 auto; + background-color: var(--background-secondary-alt); + z-index: 2 +} + +.content_a4d4d9 { + display: flex; + align-items: stretch; + justify-content: flex-start; + min-width: 0; + min-height: 0; + flex: 1 1 auto +} + +.layers_d4b6c5 { + position: relative; + overflow: hidden +} + +.layers_d4b6c5>.layer_d4b6c5 { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + display: flex; + overflow: hidden; + flex-direction: column +} + +.bg_d4b6c5 { + background: var(--bg-overlay-app-frame,var(--background-tertiary)); + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0 +} + +.platform-win .layer_d4b6c5 { + top: -22px; + padding-top: 22px +} + +.platform-win .bg_d4b6c5 { + top: -22px +} + +.layer_d4b6c5 { + background-color: var(--background-primary) +} + +.layer_d4b6c5.baseLayer_d4b6c5 { + background-color: transparent +} + +@keyframes zoomin_fa2e9f { + 0% { + transform: translate(-50%,-50%)scale(.25) + } + + to { + transform: translate(-50%,-50%)scale(1) + } +} + + + + +div:has(>div>.container_d99f08) { + padding: 0 +} + + +@keyframes Shine__844ef { + 0% { + transform: translate3d(-75%,0,0) + } + + to { + transform: translate3d(200%,0,0) + } +} + +@keyframes floating-house__3807f { + 0% { + transform: translatey(0) + } + + 50% { + transform: translatey(var(--custom-guild-settings-community-intro-hover-distance)) + } + + to { + transform: translatey(0) + } +} + +@keyframes enable_adccc9 { + 0% { + transform: scale(1); + background-color: var(--interactive-muted) + } + + 20% { + box-shadow: 0 0 0 0 hsl(var(--green-360-hsl)/.5) + } + + 60% { + transform: scale(1.2); + background-color: var(--green-230) + } + + to { + transform: scale(1); + box-shadow: 0 0 0 8px hsl(var(--green-360-hsl)/0) + } +} + + +@use postcss-pxtorem; + +@keyframes placeholderPulse__22a3a { + 0% { + opacity: .6 + } + + 50% { + opacity: .8 + } + + to { + opacity: .6 + } +} + + +@keyframes pulseBorder_f5b0c6 { + 0% { + border-color: transparent + } + + 50% { + border-color: var(--brand-experiment) + } + + to { + border-color: transparent + } +} + +@keyframes shimmer__1b34d { + to { + transform: skewx(-20deg)translatex(100%) + } +} + +@keyframes float_f130a3 { + 0% { + transform: translatey(4px) + } + + to { + transform: translatey(-4px) + } +} + +@keyframes altFloat_f130a3 { + 0% { + transform: translatey(-4px) + } + + to { + transform: translatey(4px) + } +} + + +@keyframes placeholderPulse_b794ed { + 0% { + opacity: .1 + } + + 50% { + opacity: .25 + } + + to { + opacity: .1 + } +} + +@keyframes loadingBar__86f76 { + 0% { + left: 0%; + right: 100%; + width: 0% + } + + 10% { + left: 0%; + right: 75%; + width: 25% + } + + 90% { + right: 0%; + left: 75%; + width: 25% + } + + to { + left: 100%; + right: 0%; + width: 0% + } +} + +@keyframes shine__78ef9 { + 0% { + background-position: 300%300%,center + } + + to { + background-position: -300%-300%,center + } +} + + + +@keyframes symbolFadeIn_be5473 { + 0% { + opacity: 0 + } + + 25% { + opacity: 1 + } + + to { + opacity: 1 + } +} + +@keyframes symbolBgFadeOut__3de33 { + 0% { + opacity: 0 + } + + 25% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +@keyframes explCircleInner__36446 { + 0% { + transform: scale(.2)translatez(0); + opacity: 0 + } + + 10% { + opacity: 1 + } + + 70% { + opacity: 1 + } + + to { + transform: scale(.8)translatez(0); + opacity: 0 + } +} + +@keyframes explCircleOuter__37e75 { + 0% { + transform: scale(.2)translatez(0); + opacity: 0 + } + + 10% { + opacity: 1 + } + + 70% { + opacity: 1 + } + + to { + transform: scale(.9)translatez(0); + opacity: 0 + } +} + +@keyframes explLinesSecondary__68a22 { + 0% { + transform: scale(0)translatez(0); + opacity: 0 + } + + 20% { + opacity: 1 + } + + 50% { + opacity: 1 + } + + to { + transform: scale(1)translatez(0); + opacity: 0 + } +} + +@keyframes explLinesMain__003fb { + 0% { + transform: scale(0)translatez(0); + opacity: 0 + } + + 30% { + opacity: 1 + } + + 50% { + opacity: 1 + } + + to { + transform: scale(1)translatez(0); + opacity: 0 + } +} + +@keyframes arrow_ad95dc { + 0% { + background-position: 0 -50px + } + + to { + background-position: 0 -150px + } +} + +:root { + --custom-forum-post-form-horizontal-padding: 12px; + --custom-forum-post-form-control-size: 36px +} + +@keyframes loaderAnimation__8d011 { + 0% { + transform: rotate(0) + } + + to { + transform: rotate(360deg) + } +} + + + +@keyframes completed_d5f0da { + 0% { + opacity: 0 + } + + to { + opacity: 1 + } +} + +@keyframes footer_d5f0da { + 0% { + opacity: 0 + } + + to { + opacity: 1 + } +} + +:root { + --custom-backdrop-z-index: 1000; + --custom-card-z-index: 1001; + --custom-confetti-canvas-z-index: 1002; + --custom-close-button-z-index: 1004; + --custom-lightning-checkout-z-index: 1003; + --custom-shaker-z-index: 1005 +} + +@keyframes easterEggAnimation_c14e21 { + 0% { + transform: translatey(10px) + } + + to { + transform: translatey(-30px) + } +} + +@keyframes easterEggAnimationReverse_ffc502 { + 0% { + transform: translatey(-30px) + } + + to { + transform: translatey(10px) + } +} + +@keyframes placeholderPulse__89700 { + 0% { + opacity: .3 + } + + 50% { + opacity: 1 + } + + to { + opacity: .3 + } +} + +@keyframes snowflakes-fall_bb62a8 { + 0% { + top: -10% + } + + to { + top: 100% + } +} + +@keyframes snowflakes-shake__1f7bd { + 0%,to { + transform: translatex(0) + } + + 50% { + transform: translatex(80px) + } +} + +@keyframes reflect_a2488d { + 0% { + transform: scale(0)rotate(45deg); + opacity: 0 + } + + 80% { + transform: scale(0)rotate(45deg); + opacity: .25 + } + + 81% { + transform: scale(4)rotate(45deg); + opacity: .5 + } + + to { + transform: scale(50)rotate(45deg); + opacity: 0 + } +} + +.wrapper_cd22e7 { + height: 100%; + left: 0; + position: absolute; + top: 0; + width: 100%; + z-index: 1002 +} + +.wrapper_cd22e7 { + pointer-events: none +} + +.gadientHighlight_cd22e7 { + position: absolute; + width: 100%; + height: 100%; + pointer-events: none; + background-image: linear-gradient(90deg,var(--premium-tier-2-purple-for-gradients)0%,var(--premium-tier-2-purple-for-gradients-2)50%,var(--premium-tier-2-pink-for-gradients)100%) +} + +.swipeWrapper_cd22e7 { + position: absolute; + width: 100%; + height: 100%; + pointer-events: none +} + +.swipe_cd22e7 { + position: absolute; + height: 100%; + opacity: .1; + width: auto; + right: 0; + top: 0 +} + + +@keyframes arrow-pulse__96c47 { + 0%,to { + transform: translatez(0) + } + + 50% { + transform: translate3d(3px,0,0) + } +} + +::-webkit-calendar-picker-indicator { + filter: invert(.6) +} + + + +.list { + list-style-type: disc; + margin-left: 30px +} + +:root { + --application-subscription-end: hsl(var(--application-subscription-end-hsl) / 1); + --application-subscription-end-hsl: 197 calc(var(--saturation-factor, 1) * 98.8%) 32.4%; + --application-subscription-start: hsl(var(--application-subscription-start-hsl) / 1); + --application-subscription-start-hsl: 235 calc(var(--saturation-factor, 1) * 68.5%) 52.7%; + --battlenet: hsl(var(--battlenet-hsl) / 1); + --battlenet-hsl: 200 calc(var(--saturation-factor, 1) * 100%) 44.9%; + --bg-gradient-aurora-1: hsl(var(--bg-gradient-aurora-1-hsl) / 1); + --bg-gradient-aurora-1-hsl: 220 calc(var(--saturation-factor, 1) * 86.5%) 17.5%; + --bg-gradient-aurora-2: hsl(var(--bg-gradient-aurora-2-hsl) / 1); + --bg-gradient-aurora-2-hsl: 238 calc(var(--saturation-factor, 1) * 76.4%) 41.6%; + --bg-gradient-aurora-3: hsl(var(--bg-gradient-aurora-3-hsl) / 1); + --bg-gradient-aurora-3-hsl: 184 calc(var(--saturation-factor, 1) * 78%) 33.9%; + --bg-gradient-aurora-4: hsl(var(--bg-gradient-aurora-4-hsl) / 1); + --bg-gradient-aurora-4-hsl: 169 calc(var(--saturation-factor, 1) * 60.2%) 32.5%; + --bg-gradient-aurora-5: hsl(var(--bg-gradient-aurora-5-hsl) / 1); + --bg-gradient-aurora-5-hsl: 230 calc(var(--saturation-factor, 1) * 92.5%) 26.3%; + --bg-gradient-chroma-glow-1: hsl(var(--bg-gradient-chroma-glow-1-hsl) / 1); + --bg-gradient-chroma-glow-1-hsl: 183 calc(var(--saturation-factor, 1) * 86.3%) 40.2%; + --bg-gradient-chroma-glow-2: hsl(var(--bg-gradient-chroma-glow-2-hsl) / 1); + --bg-gradient-chroma-glow-2-hsl: 258 calc(var(--saturation-factor, 1) * 89.8%) 46.3%; + --bg-gradient-chroma-glow-3: hsl(var(--bg-gradient-chroma-glow-3-hsl) / 1); + --bg-gradient-chroma-glow-3-hsl: 298 calc(var(--saturation-factor, 1) * 90.9%) 34.3%; + --bg-gradient-chroma-glow-4: hsl(var(--bg-gradient-chroma-glow-4-hsl) / 1); + --bg-gradient-chroma-glow-4-hsl: 265 calc(var(--saturation-factor, 1) * 100%) 66.3%; + --bg-gradient-chroma-glow-5: hsl(var(--bg-gradient-chroma-glow-5-hsl) / 1); + --bg-gradient-chroma-glow-5-hsl: 207 calc(var(--saturation-factor, 1) * 75.5%) 50.4%; + --bg-gradient-citrus-sherbert-1: hsl(var(--bg-gradient-citrus-sherbert-1-hsl) / 1); + --bg-gradient-citrus-sherbert-1-hsl: 40 calc(var(--saturation-factor, 1) * 88.7%) 58.2%; + --bg-gradient-citrus-sherbert-2: hsl(var(--bg-gradient-citrus-sherbert-2-hsl) / 1); + --bg-gradient-citrus-sherbert-2-hsl: 18 calc(var(--saturation-factor, 1) * 81.5%) 63.9%; + --bg-gradient-cotton-candy-1: hsl(var(--bg-gradient-cotton-candy-1-hsl) / 1); + --bg-gradient-cotton-candy-1-hsl: 349 calc(var(--saturation-factor, 1) * 76.8%) 81.4%; + --bg-gradient-cotton-candy-2: hsl(var(--bg-gradient-cotton-candy-2-hsl) / 1); + --bg-gradient-cotton-candy-2-hsl: 226 calc(var(--saturation-factor, 1) * 92.6%) 84.1%; + --bg-gradient-crimson-moon-1: hsl(var(--bg-gradient-crimson-moon-1-hsl) / 1); + --bg-gradient-crimson-moon-1-hsl: 0 calc(var(--saturation-factor, 1) * 88.6%) 31%; + --bg-gradient-crimson-moon-2: hsl(var(--bg-gradient-crimson-moon-2-hsl) / 1); + --bg-gradient-crimson-moon-2-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --bg-gradient-desert-khaki-1: hsl(var(--bg-gradient-desert-khaki-1-hsl) / 1); + --bg-gradient-desert-khaki-1-hsl: 29 calc(var(--saturation-factor, 1) * 32.4%) 86.1%; + --bg-gradient-desert-khaki-2: hsl(var(--bg-gradient-desert-khaki-2-hsl) / 1); + --bg-gradient-desert-khaki-2-hsl: 40 calc(var(--saturation-factor, 1) * 41.3%) 78.6%; + --bg-gradient-desert-khaki-3: hsl(var(--bg-gradient-desert-khaki-3-hsl) / 1); + --bg-gradient-desert-khaki-3-hsl: 50 calc(var(--saturation-factor, 1) * 49.6%) 75.9%; + --bg-gradient-dusk-1: hsl(var(--bg-gradient-dusk-1-hsl) / 1); + --bg-gradient-dusk-1-hsl: 293 calc(var(--saturation-factor, 1) * 13.5%) 36.3%; + --bg-gradient-dusk-2: hsl(var(--bg-gradient-dusk-2-hsl) / 1); + --bg-gradient-dusk-2-hsl: 223 calc(var(--saturation-factor, 1) * 41%) 69.4%; + --bg-gradient-easter-egg-1: hsl(var(--bg-gradient-easter-egg-1-hsl) / 1); + --bg-gradient-easter-egg-1-hsl: 227 calc(var(--saturation-factor, 1) * 58.4%) 65.1%; + --bg-gradient-easter-egg-2: hsl(var(--bg-gradient-easter-egg-2-hsl) / 1); + --bg-gradient-easter-egg-2-hsl: 227 calc(var(--saturation-factor, 1) * 31%) 44.3%; + --bg-gradient-forest-1: hsl(var(--bg-gradient-forest-1-hsl) / 1); + --bg-gradient-forest-1-hsl: 124 calc(var(--saturation-factor, 1) * 25.9%) 10.6%; + --bg-gradient-forest-2: hsl(var(--bg-gradient-forest-2-hsl) / 1); + --bg-gradient-forest-2-hsl: 143 calc(var(--saturation-factor, 1) * 26.2%) 23.9%; + --bg-gradient-forest-3: hsl(var(--bg-gradient-forest-3-hsl) / 1); + --bg-gradient-forest-3-hsl: 76 calc(var(--saturation-factor, 1) * 20.6%) 24.7%; + --bg-gradient-forest-4: hsl(var(--bg-gradient-forest-4-hsl) / 1); + --bg-gradient-forest-4-hsl: 117 calc(var(--saturation-factor, 1) * 17%) 41.6%; + --bg-gradient-forest-5: hsl(var(--bg-gradient-forest-5-hsl) / 1); + --bg-gradient-forest-5-hsl: 43 calc(var(--saturation-factor, 1) * 38.5%) 47.8%; + --bg-gradient-hanami-1: hsl(var(--bg-gradient-hanami-1-hsl) / 1); + --bg-gradient-hanami-1-hsl: 352 calc(var(--saturation-factor, 1) * 68.3%) 80.2%; + --bg-gradient-hanami-2: hsl(var(--bg-gradient-hanami-2-hsl) / 1); + --bg-gradient-hanami-2-hsl: 43 calc(var(--saturation-factor, 1) * 73.6%) 76.3%; + --bg-gradient-hanami-3: hsl(var(--bg-gradient-hanami-3-hsl) / 1); + --bg-gradient-hanami-3-hsl: 116 calc(var(--saturation-factor, 1) * 43.1%) 74.5%; + --bg-gradient-lofi-vibes-1: hsl(var(--bg-gradient-lofi-vibes-1-hsl) / 1); + --bg-gradient-lofi-vibes-1-hsl: 220 calc(var(--saturation-factor, 1) * 83.8%) 80.6%; + --bg-gradient-lofi-vibes-2: hsl(var(--bg-gradient-lofi-vibes-2-hsl) / 1); + --bg-gradient-lofi-vibes-2-hsl: 184 calc(var(--saturation-factor, 1) * 57.8%) 78.6%; + --bg-gradient-lofi-vibes-3: hsl(var(--bg-gradient-lofi-vibes-3-hsl) / 1); + --bg-gradient-lofi-vibes-3-hsl: 130 calc(var(--saturation-factor, 1) * 46.3%) 78.8%; + --bg-gradient-lofi-vibes-4: hsl(var(--bg-gradient-lofi-vibes-4-hsl) / 1); + --bg-gradient-lofi-vibes-4-hsl: 76 calc(var(--saturation-factor, 1) * 48.8%) 75.5%; + --bg-gradient-mars-1: hsl(var(--bg-gradient-mars-1-hsl) / 1); + --bg-gradient-mars-1-hsl: 15 calc(var(--saturation-factor, 1) * 36.3%) 39.4%; + --bg-gradient-mars-2: hsl(var(--bg-gradient-mars-2-hsl) / 1); + --bg-gradient-mars-2-hsl: 0 calc(var(--saturation-factor, 1) * 36.2%) 41.2%; + --bg-gradient-midnight-blurple-1: hsl(var(--bg-gradient-midnight-blurple-1-hsl) / 1); + --bg-gradient-midnight-blurple-1-hsl: 245 calc(var(--saturation-factor, 1) * 55.1%) 53.7%; + --bg-gradient-midnight-blurple-2: hsl(var(--bg-gradient-midnight-blurple-2-hsl) / 1); + --bg-gradient-midnight-blurple-2-hsl: 259 calc(var(--saturation-factor, 1) * 74.5%) 10.8%; + --bg-gradient-mint-apple-1: hsl(var(--bg-gradient-mint-apple-1-hsl) / 1); + --bg-gradient-mint-apple-1-hsl: 166 calc(var(--saturation-factor, 1) * 39.7%) 52.5%; + --bg-gradient-mint-apple-2: hsl(var(--bg-gradient-mint-apple-2-hsl) / 1); + --bg-gradient-mint-apple-2-hsl: 119 calc(var(--saturation-factor, 1) * 40.4%) 55.9%; + --bg-gradient-mint-apple-3: hsl(var(--bg-gradient-mint-apple-3-hsl) / 1); + --bg-gradient-mint-apple-3-hsl: 87 calc(var(--saturation-factor, 1) * 48.3%) 59.8%; + --bg-gradient-neon-nights-1: hsl(var(--bg-gradient-neon-nights-1-hsl) / 1); + --bg-gradient-neon-nights-1-hsl: 176 calc(var(--saturation-factor, 1) * 98.8%) 33.1%; + --bg-gradient-neon-nights-2: hsl(var(--bg-gradient-neon-nights-2-hsl) / 1); + --bg-gradient-neon-nights-2-hsl: 259 calc(var(--saturation-factor, 1) * 39.5%) 55.3%; + --bg-gradient-neon-nights-3: hsl(var(--bg-gradient-neon-nights-3-hsl) / 1); + --bg-gradient-neon-nights-3-hsl: 314 calc(var(--saturation-factor, 1) * 52.5%) 46.3%; + --bg-gradient-retro-raincloud-1: hsl(var(--bg-gradient-retro-raincloud-1-hsl) / 1); + --bg-gradient-retro-raincloud-1-hsl: 202 calc(var(--saturation-factor, 1) * 47%) 42.9%; + --bg-gradient-retro-raincloud-2: hsl(var(--bg-gradient-retro-raincloud-2-hsl) / 1); + --bg-gradient-retro-raincloud-2-hsl: 241 calc(var(--saturation-factor, 1) * 29.6%) 61%; + --bg-gradient-retro-storm-1: hsl(var(--bg-gradient-retro-storm-1-hsl) / 1); + --bg-gradient-retro-storm-1-hsl: 202 calc(var(--saturation-factor, 1) * 47%) 42.9%; + --bg-gradient-retro-storm-2: hsl(var(--bg-gradient-retro-storm-2-hsl) / 1); + --bg-gradient-retro-storm-2-hsl: 241 calc(var(--saturation-factor, 1) * 27.8%) 47.3%; + --bg-gradient-sepia-1: hsl(var(--bg-gradient-sepia-1-hsl) / 1); + --bg-gradient-sepia-1-hsl: 33 calc(var(--saturation-factor, 1) * 14.2%) 45.7%; + --bg-gradient-sepia-2: hsl(var(--bg-gradient-sepia-2-hsl) / 1); + --bg-gradient-sepia-2-hsl: 36 calc(var(--saturation-factor, 1) * 46.8%) 24.3%; + --bg-gradient-strawberry-lemonade-1: hsl(var(--bg-gradient-strawberry-lemonade-1-hsl) / 1); + --bg-gradient-strawberry-lemonade-1-hsl: 327 calc(var(--saturation-factor, 1) * 74.1%) 39.4%; + --bg-gradient-strawberry-lemonade-2: hsl(var(--bg-gradient-strawberry-lemonade-2-hsl) / 1); + --bg-gradient-strawberry-lemonade-2-hsl: 28 calc(var(--saturation-factor, 1) * 71.7%) 44.3%; + --bg-gradient-strawberry-lemonade-3: hsl(var(--bg-gradient-strawberry-lemonade-3-hsl) / 1); + --bg-gradient-strawberry-lemonade-3-hsl: 40 calc(var(--saturation-factor, 1) * 80.2%) 52.5%; + --bg-gradient-sunrise-1: hsl(var(--bg-gradient-sunrise-1-hsl) / 1); + --bg-gradient-sunrise-1-hsl: 327 calc(var(--saturation-factor, 1) * 42%) 43.9%; + --bg-gradient-sunrise-2: hsl(var(--bg-gradient-sunrise-2-hsl) / 1); + --bg-gradient-sunrise-2-hsl: 27 calc(var(--saturation-factor, 1) * 44.9%) 58%; + --bg-gradient-sunrise-3: hsl(var(--bg-gradient-sunrise-3-hsl) / 1); + --bg-gradient-sunrise-3-hsl: 50 calc(var(--saturation-factor, 1) * 46.3%) 44.5%; + --bg-gradient-sunset-1: hsl(var(--bg-gradient-sunset-1-hsl) / 1); + --bg-gradient-sunset-1-hsl: 259 calc(var(--saturation-factor, 1) * 55.6%) 35.3%; + --bg-gradient-sunset-2: hsl(var(--bg-gradient-sunset-2-hsl) / 1); + --bg-gradient-sunset-2-hsl: 22 calc(var(--saturation-factor, 1) * 66.7%) 57.6%; + --bg-gradient-under-the-sea-1: hsl(var(--bg-gradient-under-the-sea-1-hsl) / 1); + --bg-gradient-under-the-sea-1-hsl: 115 calc(var(--saturation-factor, 1) * 10.5%) 42.9%; + --bg-gradient-under-the-sea-2: hsl(var(--bg-gradient-under-the-sea-2-hsl) / 1); + --bg-gradient-under-the-sea-2-hsl: 159 calc(var(--saturation-factor, 1) * 20.4%) 43.3%; + --bg-gradient-under-the-sea-3: hsl(var(--bg-gradient-under-the-sea-3-hsl) / 1); + --bg-gradient-under-the-sea-3-hsl: 175 calc(var(--saturation-factor, 1) * 10.9%) 46.7%; + --black-100: hsl(var(--black-100-hsl) / 1); + --black-100-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 94.9%; + --black-130: hsl(var(--black-130-hsl) / 1); + --black-130-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 91%; + --black-160: hsl(var(--black-160-hsl) / 1); + --black-160-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 85.5%; + --black-200: hsl(var(--black-200-hsl) / 1); + --black-200-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 80%; + --black-230: hsl(var(--black-230-hsl) / 1); + --black-230-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 74.1%; + --black-260: hsl(var(--black-260-hsl) / 1); + --black-260-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 67.5%; + --black-300: hsl(var(--black-300-hsl) / 1); + --black-300-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 60%; + --black-330: hsl(var(--black-330-hsl) / 1); + --black-330-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 47.8%; + --black-345: hsl(var(--black-345-hsl) / 1); + --black-345-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 40%; + --black-360: hsl(var(--black-360-hsl) / 1); + --black-360-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 36.1%; + --black-400: hsl(var(--black-400-hsl) / 1); + --black-400-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 20%; + --black-430: hsl(var(--black-430-hsl) / 1); + --black-430-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 14.5%; + --black-460: hsl(var(--black-460-hsl) / 1); + --black-460-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 7.8%; + --black-500: hsl(var(--black-500-hsl) / 1); + --black-500-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-530: hsl(var(--black-530-hsl) / 1); + --black-530-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-560: hsl(var(--black-560-hsl) / 1); + --black-560-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-600: hsl(var(--black-600-hsl) / 1); + --black-600-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-630: hsl(var(--black-630-hsl) / 1); + --black-630-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-660: hsl(var(--black-660-hsl) / 1); + --black-660-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-700: hsl(var(--black-700-hsl) / 1); + --black-700-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-730: hsl(var(--black-730-hsl) / 1); + --black-730-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-760: hsl(var(--black-760-hsl) / 1); + --black-760-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-800: hsl(var(--black-800-hsl) / 1); + --black-800-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-830: hsl(var(--black-830-hsl) / 1); + --black-830-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-860: hsl(var(--black-860-hsl) / 1); + --black-860-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --black-900: hsl(var(--black-900-hsl) / 1); + --black-900-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --blue-100: hsl(var(--blue-100-hsl) / 1); + --blue-100-hsl: 210 calc(var(--saturation-factor, 1) * 80%) 98%; + --blue-130: hsl(var(--blue-130-hsl) / 1); + --blue-130-hsl: 210 calc(var(--saturation-factor, 1) * 87.5%) 96.9%; + --blue-160: hsl(var(--blue-160-hsl) / 1); + --blue-160-hsl: 209 calc(var(--saturation-factor, 1) * 87.1%) 93.9%; + --blue-200: hsl(var(--blue-200-hsl) / 1); + --blue-200-hsl: 206 calc(var(--saturation-factor, 1) * 92.3%) 89.8%; + --blue-230: hsl(var(--blue-230-hsl) / 1); + --blue-230-hsl: 205 calc(var(--saturation-factor, 1) * 92.5%) 84.3%; + --blue-260: hsl(var(--blue-260-hsl) / 1); + --blue-260-hsl: 204 calc(var(--saturation-factor, 1) * 94.5%) 78.4%; + --blue-300: hsl(var(--blue-300-hsl) / 1); + --blue-300-hsl: 203 calc(var(--saturation-factor, 1) * 97.4%) 69.6%; + --blue-330: hsl(var(--blue-330-hsl) / 1); + --blue-330-hsl: 201 calc(var(--saturation-factor, 1) * 100%) 59%; + --blue-345: hsl(var(--blue-345-hsl) / 1); + --blue-345-hsl: 200 calc(var(--saturation-factor, 1) * 100%) 49.4%; + --blue-360: hsl(var(--blue-360-hsl) / 1); + --blue-360-hsl: 203 calc(var(--saturation-factor, 1) * 100%) 47.5%; + --blue-400: hsl(var(--blue-400-hsl) / 1); + --blue-400-hsl: 207 calc(var(--saturation-factor, 1) * 100%) 46.1%; + --blue-430: hsl(var(--blue-430-hsl) / 1); + --blue-430-hsl: 212 calc(var(--saturation-factor, 1) * 100%) 45.3%; + --blue-460: hsl(var(--blue-460-hsl) / 1); + --blue-460-hsl: 214 calc(var(--saturation-factor, 1) * 100%) 41%; + --blue-500: hsl(var(--blue-500-hsl) / 1); + --blue-500-hsl: 213 calc(var(--saturation-factor, 1) * 100%) 35.7%; + --blue-530: hsl(var(--blue-530-hsl) / 1); + --blue-530-hsl: 212 calc(var(--saturation-factor, 1) * 100%) 30.4%; + --blue-560: hsl(var(--blue-560-hsl) / 1); + --blue-560-hsl: 212 calc(var(--saturation-factor, 1) * 100%) 26.7%; + --blue-600: hsl(var(--blue-600-hsl) / 1); + --blue-600-hsl: 211 calc(var(--saturation-factor, 1) * 100%) 23.1%; + --blue-630: hsl(var(--blue-630-hsl) / 1); + --blue-630-hsl: 211 calc(var(--saturation-factor, 1) * 100%) 20.8%; + --blue-660: hsl(var(--blue-660-hsl) / 1); + --blue-660-hsl: 212 calc(var(--saturation-factor, 1) * 100%) 18.6%; + --blue-700: hsl(var(--blue-700-hsl) / 1); + --blue-700-hsl: 212 calc(var(--saturation-factor, 1) * 100%) 16.7%; + --blue-730: hsl(var(--blue-730-hsl) / 1); + --blue-730-hsl: 211 calc(var(--saturation-factor, 1) * 100%) 14.1%; + --blue-760: hsl(var(--blue-760-hsl) / 1); + --blue-760-hsl: 211 calc(var(--saturation-factor, 1) * 100%) 12.4%; + --blue-800: hsl(var(--blue-800-hsl) / 1); + --blue-800-hsl: 211 calc(var(--saturation-factor, 1) * 100%) 10.6%; + --blue-830: hsl(var(--blue-830-hsl) / 1); + --blue-830-hsl: 213 calc(var(--saturation-factor, 1) * 100%) 9.4%; + --blue-860: hsl(var(--blue-860-hsl) / 1); + --blue-860-hsl: 213 calc(var(--saturation-factor, 1) * 100%) 8.4%; + --blue-900: hsl(var(--blue-900-hsl) / 1); + --blue-900-hsl: 213 calc(var(--saturation-factor, 1) * 100%) 7.1%; + --brand-100: hsl(var(--brand-100-hsl) / 1); + --brand-100-hsl: 240 calc(var(--saturation-factor, 1) * 77.8%) 98.2%; + --brand-130: hsl(var(--brand-130-hsl) / 1); + --brand-130-hsl: 236 calc(var(--saturation-factor, 1) * 87.5%) 96.9%; + --brand-160: hsl(var(--brand-160-hsl) / 1); + --brand-160-hsl: 235 calc(var(--saturation-factor, 1) * 84.6%) 94.9%; + --brand-200: hsl(var(--brand-200-hsl) / 1); + --brand-200-hsl: 236 calc(var(--saturation-factor, 1) * 83.3%) 92.9%; + --brand-230: hsl(var(--brand-230-hsl) / 1); + --brand-230-hsl: 236 calc(var(--saturation-factor, 1) * 87%) 91%; + --brand-260: hsl(var(--brand-260-hsl) / 1); + --brand-260-hsl: 235 calc(var(--saturation-factor, 1) * 86.2%) 88.6%; + --brand-300: hsl(var(--brand-300-hsl) / 1); + --brand-300-hsl: 235 calc(var(--saturation-factor, 1) * 86.1%) 85.9%; + --brand-330: hsl(var(--brand-330-hsl) / 1); + --brand-330-hsl: 235 calc(var(--saturation-factor, 1) * 85.1%) 81.6%; + --brand-345: hsl(var(--brand-345-hsl) / 1); + --brand-345-hsl: 235 calc(var(--saturation-factor, 1) * 85.2%) 78.8%; + --brand-360: hsl(var(--brand-360-hsl) / 1); + --brand-360-hsl: 235 calc(var(--saturation-factor, 1) * 86.1%) 77.5%; + --brand-400: hsl(var(--brand-400-hsl) / 1); + --brand-400-hsl: 235 calc(var(--saturation-factor, 1) * 86.1%) 71.8%; + --brand-430: hsl(var(--brand-430-hsl) / 1); + --brand-430-hsl: 235 calc(var(--saturation-factor, 1) * 85.7%) 69.8%; + --brand-460: hsl(var(--brand-460-hsl) / 1); + --brand-460-hsl: 235 calc(var(--saturation-factor, 1) * 85.5%) 67.5%; + --brand-500: hsl(var(--brand-500-hsl) / 1); + --brand-500-hsl: 235 calc(var(--saturation-factor, 1) * 85.6%) 64.7%; + --brand-530: hsl(var(--brand-530-hsl) / 1); + --brand-530-hsl: 235 calc(var(--saturation-factor, 1) * 66.7%) 58.8%; + --brand-560: hsl(var(--brand-560-hsl) / 1); + --brand-560-hsl: 235 calc(var(--saturation-factor, 1) * 51.4%) 52.4%; + --brand-600: hsl(var(--brand-600-hsl) / 1); + --brand-600-hsl: 235 calc(var(--saturation-factor, 1) * 46.7%) 44.1%; + --brand-630: hsl(var(--brand-630-hsl) / 1); + --brand-630-hsl: 235 calc(var(--saturation-factor, 1) * 46.7%) 38.2%; + --brand-660: hsl(var(--brand-660-hsl) / 1); + --brand-660-hsl: 235 calc(var(--saturation-factor, 1) * 47.1%) 33.3%; + --brand-700: hsl(var(--brand-700-hsl) / 1); + --brand-700-hsl: 235 calc(var(--saturation-factor, 1) * 47%) 25.9%; + --brand-730: hsl(var(--brand-730-hsl) / 1); + --brand-730-hsl: 235 calc(var(--saturation-factor, 1) * 46.8%) 24.3%; + --brand-760: hsl(var(--brand-760-hsl) / 1); + --brand-760-hsl: 234 calc(var(--saturation-factor, 1) * 46.9%) 22.2%; + --brand-800: hsl(var(--brand-800-hsl) / 1); + --brand-800-hsl: 235 calc(var(--saturation-factor, 1) * 47.5%) 19.4%; + --brand-830: hsl(var(--brand-830-hsl) / 1); + --brand-830-hsl: 235 calc(var(--saturation-factor, 1) * 47.4%) 14.9%; + --brand-860: hsl(var(--brand-860-hsl) / 1); + --brand-860-hsl: 235 calc(var(--saturation-factor, 1) * 46.9%) 9.6%; + --brand-900: hsl(var(--brand-900-hsl) / 1); + --brand-900-hsl: 233 calc(var(--saturation-factor, 1) * 50%) 3.1%; + --bungie: hsl(var(--bungie-hsl) / 1); + --bungie-hsl: 197 calc(var(--saturation-factor, 1) * 100%) 44.5%; + --crunchyroll: hsl(var(--crunchyroll-hsl) / 1); + --crunchyroll-hsl: 29 calc(var(--saturation-factor, 1) * 93%) 55.5%; + --discord-8th-bday-blue: hsl(var(--discord-8th-bday-blue-hsl) / 1); + --discord-8th-bday-blue-hsl: 234 calc(var(--saturation-factor, 1) * 93.1%) 65.7%; + --discord-8th-bday-dark-blue: hsl(var(--discord-8th-bday-dark-blue-hsl) / 1); + --discord-8th-bday-dark-blue-hsl: 235 calc(var(--saturation-factor, 1) * 73.7%) 53.7%; + --discord-8th-bday-green: hsl(var(--discord-8th-bday-green-hsl) / 1); + --discord-8th-bday-green-hsl: 79 calc(var(--saturation-factor, 1) * 100%) 46.9%; + --discord-8th-bday-light-blue: hsl(var(--discord-8th-bday-light-blue-hsl) / 1); + --discord-8th-bday-light-blue-hsl: 222 calc(var(--saturation-factor, 1) * 100%) 68.4%; + --discord-8th-bday-pink: hsl(var(--discord-8th-bday-pink-hsl) / 1); + --discord-8th-bday-pink-hsl: 316 calc(var(--saturation-factor, 1) * 100%) 66.1%; + --discord-8th-bday-purple: hsl(var(--discord-8th-bday-purple-hsl) / 1); + --discord-8th-bday-purple-hsl: 234 calc(var(--saturation-factor, 1) * 93.1%) 65.7%; + --discord-8th-bday-yellow: hsl(var(--discord-8th-bday-yellow-hsl) / 1); + --discord-8th-bday-yellow-hsl: 60 calc(var(--saturation-factor, 1) * 100%) 50%; + --ebay: hsl(var(--ebay-hsl) / 1); + --ebay-hsl: 211 calc(var(--saturation-factor, 1) * 100%) 41.2%; + --epic-games: hsl(var(--epic-games-hsl) / 1); + --epic-games-hsl: 34 calc(var(--saturation-factor, 1) * 6.2%) 22.2%; + --facebook: hsl(var(--facebook-hsl) / 1); + --facebook-hsl: 221 calc(var(--saturation-factor, 1) * 44.2%) 37.3%; + --github: hsl(var(--github-hsl) / 1); + --github-hsl: 0 calc(var(--saturation-factor, 1) * 4.2%) 9.4%; + --gold: hsl(var(--gold-hsl) / 1); + --gold-hsl: 46 calc(var(--saturation-factor, 1) * 100%) 54.9%; + --green-100: hsl(var(--green-100-hsl) / 1); + --green-100-hsl: 137 calc(var(--saturation-factor, 1) * 90%) 96.1%; + --green-130: hsl(var(--green-130-hsl) / 1); + --green-130-hsl: 137 calc(var(--saturation-factor, 1) * 94.1%) 93.3%; + --green-160: hsl(var(--green-160-hsl) / 1); + --green-160-hsl: 141 calc(var(--saturation-factor, 1) * 91.3%) 86.5%; + --green-200: hsl(var(--green-200-hsl) / 1); + --green-200-hsl: 143 calc(var(--saturation-factor, 1) * 93.5%) 75.9%; + --green-230: hsl(var(--green-230-hsl) / 1); + --green-230-hsl: 146 calc(var(--saturation-factor, 1) * 86.6%) 64.9%; + --green-260: hsl(var(--green-260-hsl) / 1); + --green-260-hsl: 146 calc(var(--saturation-factor, 1) * 75.1%) 59%; + --green-300: hsl(var(--green-300-hsl) / 1); + --green-300-hsl: 146 calc(var(--saturation-factor, 1) * 65.4%) 53.5%; + --green-330: hsl(var(--green-330-hsl) / 1); + --green-330-hsl: 146 calc(var(--saturation-factor, 1) * 63.1%) 47.8%; + --green-345: hsl(var(--green-345-hsl) / 1); + --green-345-hsl: 147 calc(var(--saturation-factor, 1) * 65.9%) 43.7%; + --green-360: hsl(var(--green-360-hsl) / 1); + --green-360-hsl: 145 calc(var(--saturation-factor, 1) * 65%) 39.2%; + --green-400: hsl(var(--green-400-hsl) / 1); + --green-400-hsl: 143 calc(var(--saturation-factor, 1) * 60.7%) 35.9%; + --green-430: hsl(var(--green-430-hsl) / 1); + --green-430-hsl: 142 calc(var(--saturation-factor, 1) * 56.1%) 32.2%; + --green-460: hsl(var(--green-460-hsl) / 1); + --green-460-hsl: 141 calc(var(--saturation-factor, 1) * 56.6%) 28%; + --green-500: hsl(var(--green-500-hsl) / 1); + --green-500-hsl: 141 calc(var(--saturation-factor, 1) * 58.4%) 24.5%; + --green-530: hsl(var(--green-530-hsl) / 1); + --green-530-hsl: 140 calc(var(--saturation-factor, 1) * 60.7%) 21%; + --green-560: hsl(var(--green-560-hsl) / 1); + --green-560-hsl: 139 calc(var(--saturation-factor, 1) * 61.7%) 18.4%; + --green-600: hsl(var(--green-600-hsl) / 1); + --green-600-hsl: 139 calc(var(--saturation-factor, 1) * 65.4%) 15.9%; + --green-630: hsl(var(--green-630-hsl) / 1); + --green-630-hsl: 140 calc(var(--saturation-factor, 1) * 66.7%) 14.1%; + --green-660: hsl(var(--green-660-hsl) / 1); + --green-660-hsl: 139 calc(var(--saturation-factor, 1) * 68.8%) 12.5%; + --green-700: hsl(var(--green-700-hsl) / 1); + --green-700-hsl: 141 calc(var(--saturation-factor, 1) * 74.1%) 10.6%; + --green-730: hsl(var(--green-730-hsl) / 1); + --green-730-hsl: 138 calc(var(--saturation-factor, 1) * 78.3%) 9%; + --green-760: hsl(var(--green-760-hsl) / 1); + --green-760-hsl: 140 calc(var(--saturation-factor, 1) * 84.6%) 7.6%; + --green-800: hsl(var(--green-800-hsl) / 1); + --green-800-hsl: 139 calc(var(--saturation-factor, 1) * 82.4%) 6.7%; + --green-830: hsl(var(--green-830-hsl) / 1); + --green-830-hsl: 138 calc(var(--saturation-factor, 1) * 80%) 5.9%; + --green-860: hsl(var(--green-860-hsl) / 1); + --green-860-hsl: 133 calc(var(--saturation-factor, 1) * 70.4%) 5.3%; + --green-900: hsl(var(--green-900-hsl) / 1); + --green-900-hsl: 129 calc(var(--saturation-factor, 1) * 58.3%) 4.7%; + --guild-boosting-blue: hsl(var(--guild-boosting-blue-hsl) / 1); + --guild-boosting-blue-hsl: 221 calc(var(--saturation-factor, 1) * 70%) 55.5%; + --guild-boosting-blue-for-gradients: hsl(var(--guild-boosting-blue-for-gradients-hsl) / 1); + --guild-boosting-blue-for-gradients-hsl: 235 calc(var(--saturation-factor, 1) * 68.5%) 52.7%; + --guild-boosting-pink: hsl(var(--guild-boosting-pink-hsl) / 1); + --guild-boosting-pink-hsl: 302 calc(var(--saturation-factor, 1) * 100%) 72.5%; + --guild-boosting-purple: hsl(var(--guild-boosting-purple-hsl) / 1); + --guild-boosting-purple-hsl: 269 calc(var(--saturation-factor, 1) * 83.8%) 71%; + --guild-boosting-purple-for-gradients: hsl(var(--guild-boosting-purple-for-gradients-hsl) / 1); + --guild-boosting-purple-for-gradients-hsl: 269 calc(var(--saturation-factor, 1) * 91.8%) 61.8%; + --hypesquad-house-1: hsl(var(--hypesquad-house-1-hsl) / 1); + --hypesquad-house-1-hsl: 253 calc(var(--saturation-factor, 1) * 77%) 72.7%; + --hypesquad-house-2: hsl(var(--hypesquad-house-2-hsl) / 1); + --hypesquad-house-2-hsl: 9 calc(var(--saturation-factor, 1) * 86.5%) 68%; + --hypesquad-house-3: hsl(var(--hypesquad-house-3-hsl) / 1); + --hypesquad-house-3-hsl: 169 calc(var(--saturation-factor, 1) * 69.1%) 56.9%; + --input-placeholder-text-dark: hsl(var(--input-placeholder-text-dark-hsl) / 1); + --input-placeholder-text-dark-hsl: 216 calc(var(--saturation-factor, 1) * 2.1%) 53.9%; + --lol: hsl(var(--lol-hsl) / 1); + --lol-hsl: 190 calc(var(--saturation-factor, 1) * 89.7%) 7.6%; + --orange-100: hsl(var(--orange-100-hsl) / 1); + --orange-100-hsl: 18 calc(var(--saturation-factor, 1) * 100%) 98%; + --orange-130: hsl(var(--orange-130-hsl) / 1); + --orange-130-hsl: 23 calc(var(--saturation-factor, 1) * 100%) 96.5%; + --orange-160: hsl(var(--orange-160-hsl) / 1); + --orange-160-hsl: 21 calc(var(--saturation-factor, 1) * 93.9%) 93.5%; + --orange-200: hsl(var(--orange-200-hsl) / 1); + --orange-200-hsl: 21 calc(var(--saturation-factor, 1) * 92.3%) 89.8%; + --orange-230: hsl(var(--orange-230-hsl) / 1); + --orange-230-hsl: 24 calc(var(--saturation-factor, 1) * 92.5%) 84.3%; + --orange-260: hsl(var(--orange-260-hsl) / 1); + --orange-260-hsl: 23 calc(var(--saturation-factor, 1) * 94.5%) 78.6%; + --orange-300: hsl(var(--orange-300-hsl) / 1); + --orange-300-hsl: 25 calc(var(--saturation-factor, 1) * 94.6%) 71.2%; + --orange-330: hsl(var(--orange-330-hsl) / 1); + --orange-330-hsl: 27 calc(var(--saturation-factor, 1) * 94.7%) 62.7%; + --orange-345: hsl(var(--orange-345-hsl) / 1); + --orange-345-hsl: 28 calc(var(--saturation-factor, 1) * 87.7%) 55.5%; + --orange-360: hsl(var(--orange-360-hsl) / 1); + --orange-360-hsl: 26 calc(var(--saturation-factor, 1) * 71.3%) 50.8%; + --orange-400: hsl(var(--orange-400-hsl) / 1); + --orange-400-hsl: 25 calc(var(--saturation-factor, 1) * 67.5%) 45.9%; + --orange-430: hsl(var(--orange-430-hsl) / 1); + --orange-430-hsl: 25 calc(var(--saturation-factor, 1) * 69.5%) 39.8%; + --orange-460: hsl(var(--orange-460-hsl) / 1); + --orange-460-hsl: 24 calc(var(--saturation-factor, 1) * 72.2%) 35.3%; + --orange-500: hsl(var(--orange-500-hsl) / 1); + --orange-500-hsl: 22 calc(var(--saturation-factor, 1) * 76.1%) 31.2%; + --orange-530: hsl(var(--orange-530-hsl) / 1); + --orange-530-hsl: 22 calc(var(--saturation-factor, 1) * 77%) 27.3%; + --orange-560: hsl(var(--orange-560-hsl) / 1); + --orange-560-hsl: 21 calc(var(--saturation-factor, 1) * 77.2%) 24.1%; + --orange-600: hsl(var(--orange-600-hsl) / 1); + --orange-600-hsl: 23 calc(var(--saturation-factor, 1) * 79.2%) 20.8%; + --orange-630: hsl(var(--orange-630-hsl) / 1); + --orange-630-hsl: 22 calc(var(--saturation-factor, 1) * 79.2%) 18.8%; + --orange-660: hsl(var(--orange-660-hsl) / 1); + --orange-660-hsl: 22 calc(var(--saturation-factor, 1) * 78.8%) 16.7%; + --orange-700: hsl(var(--orange-700-hsl) / 1); + --orange-700-hsl: 22 calc(var(--saturation-factor, 1) * 76.3%) 14.9%; + --orange-730: hsl(var(--orange-730-hsl) / 1); + --orange-730-hsl: 22 calc(var(--saturation-factor, 1) * 78.8%) 12.9%; + --orange-760: hsl(var(--orange-760-hsl) / 1); + --orange-760-hsl: 21 calc(var(--saturation-factor, 1) * 78.9%) 11.2%; + --orange-800: hsl(var(--orange-800-hsl) / 1); + --orange-800-hsl: 21 calc(var(--saturation-factor, 1) * 80%) 9.8%; + --orange-830: hsl(var(--orange-830-hsl) / 1); + --orange-830-hsl: 20 calc(var(--saturation-factor, 1) * 76.7%) 8.4%; + --orange-860: hsl(var(--orange-860-hsl) / 1); + --orange-860-hsl: 20 calc(var(--saturation-factor, 1) * 73%) 7.3%; + --orange-900: hsl(var(--orange-900-hsl) / 1); + --orange-900-hsl: 26 calc(var(--saturation-factor, 1) * 72.4%) 5.7%; + --partner: hsl(var(--partner-hsl) / 1); + --partner-hsl: 215 calc(var(--saturation-factor, 1) * 82.8%) 59%; + --paypal: hsl(var(--paypal-hsl) / 1); + --paypal-hsl: 230 calc(var(--saturation-factor, 1) * 69.8%) 24.7%; + --playstation: hsl(var(--playstation-hsl) / 1); + --playstation-hsl: 220 calc(var(--saturation-factor, 1) * 95.7%) 27.1%; + --plum-23-alpha: hsl(var(--plum-23-alpha-hsl) / 0.09); + --plum-23-alpha-hsl: 230 calc(var(--saturation-factor, 1) * 60.7%) 78%; + --plum-0: hsl(var(--plum-0-hsl) / 1); + --plum-0-hsl: 240 calc(var(--saturation-factor, 1) * 9.1%) 97.8%; + --plum-1: hsl(var(--plum-1-hsl) / 1); + --plum-1-hsl: 240 calc(var(--saturation-factor, 1) * 4.3%) 95.5%; + --plum-10: hsl(var(--plum-10-hsl) / 1); + --plum-10-hsl: 229 calc(var(--saturation-factor, 1) * 6.8%) 53.7%; + --plum-11: hsl(var(--plum-11-hsl) / 1); + --plum-11-hsl: 229 calc(var(--saturation-factor, 1) * 6.9%) 45.5%; + --plum-12: hsl(var(--plum-12-hsl) / 1); + --plum-12-hsl: 228 calc(var(--saturation-factor, 1) * 7.6%) 38.6%; + --plum-13: hsl(var(--plum-13-hsl) / 1); + --plum-13-hsl: 227 calc(var(--saturation-factor, 1) * 8.3%) 32.9%; + --plum-14: hsl(var(--plum-14-hsl) / 1); + --plum-14-hsl: 230 calc(var(--saturation-factor, 1) * 8.5%) 27.8%; + --plum-15: hsl(var(--plum-15-hsl) / 1); + --plum-15-hsl: 229 calc(var(--saturation-factor, 1) * 8.9%) 24.1%; + --plum-16: hsl(var(--plum-16-hsl) / 1); + --plum-16-hsl: 234 calc(var(--saturation-factor, 1) * 9.3%) 21.2%; + --plum-17: hsl(var(--plum-17-hsl) / 1); + --plum-17-hsl: 233 calc(var(--saturation-factor, 1) * 9.3%) 19%; + --plum-18: hsl(var(--plum-18-hsl) / 1); + --plum-18-hsl: 233 calc(var(--saturation-factor, 1) * 10.6%) 16.7%; + --plum-19: hsl(var(--plum-19-hsl) / 1); + --plum-19-hsl: 233 calc(var(--saturation-factor, 1) * 10.8%) 14.5%; + --plum-2: hsl(var(--plum-2-hsl) / 1); + --plum-2-hsl: 220 calc(var(--saturation-factor, 1) * 8.6%) 93.1%; + --plum-20: hsl(var(--plum-20-hsl) / 1); + --plum-20-hsl: 231 calc(var(--saturation-factor, 1) * 11.1%) 12.4%; + --plum-21: hsl(var(--plum-21-hsl) / 1); + --plum-21-hsl: 231 calc(var(--saturation-factor, 1) * 12.7%) 10.8%; + --plum-22: hsl(var(--plum-22-hsl) / 1); + --plum-22-hsl: 240 calc(var(--saturation-factor, 1) * 12%) 9.8%; + --plum-23: hsl(var(--plum-23-hsl) / 1); + --plum-23-hsl: 240 calc(var(--saturation-factor, 1) * 11.6%) 8.4%; + --plum-24: hsl(var(--plum-24-hsl) / 1); + --plum-24-hsl: 228 calc(var(--saturation-factor, 1) * 14.3%) 6.9%; + --plum-25: hsl(var(--plum-25-hsl) / 1); + --plum-25-hsl: 240 calc(var(--saturation-factor, 1) * 14.3%) 5.5%; + --plum-26: hsl(var(--plum-26-hsl) / 1); + --plum-26-hsl: 240 calc(var(--saturation-factor, 1) * 15.8%) 3.7%; + --plum-3: hsl(var(--plum-3-hsl) / 1); + --plum-3-hsl: 225 calc(var(--saturation-factor, 1) * 8%) 90.2%; + --plum-4: hsl(var(--plum-4-hsl) / 1); + --plum-4-hsl: 225 calc(var(--saturation-factor, 1) * 6.2%) 87.5%; + --plum-5: hsl(var(--plum-5-hsl) / 1); + --plum-5-hsl: 220 calc(var(--saturation-factor, 1) * 7.3%) 83.9%; + --plum-6: hsl(var(--plum-6-hsl) / 1); + --plum-6-hsl: 231 calc(var(--saturation-factor, 1) * 6.7%) 79.4%; + --plum-7: hsl(var(--plum-7-hsl) / 1); + --plum-7-hsl: 227 calc(var(--saturation-factor, 1) * 6.8%) 73.9%; + --plum-8: hsl(var(--plum-8-hsl) / 1); + --plum-8-hsl: 230 calc(var(--saturation-factor, 1) * 7.4%) 68.2%; + --plum-9: hsl(var(--plum-9-hsl) / 1); + --plum-9-hsl: 231 calc(var(--saturation-factor, 1) * 7.1%) 61.2%; + --premium-perk-blue: hsl(var(--premium-perk-blue-hsl) / 1); + --premium-perk-blue-hsl: 222 calc(var(--saturation-factor, 1) * 100%) 75.1%; + --premium-perk-blue-alt: hsl(var(--premium-perk-blue-alt-hsl) / 1); + --premium-perk-blue-alt-hsl: 223 calc(var(--saturation-factor, 1) * 100%) 80.6%; + --premium-perk-dark-blue: hsl(var(--premium-perk-dark-blue-hsl) / 1); + --premium-perk-dark-blue-hsl: 220 calc(var(--saturation-factor, 1) * 67.4%) 55.5%; + --premium-perk-gold: hsl(var(--premium-perk-gold-hsl) / 1); + --premium-perk-gold-hsl: 38 calc(var(--saturation-factor, 1) * 95.7%) 54.1%; + --premium-perk-green: hsl(var(--premium-perk-green-hsl) / 1); + --premium-perk-green-hsl: 164 calc(var(--saturation-factor, 1) * 55.1%) 69.4%; + --premium-perk-light-blue: hsl(var(--premium-perk-light-blue-hsl) / 1); + --premium-perk-light-blue-hsl: 221 calc(var(--saturation-factor, 1) * 100%) 84.1%; + --premium-perk-orange: hsl(var(--premium-perk-orange-hsl) / 1); + --premium-perk-orange-hsl: 25 calc(var(--saturation-factor, 1) * 96.7%) 64.1%; + --premium-perk-pink: hsl(var(--premium-perk-pink-hsl) / 1); + --premium-perk-pink-hsl: 305 calc(var(--saturation-factor, 1) * 100%) 75.1%; + --premium-perk-purple: hsl(var(--premium-perk-purple-hsl) / 1); + --premium-perk-purple-hsl: 272 calc(var(--saturation-factor, 1) * 100%) 80.2%; + --premium-perk-yellow: hsl(var(--premium-perk-yellow-hsl) / 1); + --premium-perk-yellow-hsl: 47 calc(var(--saturation-factor, 1) * 98.9%) 63.9%; + --premium-tier-0-blue: hsl(var(--premium-tier-0-blue-hsl) / 1); + --premium-tier-0-blue-hsl: 202 calc(var(--saturation-factor, 1) * 100%) 38%; + --premium-tier-0-blue-for-gradients: hsl(var(--premium-tier-0-blue-for-gradients-hsl) / 1); + --premium-tier-0-blue-for-gradients-hsl: 202 calc(var(--saturation-factor, 1) * 100%) 38%; + --premium-tier-0-blue-for-gradients-2: hsl(var(--premium-tier-0-blue-for-gradients-2-hsl) / 1); + --premium-tier-0-blue-for-gradients-2-hsl: 209 calc(var(--saturation-factor, 1) * 80%) 45.1%; + --premium-tier-0-header-gradient-1: hsl(var(--premium-tier-0-header-gradient-1-hsl) / 1); + --premium-tier-0-header-gradient-1-hsl: 240 calc(var(--saturation-factor, 1) * 55.2%) 47.3%; + --premium-tier-0-header-gradient-2: hsl(var(--premium-tier-0-header-gradient-2-hsl) / 1); + --premium-tier-0-header-gradient-2-hsl: 224 calc(var(--saturation-factor, 1) * 77.9%) 59.2%; + --premium-tier-0-header-gradient-3: hsl(var(--premium-tier-0-header-gradient-3-hsl) / 1); + --premium-tier-0-header-gradient-3-hsl: 246 calc(var(--saturation-factor, 1) * 74.4%) 69.4%; + --premium-tier-0-header-gradient-4: hsl(var(--premium-tier-0-header-gradient-4-hsl) / 1); + --premium-tier-0-header-gradient-4-hsl: 295 calc(var(--saturation-factor, 1) * 79.9%) 72.7%; + --premium-tier-0-header-gradient-5: hsl(var(--premium-tier-0-header-gradient-5-hsl) / 1); + --premium-tier-0-header-gradient-5-hsl: 336 calc(var(--saturation-factor, 1) * 55.2%) 72%; + --premium-tier-0-purple: hsl(var(--premium-tier-0-purple-hsl) / 1); + --premium-tier-0-purple-hsl: 235 calc(var(--saturation-factor, 1) * 85.6%) 64.7%; + --premium-tier-0-purple-for-gradients: hsl(var(--premium-tier-0-purple-for-gradients-hsl) / 1); + --premium-tier-0-purple-for-gradients-hsl: 235 calc(var(--saturation-factor, 1) * 85.6%) 64.7%; + --premium-tier-1-blue: hsl(var(--premium-tier-1-blue-hsl) / 1); + --premium-tier-1-blue-hsl: 228 calc(var(--saturation-factor, 1) * 86.7%) 70.6%; + --premium-tier-1-blue-for-gradients: hsl(var(--premium-tier-1-blue-for-gradients-hsl) / 1); + --premium-tier-1-blue-for-gradients-hsl: 235 calc(var(--saturation-factor, 1) * 85.6%) 64.7%; + --premium-tier-1-dark-blue-for-gradients: hsl(var(--premium-tier-1-dark-blue-for-gradients-hsl) / 1); + --premium-tier-1-dark-blue-for-gradients-hsl: 235 calc(var(--saturation-factor, 1) * 68.5%) 52.7%; + --premium-tier-1-purple: hsl(var(--premium-tier-1-purple-hsl) / 1); + --premium-tier-1-purple-hsl: 244 calc(var(--saturation-factor, 1) * 100%) 84.1%; + --premium-tier-2-pink: hsl(var(--premium-tier-2-pink-hsl) / 1); + --premium-tier-2-pink-hsl: 342 calc(var(--saturation-factor, 1) * 58%) 72.9%; + --premium-tier-2-pink-for-gradients: hsl(var(--premium-tier-2-pink-for-gradients-hsl) / 1); + --premium-tier-2-pink-for-gradients-hsl: 325 calc(var(--saturation-factor, 1) * 31.7%) 51.8%; + --premium-tier-2-pink-for-gradients-2: hsl(var(--premium-tier-2-pink-for-gradients-2-hsl) / 1); + --premium-tier-2-pink-for-gradients-2-hsl: 295 calc(var(--saturation-factor, 1) * 51.4%) 50%; + --premium-tier-2-purple: hsl(var(--premium-tier-2-purple-hsl) / 1); + --premium-tier-2-purple-hsl: 270 calc(var(--saturation-factor, 1) * 86.7%) 70.6%; + --premium-tier-2-purple-for-gradients: hsl(var(--premium-tier-2-purple-for-gradients-hsl) / 1); + --premium-tier-2-purple-for-gradients-hsl: 269 calc(var(--saturation-factor, 1) * 52.7%) 52.7%; + --premium-tier-2-purple-for-gradients-2: hsl(var(--premium-tier-2-purple-for-gradients-2-hsl) / 1); + --premium-tier-2-purple-for-gradients-2-hsl: 296 calc(var(--saturation-factor, 1) * 50%) 51.4%; + --primary-100: hsl(var(--primary-100-hsl) / 1); + --primary-100-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 97.6%; + --primary-130: hsl(var(--primary-130-hsl) / 1); + --primary-130-hsl: 220 calc(var(--saturation-factor, 1) * 13%) 95.5%; + --primary-160: hsl(var(--primary-160-hsl) / 1); + --primary-160-hsl: 210 calc(var(--saturation-factor, 1) * 11.1%) 92.9%; + --primary-200: hsl(var(--primary-200-hsl) / 1); + --primary-200-hsl: 216 calc(var(--saturation-factor, 1) * 9.8%) 90%; + --primary-230: hsl(var(--primary-230-hsl) / 1); + --primary-230-hsl: 210 calc(var(--saturation-factor, 1) * 9.1%) 87.1%; + --primary-260: hsl(var(--primary-260-hsl) / 1); + --primary-260-hsl: 214 calc(var(--saturation-factor, 1) * 8.4%) 83.7%; + --primary-300: hsl(var(--primary-300-hsl) / 1); + --primary-300-hsl: 210 calc(var(--saturation-factor, 1) * 9.3%) 78.8%; + --primary-330: hsl(var(--primary-330-hsl) / 1); + --primary-330-hsl: 215 calc(var(--saturation-factor, 1) * 8.8%) 73.3%; + --primary-345: hsl(var(--primary-345-hsl) / 1); + --primary-345-hsl: 214 calc(var(--saturation-factor, 1) * 8.4%) 67.5%; + --primary-360: hsl(var(--primary-360-hsl) / 1); + --primary-360-hsl: 214 calc(var(--saturation-factor, 1) * 8.1%) 61.2%; + --primary-400: hsl(var(--primary-400-hsl) / 1); + --primary-400-hsl: 223 calc(var(--saturation-factor, 1) * 5.8%) 52.9%; + --primary-430: hsl(var(--primary-430-hsl) / 1); + --primary-430-hsl: 229 calc(var(--saturation-factor, 1) * 4.8%) 44.9%; + --primary-460: hsl(var(--primary-460-hsl) / 1); + --primary-460-hsl: 228 calc(var(--saturation-factor, 1) * 5.2%) 38%; + --primary-500: hsl(var(--primary-500-hsl) / 1); + --primary-500-hsl: 228 calc(var(--saturation-factor, 1) * 6%) 32.5%; + --primary-530: hsl(var(--primary-530-hsl) / 1); + --primary-530-hsl: 227 calc(var(--saturation-factor, 1) * 6.5%) 27.3%; + --primary-560: hsl(var(--primary-560-hsl) / 1); + --primary-560-hsl: 225 calc(var(--saturation-factor, 1) * 6.7%) 23.5%; + --primary-600: hsl(var(--primary-600-hsl) / 1); + --primary-600-hsl: 223 calc(var(--saturation-factor, 1) * 6.7%) 20.6%; + --primary-630: hsl(var(--primary-630-hsl) / 1); + --primary-630-hsl: 220 calc(var(--saturation-factor, 1) * 6.5%) 18%; + --primary-645: hsl(var(--primary-645-hsl) / 1); + --primary-645-hsl: 220 calc(var(--saturation-factor, 1) * 7%) 16.9%; + --primary-660: hsl(var(--primary-660-hsl) / 1); + --primary-660-hsl: 228 calc(var(--saturation-factor, 1) * 6.7%) 14.7%; + --primary-700: hsl(var(--primary-700-hsl) / 1); + --primary-700-hsl: 225 calc(var(--saturation-factor, 1) * 6.3%) 12.5%; + --primary-730: hsl(var(--primary-730-hsl) / 1); + --primary-730-hsl: 225 calc(var(--saturation-factor, 1) * 7.1%) 11%; + --primary-760: hsl(var(--primary-760-hsl) / 1); + --primary-760-hsl: 220 calc(var(--saturation-factor, 1) * 6.4%) 9.2%; + --primary-800: hsl(var(--primary-800-hsl) / 1); + --primary-800-hsl: 220 calc(var(--saturation-factor, 1) * 8.1%) 7.3%; + --primary-830: hsl(var(--primary-830-hsl) / 1); + --primary-830-hsl: 240 calc(var(--saturation-factor, 1) * 4%) 4.9%; + --primary-860: hsl(var(--primary-860-hsl) / 1); + --primary-860-hsl: 240 calc(var(--saturation-factor, 1) * 7.7%) 2.5%; + --primary-900: hsl(var(--primary-900-hsl) / 1); + --primary-900-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0.8%; + --red-100: hsl(var(--red-100-hsl) / 1); + --red-100-hsl: 350 calc(var(--saturation-factor, 1) * 75%) 98.4%; + --red-130: hsl(var(--red-130-hsl) / 1); + --red-130-hsl: 0 calc(var(--saturation-factor, 1) * 83.3%) 97.6%; + --red-160: hsl(var(--red-160-hsl) / 1); + --red-160-hsl: 0 calc(var(--saturation-factor, 1) * 90.9%) 95.7%; + --red-200: hsl(var(--red-200-hsl) / 1); + --red-200-hsl: 358 calc(var(--saturation-factor, 1) * 88.9%) 92.9%; + --red-230: hsl(var(--red-230-hsl) / 1); + --red-230-hsl: 359 calc(var(--saturation-factor, 1) * 85.2%) 89.4%; + --red-260: hsl(var(--red-260-hsl) / 1); + --red-260-hsl: 359 calc(var(--saturation-factor, 1) * 89%) 85.7%; + --red-300: hsl(var(--red-300-hsl) / 1); + --red-300-hsl: 359 calc(var(--saturation-factor, 1) * 91.4%) 81.8%; + --red-330: hsl(var(--red-330-hsl) / 1); + --red-330-hsl: 359 calc(var(--saturation-factor, 1) * 91.3%) 77.5%; + --red-345: hsl(var(--red-345-hsl) / 1); + --red-345-hsl: 358 calc(var(--saturation-factor, 1) * 92.9%) 72.4%; + --red-360: hsl(var(--red-360-hsl) / 1); + --red-360-hsl: 358 calc(var(--saturation-factor, 1) * 91.8%) 66.5%; + --red-400: hsl(var(--red-400-hsl) / 1); + --red-400-hsl: 359 calc(var(--saturation-factor, 1) * 87.3%) 59.8%; + --red-430: hsl(var(--red-430-hsl) / 1); + --red-430-hsl: 358 calc(var(--saturation-factor, 1) * 68.8%) 53.5%; + --red-460: hsl(var(--red-460-hsl) / 1); + --red-460-hsl: 359 calc(var(--saturation-factor, 1) * 59.1%) 46.1%; + --red-500: hsl(var(--red-500-hsl) / 1); + --red-500-hsl: 360 calc(var(--saturation-factor, 1) * 60.2%) 39.4%; + --red-530: hsl(var(--red-530-hsl) / 1); + --red-530-hsl: 359 calc(var(--saturation-factor, 1) * 63.4%) 34.3%; + --red-560: hsl(var(--red-560-hsl) / 1); + --red-560-hsl: 359 calc(var(--saturation-factor, 1) * 63.9%) 30.4%; + --red-600: hsl(var(--red-600-hsl) / 1); + --red-600-hsl: 359 calc(var(--saturation-factor, 1) * 64.7%) 26.7%; + --red-630: hsl(var(--red-630-hsl) / 1); + --red-630-hsl: 359 calc(var(--saturation-factor, 1) * 65.6%) 23.9%; + --red-660: hsl(var(--red-660-hsl) / 1); + --red-660-hsl: 359 calc(var(--saturation-factor, 1) * 65.1%) 21.4%; + --red-700: hsl(var(--red-700-hsl) / 1); + --red-700-hsl: 358 calc(var(--saturation-factor, 1) * 66.7%) 18.8%; + --red-730: hsl(var(--red-730-hsl) / 1); + --red-730-hsl: 359 calc(var(--saturation-factor, 1) * 66.7%) 16.5%; + --red-760: hsl(var(--red-760-hsl) / 1); + --red-760-hsl: 359 calc(var(--saturation-factor, 1) * 70.3%) 14.5%; + --red-800: hsl(var(--red-800-hsl) / 1); + --red-800-hsl: 359 calc(var(--saturation-factor, 1) * 68.8%) 12.5%; + --red-830: hsl(var(--red-830-hsl) / 1); + --red-830-hsl: 358 calc(var(--saturation-factor, 1) * 67.3%) 10.8%; + --red-860: hsl(var(--red-860-hsl) / 1); + --red-860-hsl: 0 calc(var(--saturation-factor, 1) * 66.7%) 9.4%; + --red-900: hsl(var(--red-900-hsl) / 1); + --red-900-hsl: 0 calc(var(--saturation-factor, 1) * 70%) 7.8%; + --reddit: hsl(var(--reddit-hsl) / 1); + --reddit-hsl: 16 calc(var(--saturation-factor, 1) * 100%) 50%; + --riot-games: hsl(var(--riot-games-hsl) / 1); + --riot-games-hsl: 349 calc(var(--saturation-factor, 1) * 100%) 45.9%; + --role-blue: hsl(var(--role-blue-hsl) / 1); + --role-blue-hsl: 204 calc(var(--saturation-factor, 1) * 64.4%) 35.3%; + --role-brown: hsl(var(--role-brown-hsl) / 1); + --role-brown-hsl: 24 calc(var(--saturation-factor, 1) * 100%) 32.9%; + --role-burgundy: hsl(var(--role-burgundy-hsl) / 1); + --role-burgundy-hsl: 334 calc(var(--saturation-factor, 1) * 79.3%) 37.8%; + --role-dark-blue: hsl(var(--role-dark-blue-hsl) / 1); + --role-dark-blue-hsl: 199 calc(var(--saturation-factor, 1) * 18.4%) 40.4%; + --role-dark-grey: hsl(var(--role-dark-grey-hsl) / 1); + --role-dark-grey-hsl: 200 calc(var(--saturation-factor, 1) * 18.3%) 46.1%; + --role-dark-purple: hsl(var(--role-dark-purple-hsl) / 1); + --role-dark-purple-hsl: 282 calc(var(--saturation-factor, 1) * 43.7%) 37.6%; + --role-dark-teal: hsl(var(--role-dark-teal-hsl) / 1); + --role-dark-teal-hsl: 168 calc(var(--saturation-factor, 1) * 76.6%) 28.4%; + --role-default: hsl(var(--role-default-hsl) / 1); + --role-default-hsl: 204 calc(var(--saturation-factor, 1) * 15.9%) 65.5%; + --role-green: hsl(var(--role-green-hsl) / 1); + --role-green-hsl: 145 calc(var(--saturation-factor, 1) * 63.5%) 33.3%; + --role-grey: hsl(var(--role-grey-hsl) / 1); + --role-grey-hsl: 202 calc(var(--saturation-factor, 1) * 4%) 60.8%; + --role-light-blue: hsl(var(--role-light-blue-hsl) / 1); + --role-light-blue-hsl: 204 calc(var(--saturation-factor, 1) * 15.9%) 65.5%; + --role-light-green: hsl(var(--role-light-green-hsl) / 1); + --role-light-green-hsl: 145 calc(var(--saturation-factor, 1) * 63.2%) 49%; + --role-light-grey: hsl(var(--role-light-grey-hsl) / 1); + --role-light-grey-hsl: 184 calc(var(--saturation-factor, 1) * 8.7%) 61.8%; + --role-magenta: hsl(var(--role-magenta-hsl) / 1); + --role-magenta-hsl: 340 calc(var(--saturation-factor, 1) * 82.2%) 51.6%; + --role-orange: hsl(var(--role-orange-hsl) / 1); + --role-orange-hsl: 28 calc(var(--saturation-factor, 1) * 79.7%) 51.8%; + --role-purple: hsl(var(--role-purple-hsl) / 1); + --role-purple-hsl: 283 calc(var(--saturation-factor, 1) * 38.9%) 53.1%; + --role-salmon: hsl(var(--role-salmon-hsl) / 1); + --role-salmon-hsl: 6 calc(var(--saturation-factor, 1) * 78.1%) 57.1%; + --role-sky-blue: hsl(var(--role-sky-blue-hsl) / 1); + --role-sky-blue-hsl: 204 calc(var(--saturation-factor, 1) * 69.9%) 53.1%; + --role-tan: hsl(var(--role-tan-hsl) / 1); + --role-tan-hsl: 37 calc(var(--saturation-factor, 1) * 86.5%) 40.8%; + --role-teal: hsl(var(--role-teal-hsl) / 1); + --role-teal-hsl: 168 calc(var(--saturation-factor, 1) * 75.7%) 42%; + --role-terracotta: hsl(var(--role-terracotta-hsl) / 1); + --role-terracotta-hsl: 6 calc(var(--saturation-factor, 1) * 63.6%) 36.7%; + --role-yellow: hsl(var(--role-yellow-hsl) / 1); + --role-yellow-hsl: 48 calc(var(--saturation-factor, 1) * 89%) 50.2%; + --samsung: hsl(var(--samsung-hsl) / 1); + --samsung-hsl: 231 calc(var(--saturation-factor, 1) * 77.8%) 35.3%; + --skype: hsl(var(--skype-hsl) / 1); + --skype-hsl: 196 calc(var(--saturation-factor, 1) * 100%) 42.2%; + --spotify: hsl(var(--spotify-hsl) / 1); + --spotify-hsl: 141 calc(var(--saturation-factor, 1) * 72.9%) 42%; + --steam: hsl(var(--steam-hsl) / 1); + --steam-hsl: 215 calc(var(--saturation-factor, 1) * 35.1%) 14.5%; + --teal-100: hsl(var(--teal-100-hsl) / 1); + --teal-100-hsl: 193 calc(var(--saturation-factor, 1) * 69.2%) 97.5%; + --teal-130: hsl(var(--teal-130-hsl) / 1); + --teal-130-hsl: 192 calc(var(--saturation-factor, 1) * 83.3%) 95.3%; + --teal-160: hsl(var(--teal-160-hsl) / 1); + --teal-160-hsl: 190 calc(var(--saturation-factor, 1) * 83.3%) 90.6%; + --teal-200: hsl(var(--teal-200-hsl) / 1); + --teal-200-hsl: 188 calc(var(--saturation-factor, 1) * 85.7%) 83.5%; + --teal-230: hsl(var(--teal-230-hsl) / 1); + --teal-230-hsl: 188 calc(var(--saturation-factor, 1) * 88.3%) 73.1%; + --teal-260: hsl(var(--teal-260-hsl) / 1); + --teal-260-hsl: 188 calc(var(--saturation-factor, 1) * 81.9%) 65.3%; + --teal-300: hsl(var(--teal-300-hsl) / 1); + --teal-300-hsl: 189 calc(var(--saturation-factor, 1) * 72.8%) 58.2%; + --teal-330: hsl(var(--teal-330-hsl) / 1); + --teal-330-hsl: 189 calc(var(--saturation-factor, 1) * 65.6%) 52.2%; + --teal-345: hsl(var(--teal-345-hsl) / 1); + --teal-345-hsl: 190 calc(var(--saturation-factor, 1) * 62.8%) 48.4%; + --teal-360: hsl(var(--teal-360-hsl) / 1); + --teal-360-hsl: 190 calc(var(--saturation-factor, 1) * 64%) 43.5%; + --teal-400: hsl(var(--teal-400-hsl) / 1); + --teal-400-hsl: 190 calc(var(--saturation-factor, 1) * 63.5%) 38.6%; + --teal-430: hsl(var(--teal-430-hsl) / 1); + --teal-430-hsl: 190 calc(var(--saturation-factor, 1) * 63%) 33.9%; + --teal-460: hsl(var(--teal-460-hsl) / 1); + --teal-460-hsl: 191 calc(var(--saturation-factor, 1) * 64.2%) 29.6%; + --teal-500: hsl(var(--teal-500-hsl) / 1); + --teal-500-hsl: 190 calc(var(--saturation-factor, 1) * 65.2%) 25.9%; + --teal-530: hsl(var(--teal-530-hsl) / 1); + --teal-530-hsl: 190 calc(var(--saturation-factor, 1) * 66.7%) 22.4%; + --teal-560: hsl(var(--teal-560-hsl) / 1); + --teal-560-hsl: 190 calc(var(--saturation-factor, 1) * 69.7%) 19.4%; + --teal-600: hsl(var(--teal-600-hsl) / 1); + --teal-600-hsl: 189 calc(var(--saturation-factor, 1) * 71.8%) 16.7%; + --teal-630: hsl(var(--teal-630-hsl) / 1); + --teal-630-hsl: 190 calc(var(--saturation-factor, 1) * 73.7%) 14.9%; + --teal-660: hsl(var(--teal-660-hsl) / 1); + --teal-660-hsl: 188 calc(var(--saturation-factor, 1) * 75.8%) 12.9%; + --teal-700: hsl(var(--teal-700-hsl) / 1); + --teal-700-hsl: 189 calc(var(--saturation-factor, 1) * 79.3%) 11.4%; + --teal-730: hsl(var(--teal-730-hsl) / 1); + --teal-730-hsl: 189 calc(var(--saturation-factor, 1) * 80%) 9.8%; + --teal-760: hsl(var(--teal-760-hsl) / 1); + --teal-760-hsl: 189 calc(var(--saturation-factor, 1) * 81.4%) 8.4%; + --teal-800: hsl(var(--teal-800-hsl) / 1); + --teal-800-hsl: 188 calc(var(--saturation-factor, 1) * 83.3%) 7.1%; + --teal-830: hsl(var(--teal-830-hsl) / 1); + --teal-830-hsl: 189 calc(var(--saturation-factor, 1) * 87.1%) 6.1%; + --teal-860: hsl(var(--teal-860-hsl) / 1); + --teal-860-hsl: 188 calc(var(--saturation-factor, 1) * 85.2%) 5.3%; + --teal-900: hsl(var(--teal-900-hsl) / 1); + --teal-900-hsl: 189 calc(var(--saturation-factor, 1) * 90.9%) 4.3%; + --transparent: hsl(var(--transparent-hsl) / 0); + --transparent-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%; + --twitch: hsl(var(--twitch-hsl) / 1); + --twitch-hsl: 262 calc(var(--saturation-factor, 1) * 46.8%) 39.8%; + --twitter: hsl(var(--twitter-hsl) / 1); + --twitter-hsl: 203 calc(var(--saturation-factor, 1) * 89.1%) 53.1%; + --white-100: hsl(var(--white-100-hsl) / 1); + --white-100-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-130: hsl(var(--white-130-hsl) / 1); + --white-130-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-160: hsl(var(--white-160-hsl) / 1); + --white-160-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-200: hsl(var(--white-200-hsl) / 1); + --white-200-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-230: hsl(var(--white-230-hsl) / 1); + --white-230-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-260: hsl(var(--white-260-hsl) / 1); + --white-260-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-300: hsl(var(--white-300-hsl) / 1); + --white-300-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-330: hsl(var(--white-330-hsl) / 1); + --white-330-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-345: hsl(var(--white-345-hsl) / 1); + --white-345-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-360: hsl(var(--white-360-hsl) / 1); + --white-360-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-400: hsl(var(--white-400-hsl) / 1); + --white-400-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-430: hsl(var(--white-430-hsl) / 1); + --white-430-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-460: hsl(var(--white-460-hsl) / 1); + --white-460-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-500: hsl(var(--white-500-hsl) / 1); + --white-500-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%; + --white-530: hsl(var(--white-530-hsl) / 1); + --white-530-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 91%; + --white-560: hsl(var(--white-560-hsl) / 1); + --white-560-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 81.2%; + --white-600: hsl(var(--white-600-hsl) / 1); + --white-600-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 67.8%; + --white-630: hsl(var(--white-630-hsl) / 1); + --white-630-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 58.8%; + --white-660: hsl(var(--white-660-hsl) / 1); + --white-660-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 51.4%; + --white-700: hsl(var(--white-700-hsl) / 1); + --white-700-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 40%; + --white-730: hsl(var(--white-730-hsl) / 1); + --white-730-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 37.3%; + --white-760: hsl(var(--white-760-hsl) / 1); + --white-760-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 34.5%; + --white-800: hsl(var(--white-800-hsl) / 1); + --white-800-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 30.2%; + --white-830: hsl(var(--white-830-hsl) / 1); + --white-830-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 23.1%; + --white-860: hsl(var(--white-860-hsl) / 1); + --white-860-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 14.9%; + --white-900: hsl(var(--white-900-hsl) / 1); + --white-900-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 5.1%; + --xbox: hsl(var(--xbox-hsl) / 1); + --xbox-hsl: 120 calc(var(--saturation-factor, 1) * 77.1%) 27.5%; + --yellow-100: hsl(var(--yellow-100-hsl) / 1); + --yellow-100-hsl: 34 calc(var(--saturation-factor, 1) * 100%) 96.9%; + --yellow-130: hsl(var(--yellow-130-hsl) / 1); + --yellow-130-hsl: 31 calc(var(--saturation-factor, 1) * 100%) 95.5%; + --yellow-160: hsl(var(--yellow-160-hsl) / 1); + --yellow-160-hsl: 33 calc(var(--saturation-factor, 1) * 100%) 91.4%; + --yellow-200: hsl(var(--yellow-200-hsl) / 1); + --yellow-200-hsl: 35 calc(var(--saturation-factor, 1) * 97.3%) 85.5%; + --yellow-230: hsl(var(--yellow-230-hsl) / 1); + --yellow-230-hsl: 37 calc(var(--saturation-factor, 1) * 96.6%) 77.1%; + --yellow-260: hsl(var(--yellow-260-hsl) / 1); + --yellow-260-hsl: 41 calc(var(--saturation-factor, 1) * 96.8%) 62.9%; + --yellow-300: hsl(var(--yellow-300-hsl) / 1); + --yellow-300-hsl: 40 calc(var(--saturation-factor, 1) * 86.4%) 56.9%; + --yellow-330: hsl(var(--yellow-330-hsl) / 1); + --yellow-330-hsl: 40 calc(var(--saturation-factor, 1) * 75.3%) 52.4%; + --yellow-345: hsl(var(--yellow-345-hsl) / 1); + --yellow-345-hsl: 40 calc(var(--saturation-factor, 1) * 71%) 48.6%; + --yellow-360: hsl(var(--yellow-360-hsl) / 1); + --yellow-360-hsl: 39 calc(var(--saturation-factor, 1) * 74.4%) 42.9%; + --yellow-400: hsl(var(--yellow-400-hsl) / 1); + --yellow-400-hsl: 38 calc(var(--saturation-factor, 1) * 78.6%) 38.4%; + --yellow-430: hsl(var(--yellow-430-hsl) / 1); + --yellow-430-hsl: 37 calc(var(--saturation-factor, 1) * 84.4%) 32.7%; + --yellow-460: hsl(var(--yellow-460-hsl) / 1); + --yellow-460-hsl: 36 calc(var(--saturation-factor, 1) * 87.8%) 28.8%; + --yellow-500: hsl(var(--yellow-500-hsl) / 1); + --yellow-500-hsl: 36 calc(var(--saturation-factor, 1) * 93.8%) 25.1%; + --yellow-530: hsl(var(--yellow-530-hsl) / 1); + --yellow-530-hsl: 35 calc(var(--saturation-factor, 1) * 92.9%) 22.2%; + --yellow-560: hsl(var(--yellow-560-hsl) / 1); + --yellow-560-hsl: 34 calc(var(--saturation-factor, 1) * 94%) 19.6%; + --yellow-600: hsl(var(--yellow-600-hsl) / 1); + --yellow-600-hsl: 35 calc(var(--saturation-factor, 1) * 93.1%) 17.1%; + --yellow-630: hsl(var(--yellow-630-hsl) / 1); + --yellow-630-hsl: 35 calc(var(--saturation-factor, 1) * 92.4%) 15.5%; + --yellow-660: hsl(var(--yellow-660-hsl) / 1); + --yellow-660-hsl: 35 calc(var(--saturation-factor, 1) * 91.4%) 13.7%; + --yellow-700: hsl(var(--yellow-700-hsl) / 1); + --yellow-700-hsl: 34 calc(var(--saturation-factor, 1) * 90.3%) 12.2%; + --yellow-730: hsl(var(--yellow-730-hsl) / 1); + --yellow-730-hsl: 33 calc(var(--saturation-factor, 1) * 92.7%) 10.8%; + --yellow-760: hsl(var(--yellow-760-hsl) / 1); + --yellow-760-hsl: 33 calc(var(--saturation-factor, 1) * 91.7%) 9.4%; + --yellow-800: hsl(var(--yellow-800-hsl) / 1); + --yellow-800-hsl: 32 calc(var(--saturation-factor, 1) * 90.2%) 8%; + --yellow-830: hsl(var(--yellow-830-hsl) / 1); + --yellow-830-hsl: 32 calc(var(--saturation-factor, 1) * 88.9%) 7.1%; + --yellow-860: hsl(var(--yellow-860-hsl) / 1); + --yellow-860-hsl: 32 calc(var(--saturation-factor, 1) * 86.7%) 5.9%; + --yellow-900: hsl(var(--yellow-900-hsl) / 1); + --yellow-900-hsl: 36 calc(var(--saturation-factor, 1) * 83.3%) 4.7%; + --youtube: hsl(var(--youtube-hsl) / 1); + --youtube-hsl: 0 calc(var(--saturation-factor, 1) * 72.8%) 46.1% +} + +.theme-dark { + --action-sheet-gradient-bg: var(--primary-630); + --activity-card-background: var(--primary-700); + --activity-card-icon-overlay: hsl(var(--primary-600-hsl) / 0.85); + --alert-bg: var(--primary-600); + --android-navigation-bar-background: var(--primary-830); + --android-navigation-scrim-background: hsl(var(--primary-830-hsl) / 0.5); + --android-ripple: hsl(var(--white-500-hsl) / 0.07); + --background-accent: var(--primary-530); + --background-floating: var(--primary-800); + --background-mentioned: hsl(var(--yellow-300-hsl) / 0.1); + --background-mentioned-hover: hsl(var(--yellow-300-hsl) / 0.08); + --background-message-automod: hsl(var(--red-400-hsl) / 0.05); + --background-message-automod-hover: hsl(var(--red-400-hsl) / 0.1); + --background-message-highlight: hsl(var(--brand-360-hsl) / 0.08); + --background-message-highlight-hover: hsl(var(--brand-360-hsl) / 0.06); + --background-message-hover: hsl(var(--primary-900-hsl) / 0.06); + --background-mobile-primary: var(--primary-600); + --background-mobile-secondary: var(--primary-630); + --background-modifier-accent: hsl(var(--primary-500-hsl) / 0.48); + --background-modifier-accent-2: hsl(var(--primary-500-hsl) / 0.48); + --background-modifier-active: hsl(var(--primary-500-hsl) / 0.48); + --background-modifier-hover: hsl(var(--primary-500-hsl) / 0.3); + --background-modifier-selected: hsl(var(--primary-500-hsl) / 0.6); + --background-nested-floating: var(--primary-630); + --background-primary: var(--primary-600); + --background-secondary: var(--primary-630); + --background-secondary-alt: var(--primary-660); + --background-tertiary: var(--primary-700); + --bg-backdrop: hsl(var(--black-500-hsl) / 0.7); + --bg-backdrop-no-opacity: var(--black-500); + --bg-base-primary: var(--primary-600); + --bg-base-secondary: var(--primary-630); + --bg-base-tertiary: var(--primary-660); + --bg-brand: var(--brand-500); + --bg-mod-faint: hsl(var(--primary-500-hsl) / 0.3); + --bg-mod-strong: hsl(var(--primary-500-hsl) / 0.54); + --bg-mod-subtle: hsl(var(--primary-500-hsl) / 0.48); + --bg-surface-overlay: var(--primary-800); + --bg-surface-overlay-tmp: var(--primary-800); + --bg-surface-raised: var(--primary-600); + --black: var(--black-500); + --blur-fallback: hsl(var(--primary-700-hsl) / 0.96); + --blur-fallback-pressed: hsl(var(--primary-730-hsl) / 0.96); + --border-faint: hsl(var(--white-500-hsl) / 0.03); + --border-strong: hsl(var(--white-500-hsl) / 0.16); + --border-subtle: hsl(var(--white-500-hsl) / 0.08); + --bug-reporter-modal-submitting-background: hsl(var(--primary-800-hsl) / 0.6); + --button-creator-revenue-background: var(--teal-430); + --button-danger-background: var(--red-430); + --button-danger-background-active: var(--red-530); + --button-danger-background-disabled: var(--red-430); + --button-danger-background-hover: var(--red-500); + --button-outline-brand-background: hsl(var(--white-500-hsl) / 0); + --button-outline-brand-background-active: var(--brand-560); + --button-outline-brand-background-hover: var(--brand-500); + --button-outline-brand-border: var(--brand-500); + --button-outline-brand-border-active: var(--brand-560); + --button-outline-brand-border-hover: var(--brand-500); + --button-outline-brand-text: var(--white-500); + --button-outline-brand-text-active: var(--white-500); + --button-outline-brand-text-hover: var(--white-500); + --button-outline-danger-background: hsl(var(--white-500-hsl) / 0); + --button-outline-danger-background-active: var(--red-460); + --button-outline-danger-background-hover: var(--red-430); + --button-outline-danger-border: var(--red-400); + --button-outline-danger-border-active: var(--red-430); + --button-outline-danger-border-hover: var(--red-430); + --button-outline-danger-text: var(--white-500); + --button-outline-danger-text-active: var(--white-500); + --button-outline-danger-text-hover: var(--white-500); + --button-outline-positive-background: hsl(var(--white-500-hsl) / 0); + --button-outline-positive-background-active: var(--green-530); + --button-outline-positive-background-hover: var(--green-430); + --button-outline-positive-border: var(--green-360); + --button-outline-positive-border-active: var(--green-530); + --button-outline-positive-border-hover: var(--green-430); + --button-outline-positive-text: var(--white-500); + --button-outline-positive-text-active: var(--white-500); + --button-outline-positive-text-hover: var(--white-500); + --button-outline-primary-background: hsl(var(--white-500-hsl) / 0); + --button-outline-primary-background-active: var(--primary-430); + --button-outline-primary-background-hover: var(--primary-500); + --button-outline-primary-border: var(--primary-500); + --button-outline-primary-border-active: var(--primary-430); + --button-outline-primary-border-hover: var(--primary-500); + --button-outline-primary-text: var(--white-500); + --button-outline-primary-text-active: var(--white-500); + --button-outline-primary-text-hover: var(--white-500); + --button-positive-background: var(--green-430); + --button-positive-background-active: var(--green-530); + --button-positive-background-disabled: var(--green-430); + --button-positive-background-hover: var(--green-500); + --button-secondary-background: var(--primary-500); + --button-secondary-background-active: var(--primary-400); + --button-secondary-background-disabled: var(--primary-500); + --button-secondary-background-hover: var(--primary-430); + --card-gradient-bg: hsl(var(--black-500-hsl) / 0.4); + --card-gradient-pressed-bg: hsl(var(--black-500-hsl) / 0.5); + --card-primary-bg: var(--primary-600); + --card-primary-pressed-bg: var(--primary-645); + --card-secondary-bg: var(--primary-630); + --card-secondary-pressed-bg: var(--primary-645); + --channel-icon: var(--primary-400); + --channel-text-area-placeholder: var(--primary-430); + --channels-default: var(--primary-360); + --channeltextarea-background: var(--primary-560); + --chat-background: var(--primary-600); + --chat-banner-bg: var(--primary-630); + --chat-border: var(--primary-700); + --chat-input-container-background: var(--primary-600); + --chat-swipe-to-reply-background: var(--primary-660); + --chat-swipe-to-reply-gradient-background: hsl(var(--black-500-hsl) / 0.1); + --coachmark-bg: var(--primary-800); + --context-menu-backdrop-background: hsl(var(--black-500-hsl) / 0.7); + --control-brand-foreground: var(--brand-360); + --control-brand-foreground-new: var(--brand-360); + --creator-revenue-icon-gradient-end: var(--teal-430); + --creator-revenue-icon-gradient-start: var(--teal-360); + --creator-revenue-info-box-background: hsl(var(--teal-430-hsl) / 0.1); + --creator-revenue-info-box-border: var(--teal-400); + --creator-revenue-locked-channel-icon: var(--teal-345); + --creator-revenue-progress-bar: var(--teal-400); + --deprecated-card-bg: hsl(var(--primary-700-hsl) / 0.6); + --deprecated-card-editable-bg: hsl(var(--primary-700-hsl) / 0.3); + --deprecated-quickswitcher-input-background: var(--primary-400); + --deprecated-quickswitcher-input-placeholder: hsl(var(--white-500-hsl) / 0.3); + --deprecated-store-bg: var(--primary-600); + --deprecated-text-input-bg: var(--primary-700); + --deprecated-text-input-border: hsl(var(--black-500-hsl) / 0.3); + --deprecated-text-input-border-disabled: var(--primary-700); + --deprecated-text-input-border-hover: var(--primary-900); + --deprecated-text-input-prefix: var(--primary-200); + --display-banner-overflow-background: hsl(var(--primary-700-hsl) / 0.5); + --divider-strong: hsl(var(--white-500-hsl) / 0.16); + --divider-subtle: hsl(var(--white-500-hsl) / 0.08); + --embed-background: var(--primary-630); + --embed-background-alternate: var(--primary-600); + --embed-title: var(--primary-130); + --expression-picker-bg: var(--primary-630); + --focus-primary: var(--blue-345); + --forum-post-extra-media-count-container-background: hsl(var(--primary-660-hsl) / 0.8); + --forum-post-tag-background: hsl(var(--primary-660-hsl) / 0.9); + --guild-icon-inactive-bg: var(--primary-630); + --guild-icon-inactive-nested-bg: var(--primary-600); + --guild-notifications-bottom-sheet-pill-background: var(--primary-700); + --halo-positive: hsl(var(--green-360-hsl) / 0.24); + --header-muted: var(--primary-360); + --header-primary: var(--primary-130); + --header-secondary: var(--primary-330); + --home-background: var(--primary-645); + --home-card-resting-border: hsl(var(--transparent-hsl) / 0); + --icon-muted: var(--primary-400); + --icon-primary: var(--primary-130); + --icon-secondary: var(--primary-330); + --icon-transparent: hsl(var(--transparent-hsl) / 0); + --info-box-background: hsl(var(--blue-345-hsl) / 0.1); + --info-danger-background: hsl(var(--red-400-hsl) / 0.1); + --info-danger-foreground: var(--red-400); + --info-danger-text: var(--white-500); + --info-help-background: hsl(var(--blue-345-hsl) / 0.1); + --info-help-foreground: var(--blue-345); + --info-help-text: var(--white-500); + --info-positive-background: hsl(var(--green-360-hsl) / 0.1); + --info-positive-foreground: var(--green-360); + --info-positive-text: var(--white-500); + --info-warning-background: hsl(var(--yellow-300-hsl) / 0.1); + --info-warning-foreground: var(--yellow-300); + --info-warning-text: var(--white-500); + --input-background: var(--primary-700); + --input-focused-border: hsl(var(--white-500-hsl) / 0.16); + --input-placeholder-text: var(--input-placeholder-text-dark); + --interactive-active: var(--white-500); + --interactive-hover: var(--primary-230); + --interactive-muted: var(--primary-500); + --interactive-normal: var(--primary-330); + --legacy-android-blur-overlay-default: hsl(var(--primary-660-hsl) / 0.5); + --legacy-android-blur-overlay-ultra-thin: hsl(var(--black-500-hsl) / 0.025); + --legacy-blur-fallback-default: hsl(var(--primary-660-hsl) / 0.975); + --legacy-blur-fallback-ultra-thin: hsl(var(--black-500-hsl) / 0.95); + --live-stage-tile-border: hsl(var(--primary-500-hsl) / 0.6); + --logo-primary: var(--white-500); + --mention-background: hsl(var(--brand-500-hsl) / 0.3); + --mention-foreground: var(--brand-260); + --modal-background: var(--primary-600); + --modal-footer-background: var(--primary-630); + --navigator-header-tint: var(--white-500); + --panel-bg: var(--primary-600); + --polls-normal-fill-hover: var(--primary-600); + --polls-normal-image-background: var(--primary-660); + --polls-victor-fill: hsl(var(--green-360-hsl) / 0.2); + --polls-voted-fill: hsl(var(--brand-500-hsl) / 0.2); + --profile-gradient-card-background: hsl(var(--black-500-hsl) / 0.7); + --profile-gradient-message-input-border: hsl(var(--primary-500-hsl) / 0.48); + --profile-gradient-note-background: hsl(var(--black-500-hsl) / 0.3); + --profile-gradient-overlay: hsl(var(--black-500-hsl) / 0.6); + --profile-gradient-overlay-synced-with-user-theme: hsl(var(--black-500-hsl) / 0.8); + --profile-gradient-profile-body-background-hover: hsl(var(--white-500-hsl) / 0.16); + --profile-gradient-role-pill-background: hsl(var(--primary-660-hsl) / 0.5); + --profile-gradient-role-pill-border: hsl(var(--white-500-hsl) / 0.2); + --profile-gradient-section-box: hsl(var(--black-500-hsl) / 0.45); + --redesign-activity-card-background: var(--primary-560); + --redesign-activity-card-background-pressed: var(--primary-630); + --redesign-activity-card-badge-icon: var(--primary-360); + --redesign-activity-card-border: hsl(var(--white-500-hsl) / 0.02); + --redesign-activity-card-overflow-background: var(--primary-630); + --redesign-button-active-background: var(--green-430); + --redesign-button-active-pressed-background: var(--green-460); + --redesign-button-active-text: var(--white-500); + --redesign-button-danger-background: var(--red-430); + --redesign-button-danger-pressed-background: var(--red-460); + --redesign-button-danger-text: var(--white-500); + --redesign-button-destructive-background: var(--red-430); + --redesign-button-destructive-pressed-background: var(--red-460); + --redesign-button-destructive-text: var(--white-500); + --redesign-button-overlay-alpha-background: hsl(var(--black-500-hsl) / 0.54); + --redesign-button-overlay-alpha-pressed-background: hsl(var(--black-500-hsl) / 0.64); + --redesign-button-overlay-alpha-text: var(--white-500); + --redesign-button-overlay-background: var(--white-500); + --redesign-button-overlay-pressed-background: var(--primary-230); + --redesign-button-overlay-text: var(--primary-860); + --redesign-button-positive-background: var(--green-430); + --redesign-button-positive-pressed-background: var(--green-460); + --redesign-button-positive-text: var(--white-500); + --redesign-button-primary-alt-background: hsl(var(--brand-500-hsl) / 0); + --redesign-button-primary-alt-border: var(--brand-360); + --redesign-button-primary-alt-on-blurple-background: hsl(var(--brand-530-hsl) / 0); + --redesign-button-primary-alt-on-blurple-border: var(--white-500); + --redesign-button-primary-alt-on-blurple-pressed-background: var(--brand-530); + --redesign-button-primary-alt-on-blurple-pressed-border: var(--brand-360); + --redesign-button-primary-alt-on-blurple-text: var(--white-500); + --redesign-button-primary-alt-pressed-background: hsl(var(--brand-700-hsl) / 0.16); + --redesign-button-primary-alt-pressed-border: hsl(var(--brand-400-hsl) / 0.5); + --redesign-button-primary-alt-pressed-text: var(--brand-360); + --redesign-button-primary-alt-text: var(--brand-360); + --redesign-button-primary-background: var(--brand-500); + --redesign-button-primary-on-blurple-pressed-text: var(--brand-530); + --redesign-button-primary-overlay-background: var(--white-500); + --redesign-button-primary-overlay-pressed-background: var(--primary-230); + --redesign-button-primary-overlay-text: var(--primary-860); + --redesign-button-primary-pressed-background: var(--brand-560); + --redesign-button-primary-text: var(--white-500); + --redesign-button-secondary-background: var(--primary-460); + --redesign-button-secondary-border: hsl(var(--white-500-hsl) / 0.08); + --redesign-button-secondary-overlay-background: hsl(var(--black-500-hsl) / 0.54); + --redesign-button-secondary-overlay-pressed-background: hsl(var(--black-500-hsl) / 0.64); + --redesign-button-secondary-overlay-text: var(--white-500); + --redesign-button-secondary-pressed-background: var(--primary-500); + --redesign-button-secondary-pressed-border: hsl(var(--transparent-hsl) / 0); + --redesign-button-secondary-text: var(--primary-230); + --redesign-button-selected-background: hsl(var(--brand-500-hsl) / 0.24); + --redesign-button-selected-pressed-background: hsl(var(--brand-500-hsl) / 0.28); + --redesign-button-selected-text: var(--brand-500); + --redesign-button-tertiary-background: var(--primary-660); + --redesign-button-tertiary-pressed-background: var(--primary-560); + --redesign-button-tertiary-pressed-text: var(--primary-330); + --redesign-button-tertiary-text: var(--primary-230); + --redesign-channel-category-name-text: var(--primary-330); + --redesign-channel-message-preview-text: var(--primary-360); + --redesign-channel-name-muted-text: var(--primary-360); + --redesign-channel-name-text: var(--primary-130); + --redesign-chat-input-background: var(--primary-700); + --redesign-image-button-pressed-background: hsl(var(--black-500-hsl) / 0.08); + --redesign-input-control-active-bg: var(--primary-645); + --redesign-input-control-selected: var(--brand-500); + --redesign-only-background-active: var(--primary-530); + --redesign-only-background-default: var(--primary-600); + --redesign-only-background-overlay: var(--primary-645); + --redesign-only-background-raised: var(--primary-630); + --redesign-only-background-sunken: var(--primary-660); + --scrollbar-auto-scrollbar-color-thumb: var(--primary-730); + --scrollbar-auto-scrollbar-color-track: var(--primary-630); + --scrollbar-auto-thumb: var(--primary-730); + --scrollbar-auto-track: var(--primary-630); + --scrollbar-thin-thumb: var(--primary-730); + --scrollbar-thin-track: hsl(var(--black-500-hsl) / 0); + --spoiler-hidden-background: var(--primary-700); + --spoiler-revealed-background: var(--primary-660); + --status-danger: var(--red-400); + --status-danger-background: var(--red-430); + --status-danger-text: var(--white-500); + --status-dnd: var(--red-400); + --status-idle: var(--yellow-300); + --status-offline: var(--primary-360); + --status-online: var(--green-360); + --status-positive: var(--green-360); + --status-positive-background: var(--green-430); + --status-positive-text: var(--white-500); + --status-speaking: var(--green-360); + --status-warning: var(--yellow-300); + --status-warning-background: var(--yellow-300); + --status-warning-text: var(--black-500); + --text-brand: var(--brand-360); + --text-danger: var(--red-345); + --text-link: var(--blue-345); + --text-link-low-saturation: var(--blue-330); + --text-low-contrast: var(--primary-360); + --text-message-preview-low-sat: var(--primary-360); + --text-muted: var(--primary-360); + --text-muted-on-default: var(--primary-330); + --text-normal: var(--primary-230); + --text-positive: var(--green-330); + --text-primary: var(--primary-230); + --text-secondary: var(--primary-330); + --text-warning: var(--yellow-300); + --textbox-markdown-syntax: var(--primary-360); + --theme-locked-blur-fallback: hsl(var(--primary-700-hsl) / 0.96); + --thread-channel-spine: var(--primary-500); + --toast-bg: var(--primary-800); + --typing-indicator-bg: var(--primary-630); + --user-profile-header-overflow-background: hsl(var(--primary-700-hsl) / 0.5); + --voice-video-video-tile-background: hsl(var(--plum-17-hsl) / 0.4); + --voice-video-video-tile-blur-fallback: hsl(var(--primary-700-hsl) / 0.48); + --white: var(--white-500); + --you-bar-bg: var(--primary-800) +} + +.theme-dark { + --shadow-border: 0 0 0 1px hsla(0, 0%, 100%, 0.08); + --shadow-border-filter: drop-shadow(0 0 1px hsla(0, 0%, 100%, 0.08)); + --shadow-button-overlay: 0 12px 24px 0 hsla(0, 0%, 0%, 0.24); + --shadow-button-overlay-filter: drop-shadow(0 12px 24px hsla(0, 0%, 0%, 0.24)); + --shadow-high: 0 12px 24px 0 hsla(0, 0%, 0%, 0.24); + --shadow-high-filter: drop-shadow(0 12px 24px hsla(0, 0%, 0%, 0.24)); + --shadow-ledge: 0 2px 0 0 hsla(0, 0%, 0%, 0.05), 0 1.5px 0 0 hsla(0, 0%, 0%, 0.05), 0 1px 0 0 hsla(0, 0%, 0%, 0.16); + --shadow-ledge-filter: drop-shadow(0 1.5px 0 hsla(0, 0%, 0%, 0.24)); + --shadow-low: 0 1px 4px 0 hsla(0, 0%, 0%, 0.14); + --shadow-low-filter: drop-shadow(0 1px 4px hsla(0, 0%, 0%, 0.14)); + --shadow-low-active: 0 0 4px 0 hsla(0, 0%, 0%, 0.14); + --shadow-low-active-filter: drop-shadow(0 0 4px hsla(0, 0%, 0%, 0.14)); + --shadow-low-hover: 0 4px 10px 0 hsla(0, 0%, 0%, 0.14); + --shadow-low-hover-filter: drop-shadow(0 4px 10px hsla(0, 0%, 0%, 0.14)); + --shadow-medium: 0 4px 8px 0 hsla(0, 0%, 0%, 0.16); + --shadow-medium-filter: drop-shadow(0 4px 8px hsla(0, 0%, 0%, 0.16)); + --shadow-mobile-navigator-x: 0 0 10px 0 hsla(0, 0%, 0%, 0.22); + --shadow-mobile-navigator-x-filter: drop-shadow(0 0 10px hsla(0, 0%, 0%, 0.22)); + --shadow-top-high: 0 -12px 32px 0 hsla(0, 0%, 0%, 0.24); + --shadow-top-high-filter: drop-shadow(0 -12px 32px hsla(0, 0%, 0%, 0.24)); + --shadow-top-ledge: 0 -2px 0 0 hsla(0, 0%, 0%, 0.05), 0 -1.5px 0 0 hsla(0, 0%, 0%, 0.05), 0 -1px 0 0 hsla(0, 0%, 0%, 0.16); + --shadow-top-ledge-filter: drop-shadow(0 -1.5px 0 hsla(0, 0%, 0%, 0.24)); + --shadow-top-low: 0 -1px 4px 0 hsla(0, 0%, 0%, 0.14); + --shadow-top-low-filter: drop-shadow(0 -1px 4px hsla(0, 0%, 0%, 0.14)) +} + +:root { + --spacing-4: 4px; + --spacing-8: 8px; + --spacing-12: 12px; + --spacing-16: 16px; + --spacing-24: 24px; + --spacing-32: 32px; + --spacing-40: 40px; + --spacing-48: 48px; + --spacing-56: 56px; + --spacing-64: 64px; + --spacing-72: 72px; + --spacing-80: 80px; + --spacing-96: 96px +} + +:root { + --radius-none: 0px; + --radius-xs: 4px; + --radius-sm: 8px; + --radius-md: 12px; + --radius-lg: 16px; + --radius-xl: 24px; + --radius-xxl: 32px; + --radius-round: 2147483647px +} + +.theme-dark { + --guild-header-text-shadow: 0 1px 1px hsl(var(--black-500-hsl) / 0.4); + --elevation-stroke: 0 0 0 1px hsl(var(--primary-900-hsl) / 0.15); + --elevation-low: 0 1px 0 hsl(var(--primary-900-hsl) / 0.2), 0 1.5px 0 hsl(var(--primary-860-hsl) / 0.05), 0 2px 0 hsl(var(--primary-900-hsl) / 0.05); + --elevation-medium: 0 4px 4px hsl(var(--black-500-hsl) / 0.16); + --elevation-high: 0 8px 16px hsl(var(--black-500-hsl) / 0.24) +} + +@font-face { + font-family: "ABC Ginto Nord"; + font-style: normal; + font-weight: 800; + src: url(/assets/97dace684f57983852c5.woff2)format("woff2") +} + +@font-face { + font-family: "ABC Ginto Nord"; + font-style: italic; + font-weight: 800; + src: url(/assets/d5541e31f4669799d489.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: normal; + font-weight: 400; + src: url(/assets/80bebfd30fcab0b986b9.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: italic; + font-weight: 400; + src: url(/assets/c7ee0cb6a022a4ec6014.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: normal; + font-weight: 500; + src: url(/assets/04bca5e801a9fcbfc3aa.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: italic; + font-weight: 500; + src: url(/assets/02cc3c9536c9375ab76d.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: normal; + font-weight: 600; + src: url(/assets/75ba5f0f601173633474.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: italic; + font-weight: 600; + src: url(/assets/2e5557c485f515e42c32.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: normal; + font-weight: 700; + src: url(/assets/7e44a0c40cf9f5ad8851.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: italic; + font-weight: 700; + src: url(/assets/40d43fa876b60783aaf0.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: normal; + font-weight: 800; + src: url(/assets/6be494f6834de299bf2b.woff2)format("woff2") +} + +@font-face { + font-family: "gg sans"; + font-style: italic; + font-weight: 800; + src: url(/assets/21ce747ad35d0446bd97.woff2)format("woff2") +} + +@font-face { + font-family: "gg mono"; + font-style: normal; + font-weight: 400; + src: url(/assets/f6eace1eb4856b2b3c69.woff2)format("woff2") +} + +@font-face { + font-family: "gg mono"; + font-style: normal; + font-weight: 700; + src: url(/assets/c5329cfa5c42790bde45.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: normal; + font-weight: 400; + src: url(/assets/c6a42c9d9be5779449b4.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: italic; + font-weight: 400; + src: url(/assets/0f45161043dcbdcbd5ce.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: normal; + font-weight: 500; + src: url(/assets/49bdd438735c5a37aa2f.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: italic; + font-weight: 500; + src: url(/assets/a2a5dbdace1c7a60071f.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: normal; + font-weight: 600; + src: url(/assets/772d95477af0de29530a.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: italic; + font-weight: 600; + src: url(/assets/932193bd833126fd3594.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: normal; + font-weight: 700; + src: url(/assets/73db21f39678fb5461f4.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: italic; + font-weight: 700; + src: url(/assets/2cdb0cd5053057173033.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: normal; + font-weight: 800; + src: url(/assets/0ed8c63791bd4173c668.woff2)format("woff2") +} + +@font-face { + font-family: "Noto Sans"; + font-style: italic; + font-weight: 800; + src: url(/assets/6fc5e19f0bbff9fc4d8b.woff2)format("woff2") +} + +@font-face { + font-family: "Source Code Pro"; + font-style: normal; + font-weight: 400; + src: url(/assets/5b973e10f95c0c47779a.woff2)format("woff2") +} + +@font-face { + font-family: "Source Code Pro"; + font-style: normal; + font-weight: 700; + src: url(/assets/9f557929f8c3c0afd1a7.woff2)format("woff2") +} + +:root { + --font-primary: 'gg sans', 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-display: 'gg sans', 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-headline: 'ABC Ginto Nord', 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-code: 'gg mono', 'Source Code Pro', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace +} + +:root:lang(el),:root:lang(ru),:root:lang(uk),:root:lang(bg) { + --font-primary: 'gg sans', 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-display: 'gg sans', 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-headline: 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-code: 'gg mono', 'Source Code Pro', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace +} + +:root:lang(ko) { + --font-primary: 'gg sans', 'Apple SD Gothic Neo', NanumBarunGothic, '맑은 고딕', 'Malgun Gothic', Gulim, 굴림, Dotum, 돋움, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-display: 'gg sans', 'Apple SD Gothic Neo', NanumBarunGothic, '맑은 고딕', 'Malgun Gothic', Gulim, 굴림, Dotum, 돋움, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-headline: 'ABC Ginto Nord', 'Apple SD Gothic Neo', NanumBarunGothic, '맑은 고딕', 'Malgun Gothic', Gulim, 굴림, Dotum, 돋움, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-code: 'gg mono', 'Source Code Pro', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace +} + +:root:lang(ja) { + --font-primary: 'gg sans', 'Hiragino Sans', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, Osaka, 'MS PGothic', 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-display: 'gg sans', 'Hiragino Sans', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, Osaka, 'MS PGothic', 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-headline: 'ABC Ginto Nord', 'Hiragino Sans', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, Osaka, 'MS PGothic', 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-code: 'gg mono', 'Source Code Pro', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace +} + +:root:lang(zh-CN) { + --font-primary: 'gg sans', 'Microsoft YaHei New', 微软雅黑, 'Microsoft Yahei', 'Microsoft JhengHei', 宋体, SimSun, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-display: 'gg sans', 'Microsoft YaHei New', 微软雅黑, 'Microsoft Yahei', 'Microsoft JhengHei', 宋体, SimSun, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-headline: 'ABC Ginto Nord', 'Microsoft YaHei New', 微软雅黑, 'Microsoft Yahei', 'Microsoft JhengHei', 宋体, SimSun, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-code: 'gg mono', 'Source Code Pro', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace +} + +:root:lang(zh-TW) { + --font-primary: 'gg sans', 'Microsoft JhengHei', 微軟正黑體, 'Microsoft JhengHei UI', 'Microsoft YaHei', 微軟雅黑, 宋体, SimSun, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-display: 'gg sans', 'Microsoft JhengHei', 微軟正黑體, 'Microsoft JhengHei UI', 'Microsoft YaHei', 微軟雅黑, 宋体, SimSun, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-headline: 'ABC Ginto Nord', 'Microsoft JhengHei', 微軟正黑體, 'Microsoft JhengHei UI', 'Microsoft YaHei', 微軟雅黑, 宋体, SimSun, 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; + --font-code: 'gg mono', 'Source Code Pro', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace +} + +:root { + --chat-resize-handle-width: 8px +} + +html,body,div,span,h1,h2,h3,pre,a,code,em,img,s,strong,var,ol,ul,li,form,table { + margin: 0; + padding: 0; + border: 0; + font-weight: inherit; + font-style: inherit; + font-family: inherit; + font-size: 100%; + vertical-align: baseline +} + +a { + color: var(--text-link); + -webkit-text-decoration: none; + text-decoration: none; + cursor: pointer +} + +a img { + border: none +} + +body { + line-height: 1; + margin: 0; + padding: 0; + font-family: var(--font-primary); + overflow: hidden; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + background: transparent +} + +ol,ul { + list-style: none +} + +::-moz-placeholder { + font-family: var(--font-primary); + font-weight: 400 +} + +select,textarea,input,::placeholder { + font-family: var(--font-primary); + font-weight: 400 +} + +strong { + font-weight: 600 +} + +button { + font-family: var(--font-primary); + font-weight: 500; + border: 0; + cursor: pointer +} + +code { + font-family: var(--font-code); + font-size: 14px; + line-height: 16px +} + +:root { + --custom-index-scrollbar-width: 10px; + --custom-index-scrollbar-margin: 3px +} + +:root { + --custom-auth-box-auth-box-padding: 32px; + --custom-wave-splash-responsive-width-mobile: 485px; + --custom-wave-splash-responsive-width-mobile-first: 486px; + --custom-wave-splash-responsive-width-desktop: 1080px; + --custom-wave-splash-max-qr-login-width: 830px; + --custom-channel-text-area-button-hover-scale: 0.85714; + --custom-drag-resize-container-handle-size: 8px; + --custom-drag-resize-container-handle-bleed: 2px; + --custom-drag-resize-container-handle-offset: calc(var(--custom-drag-resize-container-handle-bleed) - var(--custom-drag-resize-container-handle-size)); + --custom-embed-spoiler-blur-radius: 44px; + --custom-gradient-progress-notch-width: 8px; + --custom-gradient-progress-notch-height: 16px; + --custom-gradient-progress-notch-margin: 2px; + --custom-guild-discovery-card-card-height: 320px; + --custom-guild-discovery-card-card-height-with-tags: 350px; + --custom-icon-button-icon-lg-size: 36px; + --custom-icon-button-icon-md-size: 24px; + --custom-icon-button-icon-sm-size: 18px; + --custom-icon-button-icon-xs-size: 12px; + --custom-invite-button-resolving-background-width: 380px; + --custom-keybind-space-around-key: 8px; + --custom-keybind-shadow-width: 2px; + --custom-keybind-vertical-padding-total-height: 8px; + --custom-keybind-applied-vertical-padding: calc((var(--custom-keybind-vertical-padding-total-height) - var(--custom-keybind-shadow-width)) / 2); + --custom-full-screen-layer-animation-duration: 150ms; + --custom-layout-sidebar-width: 232px; + --custom-message-avatar-size: 40px; + --custom-message-avatar-decoration-size: calc(var(--custom-message-avatar-size) * var(--decoration-to-avatar-ratio)); + --custom-message-margin-horizontal: 16px; + --custom-message-margin-compact-indent: 5rem; + --custom-message-spacing-vertical-container-cozy: 0.125rem; + --custom-message-padding-vertical-container-compact: 0.125rem; + --custom-message-meta-space: 0.25rem; + --custom-message-reply-indent: 0.625rem; + --custom-message-margin-left-content-cozy: calc(40px + var(--custom-message-margin-horizontal) + var(--custom-message-margin-horizontal)); + --custom-message-reply-message-preview-line-height: 1.125rem; + --custom-message-attachment-spoiler-blur-radius: 44px; + --custom-user-premium-guild-subscription-easter-egg-size: 196px; + --custom-notification-spacing: 12px; + --custom-notification-container-width: 300px; + --custom-notification-space-around-divider: 12px; + --custom-notification-box-shadow-opacity: 0.8; + --custom-notification-box-shadow-blur-radius: 7px; + --custom-notification-box-shadow-spread-radius: 3px; + --custom-widget-max-widget-height: 100vh; + --custom-widget-bar-padding: 12px; + --custom-widget-body-padding: 4px; + --custom-widget-bar-height: 20px; + --custom-premium-guild-progress-bar-progress-bar-width: 24px; + --custom-premium-guild-progress-bar-tier-marker-size: 16px; + --custom-call-avatar-outgoing-duration: 2.5s; + --custom-call-avatar-incoming-duration: 5.407s; + --custom-resizable-icon-size: 16px; + --custom-resizable-icon-padding: 4px; + --custom-resizable-extension-size: 4px; + --custom-live-indicator-border-radius: 16px; + --custom-tutorial-popout-padding-content: 16px; + --custom-tutorial-popout-height-media-approx: 80px +} + +:root { + --custom-emoji-size-emoji: 1.375em; + --custom-emoji-size-jumbo-emoji: 3rem; + --custom-margin-margin-x-small: 4px; + --custom-margin-margin-small: 8px; + --custom-margin-margin-medium: 20px; + --custom-margin-margin-large: 40px; + --custom-margin-margin-x-large: 60px; + --custom-media-queries-media-query-mobile-header: 849px; + --custom-media-queries-media-query-mobile: 768px; + --custom-scrollbar-scrollbar-width: 14px; + --custom-scrollbar-scrollbar-margin: 3px; + --custom-scrollbar-border-radius: calc(var(--custom-scrollbar-scrollbar-width) / 2) +} + +:root { + --custom-create-welcome-channel-modal-emoji-size: 20px; + --custom-create-welcome-channel-modal-input-elements-padding: 10px +} + +:root { + --custom-voice-channel-effect-voice-channel-effect-animation-size: 800px; + --custom-voice-channel-effects-bar-effect-bar-padding-x: 16px; + --custom-voice-channel-effects-bar-effect-bar-padding-y: 12px; + --custom-voice-channel-effects-bar-max-width: 498px +} + +:root { + --custom-base-tile-border-radius: 8px +} + +:root { + --custom-user-profile-modal-user-profile-modal-width: 600px; + --custom-user-profile-modal-header-avatar-size: 120px; + --custom-user-profile-modal-header-total-avatar-border-size: 16px; + --custom-direct-message-section-delay: 150ms; + --custom-direct-message-section-opacity-delay: 20ms; + --custom-direct-message-section-duration: 150ms; + --custom-user-banner-premium-banner-height-popout: 120px; + --custom-user-banner-premium-banner-height-no-banner-image-popout: 90px; + --custom-user-banner-premium-banner-height-profile: 212px; + --custom-user-banner-premium-banner-height-settings: 100px; + --custom-user-banner-banner-height-pomelo: 64px; + --custom-user-banner-banner-height-popout: 60px; + --custom-user-banner-banner-height-profile: 106px; + --custom-user-banner-banner-height-panel: 120px; + --custom-user-banner-cancel-modal-height: 42px; + --custom-user-banner-height-bite-size: 120px; + --custom-user-banner-height-full-size: 210px; + --custom-user-profile-themed-container-user-popout-width: 340px; + --custom-user-profile-themed-container-user-profile-modal-width: 600px; + --custom-user-profile-themed-container-user-profile-themed-padding: 4px; + --custom-user-profile-themed-container-profile-effects-user-popout-width: 280px; + --custom-user-profile-width-bite-size: 300px; + --custom-user-profile-width-full-size: 600px; + --custom-user-profile-height-full-size: 780px +} + +:root { + --custom-summary-avatars-avatar-diameter: 16px +} + +:root { + --custom-guild-settings-premium-tier-status-progress-with-subscriptions-margin-top: 7px; + --custom-guild-stickers-tiers-grid-breakpoint: 1010px; + --custom-guild-sticker-upload-modal-emoji-size: 22px; + --custom-guild-sticker-upload-modal-emoji-margin: 10px; + --custom-stickers-constants-stickers-list-padding-top: 0; + --custom-stickers-constants-stickers-list-padding-top-search-results: 8px; + --custom-stickers-constants-stickers-list-padding-right: 0; + --custom-stickers-constants-stickers-list-padding-bottom: 0; + --custom-stickers-constants-stickers-list-padding-left: 8px; + --custom-stickers-constants-stickers-list-divider-height: 30px; + --custom-stickers-constants-stickers-list-empty-guild-upsell-height: 54px; + --custom-stickers-constants-stickers-shop-list-section-heading-height: 66px; + --custom-stickers-constants-stickers-shop-divider-border-top-width: 1px; + --custom-stickers-constants-stickers-shop-divider-height: 1px; + --custom-stickers-constants-stickers-shop-list-section-footer-height: 32px; + --custom-stickers-constants-stickers-shop-list-section-footer-stacked-margin: 8px; + --custom-stickers-constants-sticker-picker-preview-dimensions: 96px; + --custom-stickers-constants-sticker-picker-preview-dimensions-small: 80px; + --custom-stickers-constants-sticker-picker-preview-padding: 2px; + --custom-stickers-constants-sticker-shop-modal-preview-dimensions: 72px; + --custom-stickers-constants-sticker-picker-preview-margin: 12px; + --custom-stickers-constants-sticker-picker-preview-margin-small: 4px; + --custom-stickers-constants-sticker-picker-preview-border-radius: 4px; + --custom-stickers-constants-sticker-category-list-padding: 8px; + --custom-stickers-constants-sticker-category-icon-margin: 8px; + --custom-stickers-constants-sticker-category-icon-size: 32px; + --custom-stickers-constants-sticker-category-unicode-icon-size: 24px; + --custom-stickers-constants-sticker-dimension: 160px; + --custom-stickers-constants-sticker-purchase-pack-preview-dimensions: 76px; + --custom-stickers-constants-sticker-purchase-pack-preview-padding: 2px; + --custom-stickers-constants-sticker-purchase-pack-preview-margin: 0; + --custom-stickers-constants-sticker-picker-breakpoint-small: 360px; + --custom-stickers-constants-sticker-picker-breakpoint-medium: 446px; + --custom-stickers-constants-category-separator-size: 1px; + --custom-stickers-constants-category-separator-margin-vertical: 12px +} + +:root { + --custom-header-icon-color-expired: #4e5058 +} + +:root { + --custom-reaction-picker-border-radius: 8px +} + +:root { + --custom-color-swatch-color-swatch-height: 50px; + --custom-profile-customization-preview-avatar-size: 80px; + --custom-profile-customization-preview-avatar-decoration-size: calc(var(--custom-profile-customization-preview-avatar-size) * var(--decoration-to-avatar-ratio)); + --custom-profile-customization-preview-avatar-decoration-position: calc((var(--custom-profile-customization-preview-avatar-size) - var(--custom-profile-customization-preview-avatar-decoration-size)) / 2) +} + +:root { + --custom-outbound-promotion-redemption-modal-art-height: 120px; + --custom-premium-colors-premium-gradient-tier-0: linear-gradient( to right, var(--premium-tier-0-purple-for-gradients), var(--premium-tier-0-blue-for-gradients) ); + --custom-premium-colors-premium-gradient-tier-1: linear-gradient( to right, var(--premium-tier-1-blue-for-gradients), var(--premium-tier-1-dark-blue-for-gradients) ); + --custom-premium-colors-premium-gradient-tier-2: linear-gradient( to right, var(--premium-tier-2-purple-for-gradients), var(--premium-tier-2-pink-for-gradients) ); + --custom-premium-colors-premium-gradient-tier-2-transparent: linear-gradient( to right, hsl(var(--premium-tier-2-purple-for-gradients-hsl) / 0.3), hsl(var(--premium-tier-2-pink-for-gradients-hsl) / 0.3) ); + --custom-premium-colors-premium-gradient-tier-2-diagonal: linear-gradient( 45deg, var(--premium-tier-2-purple-for-gradients), var(--premium-tier-2-pink-for-gradients) ); + --custom-premium-colors-premium-gradient-tier-2-tri-color: linear-gradient( to right, var(--premium-tier-2-purple-for-gradients), var(--premium-tier-2-purple-for-gradients-2), var(--premium-tier-2-pink-for-gradients) ); + --custom-premium-colors-premium-gradient-tier-2-tri-color-reverse: linear-gradient( to left, var(--premium-tier-2-purple-for-gradients), var(--premium-tier-2-purple-for-gradients-2), var(--premium-tier-2-pink-for-gradients) ); + --custom-premium-colors-premium-gradient-tier-2-old: linear-gradient( to right, var(--premium-tier-2-purple), var(--premium-tier-2-pink) ) +} + +:root { + --custom-pending-row-max-width: 1040px; + --custom-people-page-max-width-with-toolbar: 940px +} + +:root { + --custom-family-center-page-responsive-width-mobile: 900px +} + +:root { + --custom-text-widget-background-color-header-default: var(--primary-600); + --custom-voice-widget-top-margin: calc(var(--custom-widget-bar-height) + 2 * var(--custom-widget-bar-padding)); + --custom-voice-widget-widget-width: 272px +} + +:root { + --custom-o-auth-2-page-oauth-2-max-width: 440px; + --custom-o-auth-2-page-oauth-2-min-height: 366px +} + +:root { + --custom-party-avatars-avatar-diameter: 24px +} + +:root { + --custom-mobile-web-handoff-link-mobile-web-handoff-height: 70px +} + +:root { + --custom-embedded-application-invite-content-height: 130px; + --custom-embedded-application-invite-content-height-tall: 162px; + --custom-embedded-application-invite-content-width: 576px; + --custom-embedded-application-invite-image-width-small: 225px; + --custom-embedded-application-invite-image-width-large: 288px; + --custom-message-helpers-popout-content-width: 256px; + --custom-message-helpers-popout-padding-width: 16px; + --custom-message-helpers-popout-container-width: calc(var(--custom-message-helpers-popout-content-width) + 2 * var(--custom-message-helpers-popout-padding-width)) +} + +:root { + --custom-media-post-attachments-horizontal-padding: 48px; + --custom-media-post-embed-spoiler-blur-radius: 20px; + --custom-media-post-embed-transition-duration: 170ms +} + +:root { + --custom-raging-demon-duration: 0.15s +} + +:root { + --custom-interaction-iframe-modal-modal-min-width: 320px; + --custom-interaction-iframe-modal-modal-margin: 80px; + --custom-interaction-iframe-modal-modal-max-width: 1280px; + --custom-interaction-iframe-modal-modal-header-height: 52px +} + +:root { + --custom-accept-invite-detail-components-small-mobile-breakpoint: 640px; + --custom-accept-invite-mobile-small-mobile-breakpoint: 640px +} + +:root { + --custom-hub-discovery-add-hub-card-card-height: 320px; + --custom-hub-discovery-guild-list-card-height: 320px; + --custom-hub-discovery-guild-list-min-card-width: 248px; + --custom-hub-discovery-guild-list-gutter-size: 16px; + --custom-hub-discovery-page-max-page-width: 1608px +} + +:root { + --custom-guild-tooltip-icon-size: 20px; + --custom-guild-tooltip-icon-size-v-2: 16px; + --custom-list-items-list-item-width: 72px; + --custom-folder-item-animation-duration: 150ms; + --custom-folder-item-guild-icon-size: 48px; + --custom-folder-item-guild-icon-margin: 8px; + --custom-list-items-list-item-width: 72px +} + +:root { + --custom-category-channel-space-before-category: 16px +} + +:root { + --custom-add-permissions-modal-focus-ring-width: 4px; + --custom-custom-role-icon-form-item-role-icon-preview-size: 32px; + --custom-guild-settings-roles-edit-shared-sidebar-width: 232px; + --custom-guild-settings-roles-intro-roles-transition: 250ms; + --custom-guild-settings-roles-intro-pause-transition: 166ms; + --custom-guild-settings-roles-intro-background-transition: 500ms; + --custom-guild-settings-roles-intro-banner-transition-delay: calc(var(--custom-guild-settings-roles-intro-roles-transition) + var(--custom-guild-settings-roles-intro-pause-transition)); + --custom-guild-settings-roles-intro-roles-transition-delay: calc(var(--custom-guild-settings-roles-intro-roles-transition) + 2 * var(--custom-guild-settings-roles-intro-pause-transition) + var(--custom-guild-settings-roles-intro-background-transition)); + --custom-guild-settings-community-intro-content-spacing: 32px; + --custom-guild-settings-community-intro-hover-distance: -12px; + --custom-guild-settings-community-intro-text-spacing: 8px; + --custom-guild-settings-discovery-landing-page-max-width-tab: 905px; + --custom-guild-settings-discovery-landing-page-settings-max-width: 520px; + --custom-guild-settings-partner-content-spacing: 32px +} + +:root { + --custom-event-detail-info-tab-base-spacing: 8px +} + +:root { + --custom-subscription-listing-previews-carousel-cards-get-cut-off-width: 724px; + --custom-editable-benefits-list-emoji-size: 24px; + --custom-edit-benefit-modal-emoji-size: 22px; + --custom-edit-benefit-modal-emoji-margin: 10px; + --custom-guild-settings-role-subscriptions-max-width: 905px; + --custom-guild-settings-role-subscriptions-overview-settings-max-width: 520px; + --custom-guild-settings-store-page-settings-max-width: 520px; + --custom-importable-benefits-list-listing-image-size: 40px; + --custom-import-benefits-modal-icon-size: 24px; + --custom-import-benefits-modal-role-icon-size: 40px; + --custom-role-icon-uploader-icon-size: 24px; + --custom-guild-role-subscription-style-constants-cover-image-aspect-ratio: 4; + --custom-historic-earnings-table-toggle-expand-column-width: 30px; + --custom-guild-role-subscription-card-basic-info-tier-image-size: 80px; + --custom-guild-role-subscription-card-basic-info-tier-image-size-mobile: 48px; + --custom-guild-role-subscriptions-overview-page-page-max-width: 1180px +} + +:root { + --custom-guild-dialog-popout-width: 250px; + --custom-guild-dialog-splash-ratio: 1.77778; + --custom-guild-dialog-icon-size: 84px; + --custom-guild-dialog-icon-padding: 4px +} + +:root { + --custom-guild-product-download-modal-header-image-width: 119px +} + +:root { + --custom-guild-onboarding-home-page-max-page-width: 1128px; + --custom-guild-onboarding-home-page-max-single-column-width: 704px; + --custom-home-resource-channels-obscured-blur-radius: 20px +} + +:root { + --custom-guild-member-application-review-sidebar-width: 29vw +} + +:root { + --custom-featured-items-popout-featured-items-popout-footer-height: 120px +} + +:root { + --custom-guild-boosting-sidebar-display-conditional-bottom-margin: 12px; + --custom-guild-boosting-marketing-progress-bar-marker-dimensions: 32px; + --custom-guild-boosting-marketing-progress-bar-end-markers-margin: 4px; + --custom-guild-boosting-marketing-progress-bar-marker-marker-dimensions: 32px; + --custom-guild-boosting-marketing-tier-cards-tier-card-border-radius: 16px +} + +:root { + --custom-go-live-modal-art-height: 112px +} + +:root { + --custom-gif-picker-gutter-size: 0 16px 12px 16px; + --custom-gif-picker-search-results-desired-item-width: 160px +} + +:root { + --custom-forum-composer-attachments-attachment-size: 78px; + --custom-forum-post-obscured-blur-radius: 20px; + --custom-forum-post-grid-view-obscured-blur-radius: 20px; + --custom-demo-forum-channel-padding-large: 20px; + --custom-demo-forum-channel-post-padding: 12px; + --custom-demo-forum-channel-gap-size: 8px +} + +:root { + --custom-feedback-modal-emoji-size: 64px; + --custom-feedback-modal-close-button-margin: 12px +} + +:root { + --custom-expression-suggestions-container-padding: 8px; + --custom-expression-suggestions-sticker-suggestion-size: 48px; + --custom-expression-suggestions-sticker-suggestion-margin: 8px +} + +:root { + --custom-expression-picker-constants-expression-picker-list-section-heading-height: 32px; + --custom-expression-picker-constants-expression-picker-inspector-bar-graphic-primary-dimensions: 28px; + --custom-expression-picker-constants-expression-picker-inspector-bar-graphic-secondary-dimensions: 32px; + --custom-expression-picker-constants-expression-picker-inspector-bar-height: 48px +} + +:root { + --custom-emoji-picker-border-radius: 8px; + --custom-emoji-picker-constants-min-emoji-picker-width: 498px; + --custom-emoji-picker-constants-emoji-size-medium: 40px; + --custom-emoji-picker-constants-emoji-size-large: 48px; + --custom-emoji-picker-constants-emoji-container-padding-horizontal: 4px; + --custom-emoji-picker-constants-emoji-container-padding-vertical: 4px; + --custom-emoji-picker-constants-emoji-picker-height: 440px; + --custom-emoji-picker-constants-emoji-section-margin-bottom: 12px; + --custom-emoji-picker-constants-emoji-list-padding-top: 0; + --custom-emoji-picker-constants-emoji-list-padding-right: 0; + --custom-emoji-picker-constants-emoji-list-padding-bottom: 8px; + --custom-emoji-picker-constants-emoji-list-padding-left: 8px; + --custom-emoji-picker-constants-emoji-list-search-results-padding-top: 8px; + --custom-emoji-picker-constants-unicode-category-icon-margin-vertical: 2px; + --custom-emoji-picker-constants-unicode-category-icon-size: 24px; + --custom-emoji-picker-constants-unicode-category-icon-padding: 4px; + --custom-emoji-picker-constants-unicode-category-shortcut-height: 48px; + --custom-emoji-picker-constants-guild-category-icon-size: 32px; + --custom-emoji-picker-constants-guild-category-icon-margin-verical: 8px; + --custom-emoji-picker-constants-category-separator-size: 1px; + --custom-emoji-picker-constants-category-separator-margin-vertical: 12px; + --custom-emoji-picker-constants-diversity-emoji-size: 24px; + --custom-emoji-picker-constants-emoji-premium-upsell-height: 54px; + --custom-emoji-picker-constants-emoji-premium-upsell-margin-top: 16px; + --custom-emoji-picker-constants-newly-added-emoji-badge-height: 16px +} + +:root { + --custom-drop-redemption-modal-art-height: 120px +} + +:root { + --custom-discover-static-guild-card-card-height: 258px; + --custom-discover-featured-guilds-section-card-height: 320px; + --custom-discover-featured-guilds-section-min-card-width: 248px; + --custom-discover-featured-guilds-section-gutter-size: 16px; + --custom-discover-search-results-max-search-bar-width: 720px +} + +:root { + --custom-guild-directory-min-card-width: 248px; + --custom-guild-directory-gutter-size: 16px; + --custom-guild-directory-min-content-width: 320px; + --custom-guild-directory-max-page-width: 1608px; + --custom-guild-directory-entry-card-card-height: 274px; + --custom-guild-directory-landing-min-header-height: 200px +} + +:root { + --custom-custom-status-modal-art-height: 120px; + --custom-custom-status-modal-emoji-size: 22px; + --custom-custom-status-modal-emoji-margin: 10px +} + +:root { + --custom-guild-shop-page-two-column-max-width: 1439px; + --custom-aspect-stable-image-container-padding: 20px; + --custom-monetization-info-table-expandable-rows-toggle-expand-column-width: 30px; + --custom-guild-shop-content-width: 1044px; + --custom-guild-shop-content-width-reduced: 788px; + --custom-guild-shop-content-width-minimum: 688px; + --custom-guild-shop-channel-row-gradient: linear-gradient(113deg, #2f3570 1.98%, #422c70 94.48%); + --custom-guild-shop-channel-row-gradient-hover: linear-gradient(113deg, #383f86 1.98%, #4d3385 94.48%); + --custom-guild-shop-channel-row-border-gradient: linear-gradient(113deg, rgb(101, 145, 255), rgb(209, 80, 255)); + --custom-guild-shop-channel-row-glow: 0 0 4px rgba(189, 149, 255, 0.5); + --custom-guild-shop-preview-pill-shadow-dark: -4px 5px #1d1d1d; + --custom-guild-shop-preview-pill-shadow-light: -4px 5px #d7dce8; + --custom-guild-shop-gradient-start: #686bff; + --custom-guild-shop-gradient-end: #c356fd +} + +:root { + --custom-guild-role-connections-modal-close-button-margin: 12px +} + +:root { + --custom-clips-enabled-indicator-medium-break-point: 920px; + --custom-clips-enabled-indicator-badge-icon-dimension-override: 20px +} + +:root { + --custom-client-themes-editor-content-width: calc(var(--custom-theme-selection-selection-size) * 3 + var(--custom-theme-selection-group-column-gap) * 2); + --custom-client-themes-editor-editor-padding: 16px; + --custom-theme-selection-selection-size: 60px; + --custom-theme-selection-group-column-gap: 24px +} + +:root { + --custom-channel-attachment-upload-spoiler-blur-radius: 44px; + --custom-channel-attachment-upload-mini-attachment-size: 78px; + --custom-channel-textarea-text-area-height: 44px +} + +:root { + --custom-channel-notice-icon-size: 16px; + --custom-channel-notice-padding: 12px +} + +:root { + --custom-channel-call-participants-popout-padding-value: 16px; + --custom-stream-upsell-modal-art-height: 149px; + --custom-voice-channel-status-modal-emoji-size: 22px; + --custom-voice-channel-status-modal-emoji-margin: 10px +} + +:root { + --custom-broadcasting-tooltip-image-offset: 40px +} + +:root { + --custom-application-subscription-card-benefits-gap: 16px; + --custom-application-subscription-card-listing-image-size: 40px +} + +:root { + --custom-application-directory-content-min-width: 600px; + --custom-application-directory-content-max-width: 1024px; + --custom-guild-count-small-icon-size: 16px; + --custom-guild-count-large-icon-size: 20px; + --custom-collection-gallery-text-container-width: 400px; + --custom-collection-gallery-media-breakpoint: 1024px; + --custom-collection-gallery-column-card-height: 600px; + --custom-collection-gallery-row-card-height: 283px; + --custom-collection-list-card-gap: 16px; + --custom-collection-list-with-image-grid-gap: 16px; + --custom-collections-collection-gap: 32px; + --custom-application-directory-profile-sidebar-width: 192px; + --custom-application-directory-profile-sidebar-margin-right: 48px; + --custom-application-directory-profile-icon-size: 122px; + --custom-application-directory-search-sidebar-width: 200px; + --custom-application-directory-search-sidebar-margin-right: 32px +} + +:root { + --custom-activities-home-tile-scroller-vertical-margin: 8px; + --custom-activities-home-whats-new-horizontal-margin: 10px; + --custom-activities-home-whats-new-tile-width: 224px; + --custom-activities-home-happening-now-card-width: 305px; + --custom-activities-home-happening-now-gap: 16px; + --custom-activities-home-activity-card-width: 235px; + --custom-activity-bookmark-embed-image-width: 356px; + --custom-activity-bookmark-embed-image-height: 200px; + --custom-activity-bookmark-embed-content-height: 400px; + --custom-activity-shelf-item-activity-item-height: 230px; + --custom-activity-shelf-item-large-activity-item-height: 143px; + --custom-activity-shelf-modal-modal-padding: 80px; + --custom-activity-shelf-modal-modal-width: 496px; + --custom-activity-shelf-modal-modal-min-width: 496px; + --custom-activity-shelf-modal-modal-max-width: 1024px; + --custom-activity-shelf-modal-modal-header-height: 92px; + --custom-activity-shelf-modal-modal-header-without-description-height: 74px; + --custom-activity-shelf-modal-modal-footer-height: 50px; + --custom-activity-shelf-modal-modal-art-height: 64px; + --custom-activity-shelf-modal-modal-max-height: 720px; + --custom-activity-shelf-modal-modal-header-developer-controls-height: 176px; + --custom-activity-shelf-modal-dividers-height: 2px; + --custom-activity-shelf-modal-divider-height: 1px; + --custom-activity-shelf-slide-activity-directory-shelf-grid-gap: 16px +} + +:root { + --custom-accept-invite-modal-invite-modal-height: 420px; + --custom-accept-invite-modal-small-screen-width: 720px +} + +:root { + --custom-avatar-avatar-decoration-border-position: calc((1 - var(--decoration-to-avatar-ratio)) / 2 * 100%); + --custom-button-button-xl-width: 148px; + --custom-button-button-xl-height: 50px; + --custom-button-button-lg-width: 130px; + --custom-button-button-lg-height: 44px; + --custom-button-button-md-width: 96px; + --custom-button-button-md-height: 38px; + --custom-button-button-sm-width: 60px; + --custom-button-button-sm-height: 32px; + --custom-button-button-tn-height: 24px; + --custom-button-button-tn-width: 52px; + --custom-button-link-underline-width: 1px; + --custom-button-link-underline-offset: 1px; + --custom-button-link-underline-stop: calc(var(--custom-button-link-underline-width) + var(--custom-button-link-underline-offset)); + --custom-button-filled-hover: 0.1; + --custom-button-filled-active: 0.2; + --custom-button-transition-duration: 170ms; + --custom-modal-min-width-large: 800px +} + +:root { + --custom-special-markdown-small-break-point: 600px; + --custom-special-markdown-medium-break-point: 768px; + --custom-user-profile-hype-squad-badge-icon-size: 24px; + --custom-user-profile-hype-squad-badge-shine-size-offset: 64px +} + +:root { + --custom-guild-discovery-gutter-size: 16px; + --custom-guild-discovery-max-page-width: 1608px +} + +:root { + --custom-dropdown-button-small-dropdown-size: 16px; + --custom-dropdown-button-medium-dropdown-size: 24px; + --custom-dropdown-button-large-dropdown-size: 32px; + --custom-dropdown-button-separator-padding: 4px; + --custom-dropdown-button-hitbox-padding: 8px; + --custom-responsive-embed-tile-loading-background-width: 271px; + --custom-game-install-locations-item-padding: 20px; + --custom-game-list-row-min-height: 62px; + --custom-game-list-linked-to-glow-duration: 2000ms; + --custom-application-store-home-store-home-width: 1245px; + --custom-application-store-listing-body-max-width: 880px; + --custom-store-colors-primary-750: #191b1d; + --custom-store-colors-premium-gradient: linear-gradient( to right, var(--premium-tier-2-purple), var(--premium-tier-2-pink) ) +} + +:root { + --custom-member-list-item-avatar-decoration-padding: 2px; + --custom-messages-popout-messages-popout-footer-height: 120px; + --custom-radio-image-border-thickness: 2px; + --custom-standard-sidebar-view-sidebar-content-width: 192px; + --custom-standard-sidebar-view-standard-padding: 20px; + --custom-standard-sidebar-view-sidebar-content-scrollbar-padding: 6px; + --custom-standard-sidebar-view-sidebar-total-width: calc(var(--custom-standard-sidebar-view-sidebar-content-width) + var(--custom-standard-sidebar-view-standard-padding) + var(--custom-standard-sidebar-view-sidebar-content-scrollbar-padding)) +} + +:root { + --decoration-to-avatar-ratio: 1.2 +} + +:root { + --font-weight-normal: 400; + --font-weight-medium: 500; + --font-weight-semibold: 600; + --font-weight-bold: 700; + --font-weight-extrabold: 800 +} + +body,html,.appMount_ea7e65 { + height: 100%; + width: 100% +} + +.appMount_ea7e65 { + position: absolute; + overflow: hidden; + display: flex; + flex-direction: column +} + +body,.appMount_ea7e65 { + background: var(--bg-overlay-app-frame,var(--background-tertiary)); + text-rendering: optimizeLegibility +} + +::-moz-placeholder { + font-family: var(--font-primary); + text-rendering: optimizeLegibility +} + +body,textarea,input,button,select,::placeholder { + font-family: var(--font-primary); + text-rendering: optimizeLegibility +} + +a,div,span,strong,button,input,textarea,select { + outline: 0 +} + +img[alt] { + text-indent: -9999px +}