:root {
  --bg: #000;
  --surface-1: #0A0A0A;
  --surface-2: #111;
  --gray-1: #1A1A1A;
  --gray-2: #2A2A2A;
  --gray-3: #3A3A3A;
  --gray-4: #5A5A5A;
  --gray-5: #8A8A8A;
  --text: #FFF;
  --text-dim: #B8B8B8;
  --cyan: #00F0FF;
  --magenta: #FF2BD6;
  --lime: #B6FF00;
  --grad-brand: linear-gradient(90deg, var(--cyan) 0%, var(--magenta) 55%, var(--lime) 100%);
  --clear: transparent;
  --panel: var(--surface-2);
  --pink: var(--magenta);
  --mag: var(--magenta);
  --yellow: var(--text);
  --green: var(--lime);
  --muted: var(--text-dim);
  --line: var(--gray-3);
  --surface-1-a95: color-mix(in srgb, var(--surface-1) 95%, transparent);
  --magenta-a5: color-mix(in srgb, var(--magenta) 5%, transparent);
  --magenta-a50: color-mix(in srgb, var(--magenta) 50%, transparent);
  --bg-a15: color-mix(in srgb, var(--bg) 15%, transparent);
  --bg-a55: color-mix(in srgb, var(--bg) 55%, transparent);
  --bg-a60: color-mix(in srgb, var(--bg) 60%, transparent);
  --magenta-a45: color-mix(in srgb, var(--magenta) 45%, transparent);
  --magenta-a30: color-mix(in srgb, var(--magenta) 30%, transparent);
  --surface-2-a95: color-mix(in srgb, var(--surface-2) 95%, transparent);
  --lime-a5: color-mix(in srgb, var(--lime) 5%, transparent);
  --cyan-a5: color-mix(in srgb, var(--cyan) 5%, transparent);
  --surface-1-a70: color-mix(in srgb, var(--surface-1) 70%, transparent);
  --text-a35: color-mix(in srgb, var(--text) 35%, transparent);
  --surface-1-a35: color-mix(in srgb, var(--surface-1) 35%, transparent);
  --text-a30: color-mix(in srgb, var(--text) 30%, transparent);
  --text-a5: color-mix(in srgb, var(--text) 5%, transparent);
  --surface-1-a90: color-mix(in srgb, var(--surface-1) 90%, transparent);
  --surface-1-a25: color-mix(in srgb, var(--surface-1) 25%, transparent);
  --magenta-a40: color-mix(in srgb, var(--magenta) 40%, transparent);
  --magenta-a20: color-mix(in srgb, var(--magenta) 20%, transparent);
  --text-a15: color-mix(in srgb, var(--text) 15%, transparent);
  --text-a25: color-mix(in srgb, var(--text) 25%, transparent);
  --surface-2-a100: color-mix(in srgb, var(--surface-2) 100%, transparent);
  --bg-a75: color-mix(in srgb, var(--bg) 75%, transparent);
  --bg-a85: color-mix(in srgb, var(--bg) 85%, transparent);
  --cyan-a55: color-mix(in srgb, var(--cyan) 55%, transparent);
  --bg-a95: color-mix(in srgb, var(--bg) 95%, transparent);
  --text-a20: color-mix(in srgb, var(--text) 20%, transparent);
  --text-a10: color-mix(in srgb, var(--text) 10%, transparent);
  --bg-a40: color-mix(in srgb, var(--bg) 40%, transparent);
  --bg-a20: color-mix(in srgb, var(--bg) 20%, transparent);
  --text-dim-a5: color-mix(in srgb, var(--text-dim) 5%, transparent);
  --bg-a35: color-mix(in srgb, var(--bg) 35%, transparent);
  --bg-a90: color-mix(in srgb, var(--bg) 90%, transparent);
  --cyan-a20: color-mix(in srgb, var(--cyan) 20%, transparent);
  --surface-1-a65: color-mix(in srgb, var(--surface-1) 65%, transparent);
  --bg-a80: color-mix(in srgb, var(--bg) 80%, transparent);
  --bg-a65: color-mix(in srgb, var(--bg) 65%, transparent);
  --cyan-a35: color-mix(in srgb, var(--cyan) 35%, transparent);
  --bg-a45: color-mix(in srgb, var(--bg) 45%, transparent);
  --bg-a25: color-mix(in srgb, var(--bg) 25%, transparent);
  --cyan-a15: color-mix(in srgb, var(--cyan) 15%, transparent);
  --cyan-a30: color-mix(in srgb, var(--cyan) 30%, transparent);
  --surface-2-a85: color-mix(in srgb, var(--surface-2) 85%, transparent);
  --text-dim-a70: color-mix(in srgb, var(--text-dim) 70%, transparent);
  --surface-1-a55: color-mix(in srgb, var(--surface-1) 55%, transparent);
  --cyan-a40: color-mix(in srgb, var(--cyan) 40%, transparent);
  --cyan-a10: color-mix(in srgb, var(--cyan) 10%, transparent);
  --text-a55: color-mix(in srgb, var(--text) 55%, transparent);
  --surface-1-a80: color-mix(in srgb, var(--surface-1) 80%, transparent);
  --gray-1-a95: color-mix(in srgb, var(--gray-1) 95%, transparent);
  --magenta-a15: color-mix(in srgb, var(--magenta) 15%, transparent);
  --lime-a10: color-mix(in srgb, var(--lime) 10%, transparent);
  --lime-a35: color-mix(in srgb, var(--lime) 35%, transparent);
  --glow-cyan: 0 0 24px color-mix(in srgb, var(--cyan) 25%, transparent);
  --glow-magenta: 0 0 24px color-mix(in srgb, var(--magenta) 25%, transparent);
  --glow-lime: 0 0 24px color-mix(in srgb, var(--lime) 25%, transparent);
  --glow-focus: 0 0 0 2px var(--bg), 0 0 0 5px var(--cyan), var(--glow-cyan);
}

/* Shared scrolling chrome for every platform page and long panel. */
*{scrollbar-width:thin;scrollbar-color:var(--clear) var(--clear)}
*:hover,*.is-scrolling{scrollbar-color:var(--cyan) var(--clear)}
/* Prefer the gradient thumb in engines supporting WebKit scrollbar styling. */
@supports selector(::-webkit-scrollbar){
 *,*:hover,*.is-scrolling{scrollbar-width:auto;scrollbar-color:auto}
 *::-webkit-scrollbar{width:6px;height:6px}
 *::-webkit-scrollbar-track,*::-webkit-scrollbar-corner{background:var(--clear)}
 *::-webkit-scrollbar-thumb{background:var(--clear);border-radius:6px}
 *:hover::-webkit-scrollbar-thumb,*.is-scrolling::-webkit-scrollbar-thumb{background:linear-gradient(var(--cyan),var(--magenta))}
}
:is(.console-row,.console-genres,.console-categories,.console-hub-tabs,.fs-tabs,.console-rail){scrollbar-width:none!important}
:is(.console-row,.console-genres,.console-categories,.console-hub-tabs,.fs-tabs,.console-rail)::-webkit-scrollbar{display:none}
.can-scroll-left{mask-image:linear-gradient(90deg,var(--clear),var(--bg) 28px)}
.can-scroll-right{mask-image:linear-gradient(90deg,var(--bg) calc(100% - 28px),var(--clear))}
.can-scroll-left.can-scroll-right{mask-image:linear-gradient(90deg,var(--clear),var(--bg) 28px,var(--bg) calc(100% - 28px),var(--clear))}
