@import url("https://fonts.cdnfonts.com/css/sf-pro-display");@import url("https://fonts.googleapis.com/icon?family=Material+Icons");* { margin-left: 0; } :root { --font-sf-pro: "SF Pro Display",sans-serif; } * { margin-bottom: 0; } * { margin-right: 0; } :root { --color-white: #fff; } * { margin-top: 0; } :root { --color-white-100: rgba(255,255,255,.1); } :root { --color-white-200: rgba(255,255,255,.2); } :root { --color-white-400: rgba(255,255,255,.4); } :root { --color-white-800: rgba(255,255,255,.8); } * { padding-left: 0; } * { padding-bottom: 0; } * { padding-right: 0; } :root { --color-white-900: rgba(255,255,255,.9); } * { padding-top: 0; } :root { --color-black: #1e1e1e; } :root { --color-black-100: rgba(0,0,0,.1); } * { outline: 0; } * { border-left-width: 0; } :root { --color-black-50: rgba(211,197,197,.39); } * { border-bottom-width: 0; } * { border-right-width: 0; } * { border-top-width: 0; } :root { --color-black-200: rgba(0,0,0,.2); } * { border-left-style: none; } * { border-bottom-style: none; } * { border-right-style: none; } :root { --color-black-500: rgba(0,0,0,.5); } :root { --color-black-600: rgba(0,0,0,.6); } * { border-top-style: none; } :root { --color-blue-800: #06f; } :root { --app-color-white: #fcfffb; } :root { --color-red: #ff3b30; } :root { --color-green: #34c759; } :root { --color-orange: #ff9500; } :root { --color-yellow: #fc0; } :root { --color-purple: #5856d6; } :root { --color-pink: #ff2d55; } * { border-left-color: currentColor; } * { border-bottom-color: currentColor; } * { border-right-color: currentColor; } * { border-top-color: currentColor; } :root { --system-color-light-hsl: 240,3%,11%; } :root { --system-blur-light: saturate(180%) blur(20px); } :root { --system-blur-dark: saturate(180%) blur(20px); } * { border-image: none; } * { list-style: none; } * { cursor: url("../cursor/normal.png"),pointer; } * { -webkit-font-smoothing: antialiased; } * { -moz-osx-font-smoothing: grayscale; } @media screen and (max-width: 900px) { [class~=hidden] { display:none; } } [class~=navbar__right] li [class~=control-center] { width: 2pc; } li>ul { display: none; } [class~=navbar__right] li [class~=control-center] { height: 1.1875pc; } [class~=navbar] [class~=leftLi] { padding-left: .5pc; } [class~=navbar] [class~=leftLi][class~=logo] img { transform: translateY(1px); } [class~=navbar__right] li [class~=control-center] { transform: scale(.8) translateY(1px); } li>ul>li,[class~=navbar] { width: 100%; } button,li>ul>li:last-child { border-bottom-width: 0; } [class~=navbar] [class~=leftLi] { padding-bottom: .041666667in; } [class~=navbar__right] [class~=battery__container]::after { content: ""; } [class~=navbar__right] [class~=battery],[class~=navbar__right] [class~=battery__popup] header,[class~=navbar]>ul { display: flex; } [class~=navbar] [class~=leftLi] { padding-right: .5pc; } [class~=navbar__right] [class~=battery__container]::after { background: rgba(255,255,255,.4); } [class~=navbar] [class~=leftLi] { padding-top: .041666667in; } [class~=navbar__right] [class~=battery] { margin-left: 0; } [class~=navbar] li,[class~=navbar__right] [class~=battery] { margin-bottom: 0; } [class~=navbar__right] [class~=battery__container]::after { width: 2.25pt; } button { background-color: transparent; } [class~=navbar__right] [class~=battery__container]::after { height: 7px; } [class~=navbar__right] [class~=battery],[class~=navbar__right] [class~=battery__popup] header,[class~=navbar]>ul,li>ul { align-items: center; } [class~=navbar__right] [class~=battery__popup] button:hover { background-color: var(--color-blue-800); } li>ul,[class~=navbar__right] [class~=battery__container]::after { position: absolute; } [class~=navbar]>ul { cursor: url("../cursor/normal.png"),pointer; } [class~=navbar__right] [class~=battery__container]::after { top: 50%; } [class~=navbar] li,[class~=navbar__right] [class~=battery] { position: relative; } [class~=navbar__right] [class~=battery] { margin-right: 0; } button { border-left-width: 0; } [class~=navbar__right] [class~=battery__container]::after { right: -.3125pc; } button,li>ul>li:last-child { border-bottom-style: none; } [class~=navbar__right] [class~=battery],[class~=navbar] li { margin-top: 0; } [class~=navbar__right] [class~=battery__container]::after { transform: translateY(-50%); } [class~=navbar__right] [class~=battery__container]::after { border-top-right-radius: 3px; } li>ul { flex-direction: column; } li>ul>li { border-bottom-width: .0625pc; } [class~=navbar] { padding-left: 0; } [class~=navbar__right] [class~=battery__container]::after { border-bottom-right-radius: .03125in; } [class~=navbar] { padding-bottom: .1rem; } li>ul { left: 0; } [class~=navbar] [class~=leftLi]:hover,li>ul>li>button { color: var(--color-white); } button { border-right-width: 0; } [class~=navbar] li { font-size: 9.75pt; } button { border-top-width: 0; } [class~=navbar__right] [class~=battery] { cursor: pointer; } [class~=navbar__right] [class~=battery] { user-select: none; } [class~=navbar] [class~=leftLi]:hover,[class~=navbar__right] [class~=battery] { border-radius: 4px; } [class~=navbar__right] [class~=battery] { padding-left: .5rem; } [class~=navbar] li { margin-left: .25pc; } [class~=navbar] { padding-right: 0; } li>ul>li:last-child { border-bottom-color: currentColor; } li>ul>li { border-bottom-style: solid; } li>ul>li { border-bottom-color: rgba(0,0,0,.15); } [class~=navbar__right] [class~=battery__popup] header { justify-content: space-between; } button { border-left-style: none; } li>ul>li:last-child,li>ul>li { border-image: none; } [class~=navbar__right] [class~=battery__popup] header,[class~=navbar__right] [class~=battery__popup] p { padding-left: 7.5pt; } [class~=navbar__right] [class~=battery] { padding-bottom: .3rem; } [class~=navbar] { padding-top: .1rem; } [class~=navbar__right] [class~=battery__popup] header,[class~=navbar__right] [class~=battery__popup] p { padding-bottom: 0; } [class~=navbar__right] [class~=battery] { padding-right: .5rem; } [class~=navbar] li { margin-right: .25pc; } [class~=navbar__right] [class~=battery] { padding-top: .3rem; } [class~=navbar__right] [class~=battery__popup] p,[class~=navbar__right] [class~=battery__popup] header { padding-right: 7.5pt; } [class~=navbar__right] [class~=battery] { background: transparent; } li>ul { top: 100%; } [class~=navbar__right] [class~=battery] { transition: all ease-out .2s; } [class~=navbar__right] [class~=battery__popup] button:active { background-color: #0055d4; } [class~=navbar__right] [class~=battery__popup] header,[class~=navbar__right] [class~=battery__popup] p { padding-top: 0; } .navbar__right .battery__container { width: 16.5pt; } [class~=navbar] { position: fixed; } [class~=navbar__right] [class~=battery__popup] p { font-size: .6875pc; } button { border-right-style: none; } li>ul>li { padding-bottom: .3125pc; } [class~=navbar__right] [class~=battery__popup] p { margin-top: 3pt; } [class~=navbar] { top: 0; } .navbar__right .battery__container { height: .104166667in; } button { border-top-style: none; } [class~=navbar] { left: 0; } [class~=navbar] li,[class~=navbar] { cursor: url("../cursor/normal.png"),pointer; } [class~=navbar__right] [class~=battery__popup] p { font-family: var(--font-sf-pro-text); } .navbar__right .battery__popup hr { margin-left: .5pc; } [class~=navbar__right] [class~=clock] #clock { margin-left: 15px; } .navbar__right .battery__popup hr { margin-bottom: .0625in; } .navbar__right .battery__container { padding-left: .75pt; } .navbar__right .battery__container { padding-bottom: .75pt; } .navbar__right .battery__popup hr { margin-right: .5pc; } .navbar__right .battery__popup hr { margin-top: .0625in; } .navbar__right .battery__container { padding-right: .75pt; } .navbar__right .battery__popup hr { border-left-width: 0; } [class~=navbar] { color: var(--color-white-900); } .navbar__right .battery__popup hr { border-bottom-width: 0; } .navbar__right .battery__container { padding-top: .75pt; } button,.navbar__right .battery__popup hr { border-left-color: currentColor; } li>ul>li:last-child { padding-bottom: 0 !important; } [class~=navbar] { box-shadow: 0 2px 7.5pt var(--color-black-100); } [class~=navbar] [class~=leftLi]:hover { background-color: var(--color-white-200); } [class~=navbar] li { text-shadow: 0 .75pt .010416667in rgba(0,0,0,.3); } [class~=navbar] { -webkit-backdrop-filter: var(--system-blur-light); } .navbar__right .battery__popup hr { border-right-width: 0; } .navbar__right .battery__progress .is-charging { display: none; } button,.navbar__right .battery__popup hr { border-bottom-color: currentColor; } .navbar__right .battery__popup hr,.navbar__right .battery__container { border-top-width: .010416667in; } .navbar__right .battery__container { position: relative; } li>ul { margin-top: .0625pc; } li>ul>li>button { width: 100%; } button,.navbar__right .battery__popup hr { border-right-color: currentColor; } .navbar__right .battery__container { border-radius: 3px; } li>ul>li { margin-bottom: 3.75pt !important; } button { border-top-color: currentColor; } [class~=navbar] { backdrop-filter: var(--system-blur-light); } li>ul>li:last-child { margin-bottom: 0 !important; } .navbar__right .battery__popup hr { border-left-style: none; } [class~=navbar] li { transition: .2s; } .navbar__right .battery__container { border-left-width: .0625pc; } .navbar__right .battery__popup hr { border-bottom-style: none; } li>ul,[class~=navbar] li { font-weight: 500; } .navbar__right .battery__container { border-bottom-width: .0625pc; } li>ul>li>button:hover { color: var(--color-white); } .navbar__right .battery__popup hr { border-right-style: none; } li>ul { padding-left: .25pc; } .navbar__right .battery__container { border-right-width: .0625pc; } li>ul>li>button:hover { background: var(--color-blue-800); } .navbar__right .battery__container { border-left-style: solid; } button,[class~=navbar] li { -webkit-tap-highlight-color: transparent; } .navbar__right .battery__container { border-bottom-style: solid; } .navbar__right .battery__container { border-right-style: solid; } [class~=navbar] li,body { user-select: none; } .navbar__right .battery__container,.navbar__right .battery__popup hr { border-top-style: solid; } button { border-image: none; } button { outline: 0; } .navbar__right .battery__container { border-left-color: rgba(255,255,255,.4); } button,[class~=navbar] li,li>ul>li>button,[class~=navbar__right] [class~=battery__popup] button { font-family: var(--font-sf-pro-text); } .navbar__right .battery__container { border-bottom-color: rgba(255,255,255,.4); } [class~=navbar__right] li svg { transform: scale(.8); } .navbar__right .battery__container { border-right-color: rgba(255,255,255,.4); } .navbar__right .battery__container { border-top-color: rgba(255,255,255,.4); } body { height: 100vh; } .navbar__right .battery__container { border-image: none; } .navbar__right .battery__popup hr { border-top-color: rgba(255,255,255,.1); } .navbar__right .battery__popup hr { border-image: none; } .navbar__right .battery__popup hr { border-radius: 74.25pt; } [class~=navbar__right] [class~=battery__popup] button { padding-left: .104166667in; } li>ul>li>button,[class~=navbar__right] [class~=battery__progress] { height: 100%; } [class~=navbar__right] [class~=battery__popup] button,[class~=navbar__right] [class~=battery__progress],[class~=navbar],li:hover>ul,li>ul>li>button { display: flex; } li>ul,[class~=navbar__right] [class~=battery__popup] button { padding-bottom: .25pc; } [class~=navbar__right] [class~=battery__popup] button { padding-right: .104166667in; } li>ul>li>button,[class~=navbar__right] [class~=battery__popup] button,.navbar__right .battery__popup,li>ul { padding-top: .25pc; } .navbar__right .battery__popup,li>ul { padding-right: .25pc; } [class~=navbar__right] [class~=battery__progress] { background: white; } [class~=navbar__right] [class~=battery__progress] { border-radius: .125pc; } [class~=navbar__right] [class~=battery__text] { font-size: 12px; } li>ul>li>button:active { background-color: #0055d4; } [class~=navbar__right] [class~=battery__text] { margin-right: 3pt; } [class~=navbar],[class~=navbar__right] [class~=battery__popup] button { align-items: center; } [class~=navbar],[class~=navbar__right] [class~=battery__popup] button { justify-content: space-between; } [class~=navbar__right] [class~=battery__text],li>ul>li>button { font-weight: 400; } [class~=navbar__right] [class~=battery__popup] button { border-radius: .375pc; } .navbar__right .battery__popup { position: absolute; } body { font-family: var(--font-sf-pro); } li>ul>li>button { flex-direction: row; } li>ul>li>button { text-align: left; } [class~=navbar] li { letter-spacing: -.01em; } .navbar svg { fill: var(--color-white); } li>ul { min-width: 12.5pc; } [class~=navbar__right] [class~=battery__popup] button { color: white; } .navbar__right .battery__progress .is-charging,[class~=navbar__right] [class~=battery__popup] button { width: 100%; } body { background: url("../background/big-sur-dark.webp"); } body { cursor: url("../cursor/normal.png"),pointer; } [class~=navbar__right] [class~=battery__popup] button { cursor: pointer; } [class~=navbar__right] [class~=battery__popup] button { user-select: none; } [class~=navbar__right] [class~=battery__popup] button { font-size: 13px; } .navbar__right .battery__popup { right: 0; } .navbar__right .battery__popup { opacity: 0; } .navbar__right .battery__popup,li>ul { -webkit-backdrop-filter: var(--system-blur-light); } .navbar__right .battery__popup { width: 165pt; } li[class~=app_name] { display: none; } li[class~=app_name] { font-weight: 600 !important; } [class~=navbar__right] li { margin-left: .625pc; } li>ul,.navbar__right .battery__popup { backdrop-filter: var(--system-blur-light); } [class~=navbar__right] li { margin-bottom: 0; } .navbar__right .battery__popup { transition: all ease-out .2s; } .navbar__right .battery__popup { padding-left: .041666667in; } .navbar__right .battery__popup header h3 { font-size: .9375pc; } [class~=navbar__right] li { margin-right: .625pc; } li>ul>li>button,.navbar__right .battery__popup { padding-bottom: .041666667in; } body { background-size: cover; } body { background-position: center; } .navbar__right .battery__popup { background: rgba(0,0,0,.2); } .navbar__right .battery__popup { border-left-width: .75pt; } .navbar__right .battery__popup,li>ul { border-radius: 10px; } body { background-repeat: no-repeat; } .navbar__right .battery__popup { border-bottom-width: .75pt; } .navbar__right .battery__popup { border-right-width: .75pt; } [class~=navbar] { z-index: 20; } .navbar__right .battery__popup { border-top-width: .75pt; } li>ul { box-shadow: 0 1.5pt 7px rgba(0,0,0,.363); } [class~=navbar__right] li { margin-top: 0; } [class~=wifi] svg { transform: translateY(1px) scale(.8) !important; } body { overflow: hidden; } [class~=navbar__right] [class~=clock] #clock { margin-right: 11.25pt; } .navbar__right .battery__popup { border-left-style: solid; } [class~=navbar] { animation: top-to-bottom .3s; } .navbar__right .battery__popup { border-bottom-style: solid; } .navbar__right .battery__popup { border-right-style: solid; } .navbar__right .battery__popup { border-top-style: solid; } .navbar__right .battery__popup { border-left-color: rgba(255,255,255,.1); } .navbar__right .battery__popup { border-bottom-color: rgba(255,255,255,.1); } [class~=navbar__right] [class~=clock] #clock { font-weight: 400; } .navbar__right .battery__popup { border-right-color: rgba(255,255,255,.1); } [class~=navbar] { height: .25in; } .navbar__right .battery__popup { border-top-color: rgba(255,255,255,.1); } .navbar__right .battery__popup { border-image: none; } .navbar__right .battery__popup { box-shadow: 0px 0in 10px rgba(0,0,0,.2); } .navbar__right .battery__popup header h3 { font-weight: 600; } li>ul>li>button { padding-left: .083333333in; } .navbar__right .battery__popup header h3 { font-family: var(--font-sf-pro); } li>ul>li>button { padding-right: .083333333in; } li>ul>li>button { border-radius: .0625in; } .navbar__right .battery__progress .is-charging { height: 100%; } [class~=navbar__right] [class~=battery__popup] header span { opacity: .75; } li>ul>li>button { transition: 80ms; } li>ul>li>button { font-size: 13px; } [class~=navbar__right] [class~=battery__popup] header span { font-size: 12px; } [class~=navbar__right] [class~=battery__popup] header span { font-family: var(--font-sf-pro-text); } li>ul>li>button { cursor: url("../cursor/normal.png"),pointer; } @media screen and (max-width: 600px) { [class~=navbar__right] [class~=clock] #clock { margin-left:0; } } [class~=dock] { display: flex; } [class~=dock] { align-items: center; } [class~=dock] { position: fixed; } [class~=dock] { padding-left: .17rem; } [class~=dock] { padding-bottom: 0; } [class~=dock] { padding-right: .17rem; } [class~=dock] { padding-top: .25rem; } [class~=dock] { bottom: 0%; } [class~=dock] { left: 50%; } [class~=dock] { height: 45pt; } [class~=dock] { margin-bottom: .28125pc; } [class~=dock] { transform: translateX(-50%); } [class~=dock] { -webkit-backdrop-filter: var(--system-blur-light); } [class~=dock] { backdrop-filter: var(--system-blur-light); } [class~=dock] { border-left-width: .0625pc; } [class~=dock] { border-bottom-width: .0625pc; } [class~=dock] { border-right-width: .0625pc; } [class~=dock] { border-top-width: .0625pc; } [class~=dock] { border-left-style: solid; } [class~=dock] { border-bottom-style: solid; } [class~=dock] { border-right-style: solid; } [class~=dock] { border-top-style: solid; } [class~=dock] { border-left-color: var(--color-white-200); } [class~=dock] { border-bottom-color: var(--color-white-200); } [class~=dock] { border-right-color: var(--color-white-200); } [class~=dock] { border-top-color: var(--color-white-200); } [class~=dock] { border-image: none; } [class~=dock] { border-radius: 13.5pt; } [class~=dock] { box-shadow: 0 0 1.875pc rgba(0,0,0,.555); } [class~=dock] { z-index: 10; } @media screen and (max-width: 900px) { [class~=dock] { border-radius:1.25pc; } } .dock .point,[class~=dock] [class~=icon]:hover img { margin-left: 0; } .dock .point { width: 0pt; } [class~=dock] [class~=icon]:nth-child(1):hover::after { content: "Safari"; } [class~=dock] [class~=icon]:nth-child(2):hover::after { content: "Photos"; } ::-webkit-scrollbar { background-color: transparent; } .dock .point { height: 0in; } [class~=dock] [class~=icon]:hover img { margin-bottom: 52.5pt; } .dock .point,[class~=dock-separator] { margin-bottom: 0; } [class~=dock] [class~=icon]::after { font-size: 12px; } [class~=dock] [class~=icon]:nth-child(3):hover::after { content: "System Preferences"; } [class~=dock] [class~=icon]:hover img,.dock .point { margin-right: 0; } [class~=dock-separator],[class~=dock] [class~=icon]:hover+[class~=icon] img,[class~=dock] [class~=icon]:hover img,.dock .point { margin-top: 0; } .dock .point { background: #f08080; } [class~=dock] [class~=icon]:nth-child(5):hover::after { content: "Twitch"; } ::-webkit-scrollbar { width: .5pc; } [class~=dock] [class~=icon]::after { position: absolute; } [class~=dock-separator] { width: .010416667in; } [class~=dock] [class~=icon]::after { background-color: rgba(50,50,50,.8); } [class~=dock] [class~=icon]::after { top: -20%; } .dock .point { border-radius: 50%; } [class~=dock] [class~=icon]:nth-child(6):hover::after { content: "Discord"; } ::-webkit-scrollbar-track { background-color: transparent; } [class~=dock] [class~=icon]:nth-child(7):hover::after { content: "Instagram"; } .dock .point { display: none; } .dock .point { animation: top-to-bottom .3s; } [class~=dock-separator] { height: 2.5pc; } ::-webkit-scrollbar-thumb { background-color: rgba(186,186,192,.5); } .dock .icon:nth-child(8):hover::after { content: "Roblox"; } [class~=dock] [class~=icon]::after { left: 50%; } .dock .point { transition: .3s; } [class~=dock] [class~=icon]::after { transform: translateX(-50%); } [class~=dock] [class~=icon] { position: relative; } [class~=dock-separator] { background-color: rgba(255,255,255,.3); } [class~=dock] [class~=icon]:nth-child(9):hover::after { content: "Tiktok"; } [class~=dock] [class~=icon]:nth-child(10):hover::after { content: "Twitter"; } [class~=dock-separator] { margin-left: .104166667in; } [class~=dock] [class~=icon] { display: grid; } [class~=dock] [class~=icon]::after { display: flex; } [class~=dock] [class~=icon] { place-items: center; } [class~=dock] [class~=icon]::after { justify-content: center; } [class~=dock] [class~=icon]:nth-child(11):hover::after { content: "Instagram"; } [class~=dock] [class~=icon]::after { align-items: center; } [class~=dock-separator] { margin-right: .104166667in; } [class~=dock-separator] { align-self: center; } [class~=dock] [class~=icon]::after { z-index: 1; } [class~=dock] [class~=icon] { background: none; } [class~=dock] [class~=icon]:hover+[class~=icon] img { width: 5rem; } [class~=dock] [class~=icon]:hover img { width: 8rem; } [class~=dock] [class~=icon] { border-left-width: medium; } [class~=dock] [class~=icon] img:active { filter: brightness(.6) drop-shadow(0 0 10px #2c2c2c); } [class~=dock] [class~=icon]::after { width: 80px; } [class~=dock] [class~=icon]::after { height: .260416667in; } [class~=dock] [class~=icon] { border-bottom-width: medium; } [class~=dock] [class~=icon]::after { padding-left: 2.25pt; } [class~=dock] [class~=icon] { border-right-width: medium; } [class~=dock] [class~=icon] { border-top-width: medium; } [class~=dock] [class~=icon]::after { padding-bottom: .041666667in; } [class~=dock] [class~=icon] { border-left-style: none; } [class~=dock] [class~=icon] { border-bottom-style: none; } [class~=dock] [class~=icon]::after { padding-right: 2.25pt; } [class~=dock] [class~=icon] { border-right-style: none; } [class~=dock] [class~=icon]::after { padding-top: 3pt; } [class~=dock] [class~=icon]::after { border-radius: 6px; } [class~=dock] [class~=icon]:hover+[class~=icon] img { margin-left: 0; } [class~=dock] [class~=icon]:hover+[class~=icon] img { margin-bottom: 18.75pt; } [class~=dock] [class~=icon] { border-top-style: none; } [class~=dock] [class~=icon] { border-left-color: currentColor; } [class~=dock] [class~=icon]:hover+[class~=icon] img { margin-right: 0; } [class~=dock] [class~=icon]::after { font-family: var(--font-sf-pro-text); } [class~=dock] [class~=icon] { border-bottom-color: currentColor; } [class~=dock] [class~=icon]::after { font-weight: 500; } [class~=dock] [class~=icon]::after { color: white; } [class~=dock] [class~=icon]::after { -webkit-backdrop-filter: var(--system-blur-light); } [class~=dock] [class~=icon]::after { backdrop-filter: var(--system-blur-light); } ::-webkit-scrollbar-thumb { border-radius: 7.5pt; } [class~=dock] [class~=icon] img { width: 3.6rem; } [class~=dock] [class~=icon] { border-right-color: currentColor; } [class~=dock] [class~=icon] { border-top-color: currentColor; } [class~=dock] [class~=icon] { border-image: none; } [class~=dock] [class~=icon] img { transition: .2s; } [class~=dock] [class~=icon] img { transform: translateY(-2.5px); } [class~=dock] [class~=icon] { outline: none; } [class~=dock] [class~=icon] { transition: all .3s; } [class~=dock] [class~=icon] { transform: translate3d(0px,0%,0px); } [class~=dock] [class~=icon] { -webkit-tap-highlight-color: transparent; } ::-webkit-scrollbar-button { display: none; } @keyframes top-to-bottom { 0% { transform: translateY(-60px); opacity: 0; } 100% { transform: none; opacity: 1; } } [class~=modal] { display: none; } [class~=modal] { position: fixed; } [class~=modal] { z-index: 100; } [class~=modal] { left: 0; } .modal-content.animate-in { animation: modalContentIn .4s cubic-bezier(.68,-.55,.27,1.55) forwards; } [class~=modal] { top: 0; } [class~=modal] { width: 100%; } [class~=modal-content][class~=animate-out] { animation: modalContentOut .3s ease-in forwards; } [class~=modal] { height: 100%; } [class~=modal] { overflow: auto; } [class~=modal] { background-color: rgba(0,0,0,.7); } [class~=modal] { -webkit-backdrop-filter: blur(10px); } [class~=modal] { backdrop-filter: blur(10px); } [class~=modal] { opacity: 0; } [class~=modal] { transition: opacity .3s ease; } [class~=modal-content] { position: relative; } [class~=modal-content] { background: rgba(20,20,20,.95); } [class~=modal-content] { margin-left: auto; } [class~=modal-content] { margin-bottom: 10%; } [class~=modal-content] { margin-right: auto; } [class~=modal-content] { margin-top: 10%; } [class~=modal-content] { padding-left: 0; } [class~=modal-content] { padding-bottom: 0; } [class~=modal-content] { padding-right: 0; } [class~=modal-content] { padding-top: 0; } [class~=modal-content] { border-radius: 9pt; } [class~=modal-content] { width: 80%; } [class~=modal-content] { max-width: 8.333333333in; } [class~=modal-content] { box-shadow: 0 .041666667in .208333333in rgba(0,0,0,.3); } [class~=modal-content] { border-left-width: .75pt; } [class~=modal-content] { border-bottom-width: .75pt; } [class~=modal-content] { border-right-width: .75pt; } [class~=modal-content] { border-top-width: .75pt; } [class~=modal-content] { border-left-style: solid; } [class~=modal-content] { border-bottom-style: solid; } [class~=modal-content] { border-right-style: solid; } [class~=modal-content] { border-top-style: solid; } [class~=modal-content] { border-left-color: rgba(255,255,255,.1); } [class~=modal-content] { border-bottom-color: rgba(255,255,255,.1); } [class~=modal-content] { border-right-color: rgba(255,255,255,.1); } [class~=modal-content] { border-top-color: rgba(255,255,255,.1); } [class~=modal-content] { border-image: none; } [class~=modal-content] { overflow: hidden; } [class~=modal-content] { transition: all .3s cubic-bezier(.68,-.55,.27,1.55); } @keyframes modalContentIn { 0% { opacity: 0; transform: scale(.9) translateY(-20px); } 100% { opacity: 1; transform: scale(1) translateY(0); } } @keyframes modalContentOut { 0% { opacity: 1; transform: scale(1) translateY(0); } 100% { opacity: 0; transform: scale(.9) translateY(20px); } } .modal-header { padding-left: 11.25pt; } .modal-header { padding-bottom: 11.25pt; } .modal-header { padding-right: 11.25pt; } .modal-header { padding-top: 11.25pt; } .modal-header,[class~=close-modal] { display: flex; } [class~=close-modal] svg { width: 1.25pc; } .modal-header { justify-content: flex-end; } .modal-header,[class~=close-modal] { align-items: center; } .close-modal:hover { background-color: rgba(255,255,255,.1); } [class~=close-modal] svg { height: 15pt; } .modal-header { border-bottom-width: .0625pc; } .modal-header { border-bottom-style: solid; } [class~=profile-card]::before { content: ""; } .modal-header { border-bottom-color: rgba(255,255,255,.05); } [class~=profile-card]::before { position: absolute; } .modal-header { border-image: none; } [class~=close-modal] { background: transparent; } [class~=profile-card]::before { top: 0; } [class~=close-modal] { border-left-width: medium; } [class~=profile-card]::before { left: 0; } [class~=close-modal] { border-bottom-width: medium; } [class~=close-modal] { border-right-width: medium; } [class~=close-modal] { border-top-width: medium; } [class~=close-modal] { border-left-style: none; } [class~=close-modal] { border-bottom-style: none; } [class~=close-modal] { border-right-style: none; } [class~=profile-card]::before { right: 0; } [class~=profile-card]::before { height: .03125in; } [class~=close-modal] { border-top-style: none; } [class~=close-modal] { border-left-color: currentColor; } [class~=close-modal] { border-bottom-color: currentColor; } [class~=profile-card]::before { background: linear-gradient(90deg,#5865f2,#eb459e); } [class~=close-modal] { border-right-color: currentColor; } .profile-card:hover .avatar-glow,[class~=profile-card][class~=visible] { opacity: 1; } [class~=close-modal] { border-top-color: currentColor; } [class~=close-modal] { border-image: none; } [class~=close-modal] { color: #fff; } [class~=close-modal] { cursor: pointer; } [class~=close-modal] { width: 22.5pt; } [class~=close-modal] { height: 30px; } .profile-card:hover .avatar-glow { transform: scale(1.2); } [class~=close-modal],.profile-container { justify-content: center; } [class~=close-modal] { border-radius: 50%; } [class~=close-modal] { transition: background-color .2s ease; } [class~=close-modal] { padding-left: 0; } [class~=profile-card][class~=visible] { transform: translateY(0) scale(1); } [class~=close-modal] { padding-bottom: 0; } [class~=profile-card]:hover::before { transform: scaleX(1); } [class~=close-modal] { padding-right: 0; } [class~=close-modal] { padding-top: 0; } [class~=modal-body],[class~=profile-card] { padding-left: .208333333in; } [class~=profile-card],[class~=modal-body] { padding-bottom: .208333333in; } [class~=profile-card],[class~=modal-body] { padding-right: .208333333in; } [class~=profile-card],[class~=modal-body] { padding-top: .208333333in; } [class~=modal-body] { min-height: 2.083333333in; } [class~=modal-body] { max-height: 70vh; } [class~=modal-body] { overflow-y: auto; } .profile-container { display: flex; } .profile-container { flex-wrap: wrap; } [class~=profile-card]:hover { transform: translateY(-5px) scale(1.03); } .profile-container { gap: 20px; } .profile-container { min-height: 112.5pt; } [class~=profile-card],[class~=profile-avatar] { position: relative; } [class~=profile-card]:hover [class~=profile-avatar] img { transform: scale(1.1); } [class~=profile-card] { width: 1.875in; } [class~=profile-card]:hover [class~=profile-avatar] { transform: scale(1.05); } [class~=profile-card] { background: rgba(30,30,30,.7); } [class~=profile-card] { border-radius: .125in; } [class~=profile-card] { box-shadow: 0 3pt .15625in rgba(0,0,0,.2); } [class~=profile-card] { transition: all .3s cubic-bezier(.34,1.56,.64,1); } [class~=profile-card]:hover { box-shadow: 0 .625pc 1.5625pc rgba(0,0,0,.3); } [class~=profile-card]::before { transform: scaleX(0); } [class~=profile-card] { opacity: 0; } [class~=profile-card] { transform: translateY(20px) scale(.95); } [class~=profile-card] { border-left-width: .0625pc; } [class~=profile-card] { border-bottom-width: .0625pc; } [class~=profile-card] { border-right-width: .0625pc; } [class~=profile-card] { border-top-width: .0625pc; } [class~=profile-card] { border-left-style: solid; } [class~=profile-card] { border-bottom-style: solid; } [class~=profile-card]:hover { background: rgba(40,40,40,.8); } [class~=profile-card] { border-right-style: solid; } [class~=profile-card]:hover { border-left-color: rgba(114,137,218,.5); } [class~=profile-card] { border-top-style: solid; } [class~=profile-card] { border-left-color: rgba(255,255,255,.05); } [class~=profile-card] { border-bottom-color: rgba(255,255,255,.05); } [class~=profile-card] { border-right-color: rgba(255,255,255,.05); } [class~=profile-card] { border-top-color: rgba(255,255,255,.05); } [class~=profile-card]:hover { border-bottom-color: rgba(114,137,218,.5); } [class~=profile-card] { border-image: none; } [class~=profile-card] { cursor: pointer; } [class~=profile-avatar],[class~=profile-card] { overflow: hidden; } [class~=profile-card]:hover { border-right-color: rgba(114,137,218,.5); } [class~=profile-avatar] { width: 1.041666667in; } [class~=profile-card]::before { transform-origin: left; } [class~=profile-avatar] { height: 6.25pc; } [class~=profile-avatar] { margin-left: auto; } [class~=profile-avatar],[class~=display-name] { margin-bottom: 0; } [class~=profile-avatar] { margin-right: auto; } [class~=profile-avatar] { margin-top: 0; } [class~=profile-card]::before { transition: transform .3s ease; } [class~=profile-avatar],[class~=avatar-glow] { border-radius: 50%; } [class~=avatar-glow],[class~=profile-avatar] img { width: 100%; } [class~=profile-avatar] { border-left-width: .1875pc; } [class~=profile-avatar] { border-bottom-width: .1875pc; } [class~=profile-avatar] { border-right-width: .1875pc; } [class~=profile-avatar] { border-top-width: .1875pc; } [class~=profile-avatar] { border-left-style: solid; } [class~=profile-avatar] { border-bottom-style: solid; } [class~=profile-avatar] { border-right-style: solid; } [class~=profile-card]:hover { border-top-color: rgba(114,137,218,.5); } [class~=profile-avatar] { border-top-style: solid; } [class~=profile-avatar] { border-left-color: rgba(255,255,255,.1); } [class~=profile-avatar] { border-bottom-color: rgba(255,255,255,.1); } [class~=profile-avatar] { border-right-color: rgba(255,255,255,.1); } [class~=avatar-glow],[class~=profile-avatar] img { height: 100%; } [class~=profile-avatar] { border-top-color: rgba(255,255,255,.1); } [class~=profile-avatar] { border-image: none; } [class~=profile-avatar],[class~=avatar-glow] { transition: all .3s ease; } [class~=avatar-glow] { position: absolute; } [class~=avatar-glow] { top: 0; } [class~=avatar-glow] { left: 0; } [class~=avatar-glow] { background: radial-gradient(circle,rgba(88,101,242,.3) 0%,rgba(88,101,242,0) 70%); } [class~=avatar-glow] { opacity: 0; } [class~=avatar-glow] { transform: scale(.8); } [class~=profile-card]:hover [class~=profile-avatar] { border-left-color: rgba(114,137,218,.7); } [class~=profile-info] { margin-top: 11.25pt; } [class~=profile-info] { text-align: center; } [class~=profile-card]:hover [class~=profile-avatar] { border-bottom-color: rgba(114,137,218,.7); } [class~=profile-avatar] img { object-fit: cover; } [class~=profile-info] { transition: transform .3s ease; } [class~=display-name],[class~=username] { margin-left: 0; } [class~=display-name],[class~=username] { margin-right: 0; } [class~=display-name] { margin-top: 0; } [class~=display-name] { color: #fff; } [class~=display-name] { font-size: 1pc; } [class~=profile-card]:hover [class~=profile-avatar] { border-right-color: rgba(114,137,218,.7); } [class~=display-name] { font-weight: 600; } [class~=display-name],[class~=username] { font-family: var(--font-sf-pro,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif); } [class~=profile-card]:hover [class~=profile-avatar] { border-top-color: rgba(114,137,218,.7); } [class~=display-name] { overflow: hidden; } [class~=display-name] { text-overflow: ellipsis; } [class~=display-name] { white-space: nowrap; } [class~=username],[class~=display-name] { transition: color .3s ease; } [class~=username] { margin-bottom: 0; } [class~=profile-card]:hover [class~=profile-info] { transform: translateY(-2px); } [class~=profile-avatar] img { transition: transform .5s ease; } [class~=username] { margin-top: .3125pc; } [class~=username] { color: #a0a0a0; } [class~=username] { font-size: .145833333in; } [class~=loading-indicator] { display: flex; } [class~=loading-indicator] { justify-content: center; } [class~=loading-indicator] { align-items: center; } [class~=loading-indicator] { height: 12.5pc; } [class~=spinner] { width: 40px; } [class~=spinner] { height: 40px; } [class~=spinner] { border-left-width: .1875pc; } [class~=spinner] { border-bottom-width: .1875pc; } [class~=spinner] { border-right-width: .1875pc; } [class~=spinner] { border-top-width: .03125in; } [class~=spinner] { border-left-style: solid; } [class~=spinner] { border-bottom-style: solid; } [class~=spinner] { border-right-style: solid; } [class~=spinner] { border-top-style: solid; } [class~=spinner] { border-left-color: rgba(255,255,255,.1); } [class~=spinner] { border-bottom-color: rgba(255,255,255,.1); } [class~=spinner] { border-right-color: rgba(255,255,255,.1); } [class~=spinner] { border-top-color: #5865f2; } [class~=spinner] { border-image: none; } [class~=spinner] { border-radius: 50%; } [class~=spinner] { animation: spin .8s cubic-bezier(.68,-.55,.27,1.55) infinite; } .profile-card:hover .display-name { color: #5865f2; } [class~=profile-card]:hover [class~=username] { color: #c0c0c0; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeInScale { from { opacity: 0; transform: scale(.95); } to { opacity: 1; transform: scale(1); } } @keyframes pulse { 0% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.05); opacity: .8; } 100% { transform: scale(1); opacity: 1; } } @media (max-width: 768px) { [class~=modal-content] { width:95%; } [class~=modal-content] { margin-left: auto; } [class~=modal-content] { margin-bottom: 5%; } [class~=modal-content] { margin-right: auto; } [class~=modal-content] { margin-top: 5%; } }