*,
*:before,
*:after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-weight: normal; }

body {
  min-height: 100vh; }

a {
  color: inherit; }

button {
  border: none;
  font-family: inherit;
  background-color: inherit; }

button:focus {
  outline: none; }

ul {
  list-style: none; }

img {
  display: block; }

input[type="range"] {
  appearance: none;
  /* Hides the slider so that custom slider can be made */
  background-color: transparent;
  /* Otherwise white in Chrome */ }
  input[type="range"]::-webkit-slider-thumb {
    appearance: none;
    margin-top: -4px; }
  input[type="range"]:focus {
    outline: none;
    /* Removes the blue border */ }
  input[type="range"]::-ms-track {
    width: 100%;
    /* Hides the slider so custom styles can be added */
    background: transparent;
    border-color: transparent;
    color: transparent; }

input[type="search"] {
  font-size: inherit;
  font-family: inherit;
  color: inherit;
  width: 100%;
  height: 100%;
  outline: none;
  border: 0; }
  input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration {
    -webkit-appearance: none; }

::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background-color: var(--color-surface-primary); }

::-webkit-scrollbar-thumb {
  border-width: 0;
  background-color: var(--color-surface-quaternary);
  background-clip: padding-box; }

::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-surface-quaternary); }

::-webkit-scrollbar-corner {
  background-color: transparent; }

::-webkit-scrollbar-track-piece {
  background-color: transparent; }

@font-face {
  font-family: 'Lato';
  src: url("../assets/fonts/lato/Lato-Regular.woff2") format("woff2");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Lato';
  src: url("../assets/fonts/lato/Lato-Bold.woff2") format("woff2");
  font-weight: bold;
  font-style: normal; }

@font-face {
  font-family: 'Montserrat';
  src: url("../assets/fonts/montserrat/montserrat-regular.woff2") format("woff2");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Montserrat';
  src: url("../assets/fonts/montserrat/montserrat-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal; }

@font-face {
  font-family: 'Montserrat';
  src: url("../assets/fonts/montserrat/montserrat-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal; }

@font-face {
  font-family: 'Montserrat';
  src: url("../assets/fonts/montserrat/montserrat-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: 'Montserrat';
  src: url("../assets/fonts/montserrat/montserrat-900.woff2") format("woff2");
  font-weight: 900;
  font-style: normal; }

body {
  color: var(--color-text-secondary);
  font-family: var(--font-family-default);
  font-size: 16px;
  line-height: 150%;
  user-select: none; }

h1, h2 {
  font-family: var(--font-family-brand); }

h1 {
  font-size: var(--font-size-500);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-pure);
  line-height: var(--font-line-height-700);
  margin-bottom: 32px; }
  h1 > span {
    font-weight: var(--font-weight-bold); }

h2 {
  color: var(--color-text-primary);
  font-weight: var(--font-weight-semi-bold);
  line-height: var(--font-line-height-650);
  font-size: 18px;
  margin-bottom: 16px; }
  h2 span {
    font-weight: var(--font-weight-semi-bold); }

h3 {
  color: var(--color-text-secondary);
  font-size: var(--font-size-400);
  font-weight: var(--font-weight-bold);
  line-height: var(--font-line-height-600);
  margin-bottom: 8px; }

a {
  transition: .15s color; }
  a:hover {
    color: var(--color-text-brand-ow-hover);
    text-decoration: none !important; }

.svg-icon-fill {
  fill: currentcolor; }

button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  cursor: default;
  transition: 150ms;
  height: 32px;
  color: inherit; }
  button.button--icon {
    width: 32px;
    height: 32px; }
    button.button--icon svg {
      width: 100%;
      height: 100%;
      flex: 0 0 auto;
      pointer-events: none;
      user-select: none; }
    button.button--icon.button--icon--small {
      width: 24px;
      height: 24px; }
    button.button--icon.button--icon--old {
      width: 32px;
      height: 32px; }
  button.button--text {
    font-family: var(--font-family-brand);
    min-width: 80px;
    height: 32px;
    padding: 0 16px;
    border: 1px solid var(--color-border-secondary);
    font-size: inherit;
    color: var(--color-text-primary);
    background-color: transparent;
    transition: 150ms all, 300ms opacity; }
    button.button--text:hover {
      background-color: var(--color-surface-brand-ow-hover);
      border-color: var(--color-surface-brand-ow-hover);
      color: var(--color-text-cta-ow); }
    button.button--text.button--text--small {
      min-width: 80px; }
    button.button--text.button--text--invisible {
      border: 0; }
    button.button--text.button--text--flippable {
      font-weight: var(--font-weight-medium);
      border: none; }
      button.button--text.button--text--flippable span {
        margin-right: 4px; }
      button.button--text.button--text--flippable svg {
        margin-left: auto;
        transition: transform .15s;
        width: 20px;
        height: 20px;
        fill: var(--color-icon-secondary); }
      button.button--text.button--text--flippable:hover {
        color: var(--color-text-primary);
        background: var(--color-surface-on-surface-primary-hover); }
      button.button--text.button--text--flippable.active svg {
        transform: rotate(-180deg); }
    button.button--text.button--text--cta {
      border: 0;
      color: var(--color-text-cta-ow);
      background-color: var(--color-surface-brand-ow); }
      button.button--text.button--text--cta:hover {
        background-color: var(--color-surface-brand-ow-hover);
        border-color: var(--color-surface-brand-ow-hover);
        color: var(--color-text-cta-ow); }
    button.button--text.disabled {
      opacity: 0.3;
      pointer-events: none; }

input[type="range"] {
  height: 16px;
  width: 100%;
  color: var(--color-icon-brand-ow); }
  input[type="range"]:hover, input[type="range"]:active {
    color: var(--color-brand-ow-hover); }
  input[type="range"]::-webkit-slider-runnable-track {
    display: flex;
    align-items: center;
    height: 4px;
    background: linear-gradient(to right, currentColor calc(var(--value) * 1%), var(--color-surface-on-surface-secondary) 0); }
  input[type="range"]::-webkit-slider-thumb {
    width: 12px;
    height: 12px;
    margin-top: -4px;
    border-radius: 50%;
    transition: 150ms;
    background: currentColor; }

.input-range-slider-container {
  width: 100%;
  margin-top: 24px;
  height: 20px;
  position: relative; }
  .input-range-slider-container input[type=range] {
    appearance: none;
    width: 100%;
    height: 4px;
    padding: 0;
    margin: 0;
    color: var(--color-surface-on-surface-secondary); }
    .input-range-slider-container input[type=range]::-webkit-slider-runnable-track {
      width: 100%;
      cursor: pointer;
      height: 4px; }
    .input-range-slider-container input[type=range]::-webkit-slider-thumb {
      height: 12px;
      width: 12px;
      position: relative;
      z-index: 1;
      border-radius: 50%;
      background-color: var(--color-icon-brand-ow);
      -webkit-appearance: none;
      transition: all 150ms ease-in-out;
      margin-top: -4px; }
    .input-range-slider-container input[type=range]:hover::-webkit-slider-thumb {
      background-color: var(--color-icon-brand-ow);
      box-shadow: 0px 0px 0px 2px var(--color-icon-brand-ow); }
  .input-range-slider-container .range-value-floater {
    position: absolute;
    top: -16px;
    pointer-events: none;
    font-size: 12px;
    height: 12px;
    line-height: 12px; }
    .input-range-slider-container .range-value-floater .range-output {
      color: var(--color-text-primary);
      font-family: var(--font-family-brand);
      font-size: var(--font-size-300);
      line-height: var(--font-line-height-400);
      width: 100px;
      height: 12px;
      pointer-events: none;
      text-align: center;
      position: absolute;
      left: 50%;
      transform: translate(-50%, 0); }
  .input-range-slider-container .progress-line {
    position: absolute;
    z-index: 0;
    height: 4px;
    left: 0;
    bottom: 3px;
    border-radius: 10px;
    background: var(--color-brand-ow-hover);
    pointer-events: none; }

.window-control {
  color: var(--color-icon-secondary);
  background-color: transparent; }
  .window-control:hover {
    color: var(--color-icon-primary);
    background-color: var(--color-surface-on-surface-primary-hover); }
  .window-control.window-control--close:hover {
    background-color: var(--color-surface-brand-ow-hover);
    color: var(--color-text-cta-ow); }

.caption {
  margin-top: 8px;
  font-size: 14px; }

.radio-button {
  height: 20px;
  display: flex; }
  .radio-button + .radio-button {
    margin-top: 12px; }
  .radio-button label {
    display: flex;
    align-items: center;
    flex: 1; }
    .radio-button label p span, .radio-button label p {
      color: var(--color-text-secondary);
      font-size: var(--font-size-350);
      font-weight: var(--font-weight-regular);
      line-height: var(--font-line-height-500); }
  .radio-button b {
    order: -1;
    flex-shrink: 0;
    display: flex;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin-right: 8px;
    position: relative;
    background-color: transparent;
    border: 2px solid var(--color-border-secondary);
    transition: border 0.15s; }
    .radio-button b:before {
      content: "";
      position: absolute;
      opacity: 0;
      transition: .15s; }
  .radio-button input[type="radio"] + label b:before {
    top: -1px;
    bottom: -1px;
    left: -1px;
    right: -1px;
    transform: scale(0);
    transition: 300ms cubic-bezier(0.68, -0.8, 0.265, 1.8);
    background: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27100%25%27%20height%3D%27100%25%27%20viewBox%3D%270%200%2024%2024%27%3E%5Ca%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%275%27%20fill%3D%27%23F4F2FF%27%2F%3E%5Ca%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E"); }
  .radio-button:hover b {
    border-color: var(--color-border-primary);
    background-color: var(--color-surface-on-surface-primary-hover); }
  .radio-button input[type="radio"]:checked + label b {
    background-color: var(--color-surface-brand-ow);
    border-color: var(--color-surface-brand-ow); }
    .radio-button input[type="radio"]:checked + label b:before {
      transform: scale(1.3);
      opacity: 1; }

.text-ellipsis, .hotkey-input .hotkey-input__text, .dropdown .dropdown-selected-item span, .folder-selector > p > span:first-child, nav.side-tab-navigation > ul > li > button > span, .tab-content--hotkeys ul.hotkey-list > li > span, .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > header > span {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap; }

.hotkey-input {
  display: flex;
  align-items: center;
  border: solid 1px transparent;
  width: 208px;
  min-width: 208px;
  height: 36px;
  padding: 8px;
  transition: 150ms;
  position: relative; }
  .hotkey-input .hotkey-input__text {
    flex-grow: 1;
    transition: color .15s;
    padding: 0 4px; }
    .hotkey-input .hotkey-input__text.unassigned {
      color: var(--color-surface-tertiary); }
  .hotkey-input svg.hotkey-input__clear {
    width: 20px;
    height: 20px;
    margin: 0 4px;
    fill: currentColor;
    transition: color .15s, transform .3s, opacity .3s;
    opacity: 0;
    transform: translateX(2px); }
    .hotkey-input svg.hotkey-input__clear:hover {
      color: var(--color-text-tertiary); }
  .hotkey-input .hotkey-input__validation {
    position: absolute;
    pointer-events: none;
    display: block;
    width: max-content;
    text-align: right;
    opacity: 0;
    font-family: var(--font-family-default);
    font-weight: bold;
    padding: 4px 8px; }
    .hotkey-input .hotkey-input__validation.active {
      animation: 2.5s ghost; }

@keyframes ghost {
  0% {
    opacity: 0;
    right: 105%; }
  20% {
    opacity: 1;
    right: 105%; }
  80% {
    opacity: 1;
    right: 105%; }
  100% {
    opacity: 0;
    right: 113%; } }
  .hotkey-input:hover .hotkey-input__text {
    color: var(--color-text-tertiary); }
  .hotkey-input:hover svg.hotkey-input__clear.active {
    opacity: 1;
    transform: translateX(0); }
  .hotkey-input.active {
    border: solid 1px var(--color-brand-ow); }
    .hotkey-input.active .hotkey-input__text {
      animation: 1.5s ease-in-out breath infinite; }

@keyframes breath {
  0% {
    color: var(--color-text-tertiary); }
  50% {
    color: var(--color-neutral-40); }
  100% {
    color: var(--color-text-tertiary); } }
  .hotkey-input.shake {
    animation: 0.5s shake; }

@keyframes shake {
  0% {
    left: 0; }
  10% {
    left: -2px; }
  30% {
    left: 2px; }
  50% {
    left: -2px; }
  70% {
    left: 2px; }
  90% {
    left: -2px; }
  100% {
    left: 0; } }

.toggle {
  min-height: 20px;
  display: flex; }
  .toggle label {
    display: flex;
    flex: 1; }
    .toggle label > * + * {
      margin-left: 16px; }
  .toggle span {
    flex-grow: 1;
    color: var(--color-text-secondary);
    font-size: var(--font-size-350);
    line-height: var(--font-line-height-500); }
  .toggle b {
    flex-shrink: 0;
    display: flex;
    width: 32px;
    height: 20px;
    border-radius: 12.5px;
    position: relative;
    background-color: var(--color-surface-on-surface-secondary);
    transition: background-color 0.15s; }
    .toggle b:before {
      content: "";
      position: absolute;
      transition: .15s; }
  .toggle input[type="checkbox"] + label b:before {
    top: 0;
    bottom: 0;
    left: 0;
    margin: 4px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: var(--color-icon-secondary);
    transition: 300ms; }
  .toggle input[type="checkbox"]:checked + label b {
    background-color: var(--color-brand-ow); }
    .toggle input[type="checkbox"]:checked + label b:before {
      transform: translateX(12px);
      background-color: var(--color-surface-invert); }
  .toggle:hover b {
    background-color: var(--color-surface-on-surface-secondary-hover); }
  .toggle:hover input[type="checkbox"]:checked + label b {
    background-color: var(--color-brand-ow-hover); }
  .toggle.toggle--multiline {
    height: auto; }
    .toggle.toggle--multiline label {
      overflow: auto; }
    .toggle.toggle--multiline span {
      text-overflow: unset;
      overflow: unset;
      white-space: unset; }
    .toggle.toggle--multiline:has(.ng-more-info) label {
      overflow: unset; }

.dropdown {
  height: 36px;
  align-self: flex-start;
  position: relative;
  transition: opacity 150ms; }
  .dropdown .dropdown-selected-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 12px;
    background-color: var(--color-surface-on-surface-secondary);
    transition: border 150ms, color 150ms;
    height: 100%;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent; }
    .dropdown .dropdown-selected-item:hover {
      background-color: var(--color-surface-on-surface-secondary-hover); }
    .dropdown .dropdown-selected-item span {
      margin-right: 5px;
      color: var(--color-text-primary);
      font-size: var(--font-size-350);
      font-weight: var(--font-weight-regular);
      line-height: var(--font-line-height-500); }
    .dropdown .dropdown-selected-item i {
      margin-left: auto;
      transition: transform .15s;
      width: 20px;
      height: 20px; }
      .dropdown .dropdown-selected-item i svg {
        width: 100%;
        height: 100%;
        fill: var(--color-icon-secondary); }
  .dropdown .dropdown-list-wrapper {
    pointer-events: none;
    position: relative;
    height: 0;
    overflow: hidden;
    z-index: 1;
    transition: height 150ms, box-shadow 150ms; }
    .dropdown .dropdown-list-wrapper .dropdown-list {
      pointer-events: auto;
      border: 1px solid var(--color-border-tertiary);
      background-color: var(--color-surface-tertiary);
      list-style: none;
      overflow: auto;
      transform: translateY(-100%);
      transition: 150ms;
      margin-top: 2px;
      padding: 8px 0; }
      .dropdown .dropdown-list-wrapper .dropdown-list li {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 0 12px;
        height: 32px;
        color: var(--color-text-primary);
        font-size: var(--font-size-350);
        line-height: 32px;
        background-color: transparent;
        transition: 0.15s; }
        .dropdown .dropdown-list-wrapper .dropdown-list li:hover {
          background-color: var(--color-surface-on-surface-primary-hover); }
        .dropdown .dropdown-list-wrapper .dropdown-list li.active {
          font-weight: var(--font-weight-bold);
          background-color: var(--color-surface-tertiary); }
        .dropdown .dropdown-list-wrapper .dropdown-list li.disabled {
          pointer-events: none;
          opacity: 0.4; }
        .dropdown .dropdown-list-wrapper .dropdown-list li span {
          pointer-events: none; }
  .dropdown:hover .dropdown-selected-item, .dropdown.active .dropdown-selected-item {
    color: var(--color-text-tertiary); }
  .dropdown.active {
    z-index: 1;
    transition: opacity 150ms, z-index 150ms 0ms;
    filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5)); }
    .dropdown.active .dropdown-selected-item {
      border-bottom: 1px solid var(--color-surface-primary); }
    .dropdown.active .dropdown-selected-item i {
      transform: rotate(-180deg); }
    .dropdown.active .dropdown-list-wrapper {
      height: calc(var(--content-height) + 5px); }
    .dropdown.active .dropdown-list {
      opacity: 1;
      transform: translateY(0);
      transition: 150ms, opacity 150ms; }
  .dropdown.dropdown--reversed .dropdown-list-wrapper {
    transform: translateY(-102%);
    bottom: 100%; }
    .dropdown.dropdown--reversed .dropdown-list-wrapper .dropdown-list {
      transform: translateY(0); }
  .dropdown.dropdown--reversed.active .dropdown-selected-item {
    border-top: 1px solid var(--color-surface-primary);
    border-bottom: 1px solid transparent; }
  .dropdown.disabled {
    pointer-events: none;
    opacity: 0.3; }

.info-box {
  background: var(--color-surface-info-solid);
  padding: 8px 16px;
  color: var(--color-text-tertiary);
  text-align: center; }
  .info-box:not(.active) {
    display: none; }
  .info-box > a {
    color: inherit;
    margin-left: 32px; }

.subsection-selector {
  display: flex;
  border-bottom: 1px solid var(--color-border-on-surface);
  position: relative; }
  .subsection-selector::before {
    content: "";
    position: absolute;
    bottom: 0;
    width: 66px;
    height: 2px;
    background-color: var(--color-surface-brand-ow);
    transition: transform 300ms; }
  .subsection-selector.audio::before {
    transform: translate(66px); }
  .subsection-selector > button {
    width: 66px;
    color: var(--color-text-tertiary);
    font-family: var(--font-family-brand);
    font-size: var(--font-size-350);
    font-weight: var(--font-weight-medium);
    line-height: var(--font-line-height-500);
    margin-bottom: 2px;
    padding-bottom: 8px; }
    .subsection-selector > button:hover, .subsection-selector > button.active {
      color: var(--color-text-primary); }

.folder-selector {
  display: flex; }
  .folder-selector > p {
    flex: 1;
    display: flex;
    align-items: center;
    background-color: var(--color-surface-on-surface-primary);
    overflow: hidden;
    padding: 0 12px;
    margin-right: 4px; }
    .folder-selector > p > span {
      color: var(--color-text-primary);
      font-size: var(--font-size-350);
      line-height: var(--font-line-height-500); }
      .folder-selector > p > span:last-child {
        flex-shrink: 0; }
  .folder-selector > * + * {
    margin-left: 8px; }

.corner-selector {
  position: relative;
  transition: opacity 300ms; }
  .corner-selector .corner-selector__button {
    position: absolute;
    width: 48px;
    height: 36px;
    padding: 8px;
    box-sizing: content-box; }
    .corner-selector .corner-selector__button::before {
      content: "";
      background-color: var(--color-surface-on-surface-secondary);
      width: 48px;
      height: 36px;
      transition: .15s; }
    .corner-selector .corner-selector__button:hover::before {
      background-color: var(--color-surface-on-surface-secondary-hover); }
    .corner-selector .corner-selector__button.corner-selector__button__top-left {
      top: 6px;
      left: 6px; }
    .corner-selector .corner-selector__button.corner-selector__button__top-right {
      top: 6px;
      right: 6px; }
    .corner-selector .corner-selector__button.corner-selector__button__bottom-left {
      bottom: 34px;
      left: 6px; }
    .corner-selector .corner-selector__button.corner-selector__button__bottom-right {
      bottom: 34px;
      right: 6px; }
  .corner-selector::after {
    content: "";
    position: absolute;
    transition: 300ms cubic-bezier(0.68, -0.15, 0.265, 1.15);
    width: 48px;
    height: 36px;
    margin: 8px;
    background-color: var(--color-surface-brand-ow);
    top: 6px;
    left: 6px; }
  .corner-selector.selected--top-left::after {
    transform: translate(0, 0); }
  .corner-selector.selected--top-right::after {
    transform: translate(188px, 0); }
  .corner-selector.selected--bottom-left::after {
    transform: translate(0, 104px); }
  .corner-selector.selected--bottom-right::after {
    transform: translate(188px, 104px); }
  .corner-selector.disabled {
    opacity: 0.3;
    pointer-events: none; }

.search-box {
  position: relative; }
  .search-box i {
    transition: 300ms;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 6px;
    pointer-events: none; }
    .search-box i svg {
      width: 100%;
      height: 100%;
      fill: currentColor; }
  .search-box > input[type="search"] {
    background-color: var(--color-surface-on-surface-primary);
    border: 1px solid var(--color-border-on-surface);
    padding: 2px 34px 0 32px;
    transition: 150ms;
    color: var(--color-text-primary);
    font-size: var(--font-size-350);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-line-height-500);
    min-height: 32px; }
    .search-box > input[type="search"]:hover, .search-box > input[type="search"]:focus {
      border-color: var(--color-border-primary); }
    .search-box > input[type="search"]::placeholder {
      color: var(--color-text-tertiary); }

.progress-bar {
  width: 248px;
  height: 4px;
  background: linear-gradient(to right, var(--color-icon-brand-ow) calc(var(--value) * 1%), var(--color-surface-on-surface-secondary) 0); }
  .progress-bar.progress-bar--infinite {
    background-color: var(--color-icon-brand-ow);
    background-image: linear-gradient(-45deg, transparent, transparent 30%, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0.5) 70%, transparent 70%);
    background-size: 14px 4px; }
    .progress-bar.progress-bar--infinite.active {
      animation: slide 200ms linear infinite; }

@keyframes slide {
  from {
    background-position-x: 0; }
  to {
    background-position-x: 14px; } }

.more-info {
  margin-left: 2px;
  width: 20px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
  position: relative; }
  .more-info::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    -webkit-mask-image: url("../../../../assets/svg/more-info.svg");
    background-color: var(--color-icon-secondary); }
  .more-info:hover::before {
    background-color: var(--color-icon-primary); }

.tooltip {
  width: 272px;
  position: absolute;
  display: flex;
  flex-direction: column;
  z-index: 2;
  transition: 200ms opacity; }
  .tooltip::before {
    content: "";
    width: 16px;
    height: 8px;
    position: relative;
    transform: translateX(-50%);
    left: var(--arrow-offset);
    -webkit-mask-image: url("../assets/svg/triangle-arrow.svg");
    background-color: var(--color-surface-tooltip); }
  .tooltip p {
    color: var(--color-text-primary);
    font-size: var(--font-size-350);
    font-family: var(--font-family-default);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-line-height-500);
    background-color: var(--color-surface-tooltip);
    padding: var(--space-400); }
  .tooltip:not(.point-up) {
    top: 0;
    margin-top: 12px;
    padding-top: 12px; }
  .tooltip.point-up {
    bottom: 0;
    margin-bottom: 12px;
    padding-bottom: 12px; }
    .tooltip.point-up::before {
      order: 1;
      transform: translateX(-50%) scaleY(-1); }
  .tooltip:not(.ever-shown) {
    max-height: 0;
    overflow: hidden; }
  .tooltip:not(.active) {
    opacity: 0;
    pointer-events: none; }

.overlay-popup {
  opacity: 1;
  transition: .3s opacity;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center; }
  .overlay-popup:not(.active) {
    pointer-events: none;
    opacity: 0; }
  .overlay-popup .overlay-popup__overlay {
    background-color: rgba(var(--color-background-general), 0.9);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
  .overlay-popup .overlay-popup__popup {
    background-color: var(--color-surface-secondary);
    border: 1px solid var(--color-border-quaternary);
    position: relative;
    width: 408px;
    padding: var(--space-500) var(--space-600) var(--space-600);
    display: flex;
    flex-direction: column; }
    .overlay-popup .overlay-popup__popup .window-control--close {
      position: absolute;
      right: 0;
      top: 0; }
    .overlay-popup .overlay-popup__popup .overlay-popup__popup__buttons {
      margin-top: 24px;
      margin-left: auto;
      display: flex; }
      .overlay-popup .overlay-popup__popup .overlay-popup__popup__buttons > * + * {
        margin-left: 12px; }
    .overlay-popup .overlay-popup__popup > h2 {
      display: flex; }
      .overlay-popup .overlay-popup__popup > h2 > img {
        width: 24px;
        height: 24px;
        margin-right: 12px; }

.resize {
  position: absolute;
  z-index: 1000; }
  .resize.top {
    top: 0;
    cursor: n-resize; }
  .resize.bottom {
    bottom: 0;
    cursor: s-resize; }
  .resize.left {
    left: 0;
    cursor: e-resize; }
  .resize.right {
    right: 0;
    cursor: w-resize; }
  .resize.horizontal {
    left: 0;
    right: 0;
    height: 10px; }
  .resize.vertical {
    top: 0;
    bottom: 0;
    width: 10px; }
  .resize.corner {
    width: 10px;
    height: 10px; }
  .resize.top-left {
    top: 0;
    left: 0;
    cursor: nw-resize; }
  .resize.top-right {
    top: 0;
    right: 0;
    cursor: ne-resize; }
  .resize.bottom-left {
    bottom: 0;
    left: 0;
    cursor: sw-resize; }
  .resize.bottom-right {
    bottom: 0;
    right: 0;
    cursor: se-resize; }

.side-by-side-text-and-button {
  display: flex;
  align-items: center; }
  .side-by-side-text-and-button > span {
    flex: auto;
    color: var(--color-text-secondary);
    font-size: var(--font-size-350);
    line-height: var(--font-line-height-500); }
  .side-by-side-text-and-button > button {
    margin-left: 16px; }

body {
  background-color: var(--color-background-general);
  height: 100vh;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border-quaternary); }

.ow-version {
  font-size: 14px;
  line-height: 16px; }

.window__title {
  display: grid;
  grid-template: auto 1fr / 1fr auto; }
  .window__title .title-drag-area__main {
    grid-row: 1 / 3;
    grid-column: 1; }
  .window__title .title-drag-area__secondary {
    grid-row: 2;
    grid-column: 2; }
  .window__title .header-in-tab-navigation {
    display: flex;
    align-items: center;
    width: 240px;
    padding: 12px; }
    .window__title .header-in-tab-navigation > svg {
      width: 32px;
      height: 32px; }
    .window__title .header-in-tab-navigation > span {
      font-size: 18px;
      line-height: 1.33333333;
      margin-left: 8px; }
  .window__title > .window__title__controls {
    grid-row: 1;
    grid-column: 2;
    display: flex; }

.window__content > nav {
  grid-column: 1; }

.window__content > main {
  grid-column: 2;
  overflow-x: hidden; }

nav.side-tab-navigation {
  background: var(--color-surface-primary);
  position: relative;
  overflow: hidden; }
  nav.side-tab-navigation > ul {
    padding-top: 4px;
    display: flex;
    flex-direction: column;
    position: relative; }
    nav.side-tab-navigation > ul > li > button {
      display: flex;
      height: 48px;
      width: 100%;
      justify-content: start;
      background: transparent; }
      nav.side-tab-navigation > ul > li > button > svg {
        width: 24px;
        height: 24px;
        flex-shrink: 0;
        margin: 0 12px 0 16px;
        fill: var(--color-neutral-40);
        transition: fill .15s; }
      nav.side-tab-navigation > ul > li > button > span {
        font-size: 16px;
        padding-right: 16px;
        color: var(--color-text-tertiary); }
      nav.side-tab-navigation > ul > li > button:hover {
        background: rgba(var(--color-surface-secondary), 0.3); }
      nav.side-tab-navigation > ul > li > button.active {
        background: var(--color-surface-secondary); }
        nav.side-tab-navigation > ul > li > button.active > span {
          color: var(--color-text-tertiary); }
        nav.side-tab-navigation > ul > li > button.active > svg {
          fill: var(--color-text-tertiary); }
    nav.side-tab-navigation > ul::after {
      content: "";
      position: absolute;
      background: var(--color-brand-ow);
      width: 4px;
      height: 48px;
      top: 4px;
      transition: transform 150ms;
      transform: translateY(calc(48px * var(--tab-index))); }
  nav.side-tab-navigation > .ow-version {
    position: absolute;
    left: 16px;
    bottom: 12px;
    color: var(--color-surface-quaternary); }

.tab-content {
  padding: 12px 24px 40px 32px;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll; }

.tab-content--privacy > .tab-content--privacy__main p {
  color: var(--color-text-secondary);
  font-size: var(--font-size-350);
  line-height: var(--font-line-height-500); }

.tab-content--privacy > .tab-content--privacy__main a {
  color: var(--color-text-primary);
  font-size: var(--font-size-350); }
  .tab-content--privacy > .tab-content--privacy__main a:hover {
    color: var(--color-text-brand-ow-hover); }

.tab-content--privacy > .tab-content--privacy__main > section#overview > *:not(h1) + * {
  margin-top: 16px; }

.tab-content--privacy > .tab-content--privacy__main > section#overview ul {
  list-style: none; }
  .tab-content--privacy > .tab-content--privacy__main > section#overview ul li {
    color: var(--color-text-secondary);
    font-size: var(--font-size-350);
    line-height: var(--font-line-height-500); }
  .tab-content--privacy > .tab-content--privacy__main > section#overview ul > * + * {
    margin-top: 12px; }

.tab-content--privacy > .tab-content--privacy__main > section#account > * + * {
  margin-top: 24px; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login > * + * {
  margin-top: 24px; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login > section:not(.active) {
  display: none; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login > section > * + * {
  margin-top: 24px; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .need-login-box {
  display: flex;
  align-items: center;
  background-color: var(--color-surface-secondary);
  padding: var(--space-300) var(--space-400); }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .need-login-box > span {
    flex: auto; }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .need-login-box > * + * {
    margin-left: 16px; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info {
  display: flex;
  align-items: center;
  background-color: var(--color-surface-secondary);
  padding: 16px;
  margin-bottom: 32px; }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info > img {
    width: 40px;
    height: 40px;
    margin-right: 12px;
    border-radius: 24px;
    border: 1px solid var(--color-border-primary); }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info .account-info__user {
    display: flex;
    flex-direction: column; }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info .account-info__user .info {
      line-height: 100%;
      display: flex;
      flex-wrap: wrap; }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info .account-info__user .name {
      color: var(--color-text-primary);
      font-size: var(--font-size-400);
      line-height: var(--font-line-height-600); }
      .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info .account-info__user .name .displayname {
        font-weight: var(--font-weight-bold); }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info .account-info__user .username {
      color: var(--color-text-primary);
      font-size: var(--font-size-350);
      line-height: var(--font-line-height-500);
      margin-right: 8px; }
      .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info .account-info__user .username:before {
        content: '@'; }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info .account-info__user .email {
      color: var(--color-text-tertiary);
      font-size: var(--font-size-350);
      line-height: var(--font-line-height-500); }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .account-info .account-info__switch {
    margin-left: auto; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__login .info-box--verification-required {
  background-color: var(--color-text-warning); }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options > * + * {
  margin-top: 24px; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options > #request-data p span a {
  margin-top: 16px;
  display: inline-block; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options > #request-data + * {
  margin-top: 12px; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options > #request-data .request-data-actions {
  display: flex;
  gap: var(--space-200); }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options > section > *:not(h3) + * {
  margin-top: 24px; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options > section#request-data .processing-data {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-100) var(--space-300);
  border: 1px solid var(--color-border-info);
  background-color: var(--color-surface-info-transparent); }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options > section#request-data .processing-data span {
    color: var(--color-text-info);
    font-size: var(--font-size-350);
    line-height: var(--font-line-height-500); }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options > section#request-data .processing-data:not(.active) {
    display: none; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options.disabled {
  opacity: 0.3;
  pointer-events: none; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options .error-box {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-100) var(--space-300);
  border: 1px solid var(--color-border-critical);
  background: var(--color-surface-critical-transparent);
  color: var(--color-text-critical);
  font-size: var(--font-size-350);
  line-height: var(--font-line-height-500); }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__options .error-box:not(.active) {
    display: none; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso.disabled {
  opacity: 0.3;
  pointer-events: none; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list {
  margin-top: 16px; }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li + li {
    margin-top: 8px; }
  .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li {
    padding: 16px;
    display: grid;
    grid: auto auto / auto 1fr auto;
    background: var(--color-surface-primary); }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li > img {
      grid-row: 1;
      grid-column: 1;
      width: 32px;
      height: 32px;
      margin-right: 12px; }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li > h3 {
      grid-row: 1;
      grid-column: 2 / 4;
      align-self: center;
      margin: 0; }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li > ul {
      grid-row: 2 / 3;
      grid-column: 2 / 4;
      padding: 8px 8px 0 0; }
      .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li > ul > li {
        display: flex;
        align-items: center; }
        .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li > ul > li::before {
          display: block;
          content: ' ';
          background-image: url("../assets/svg/permission.svg");
          background-size: 20px 20px;
          height: 20px;
          width: 20px;
          margin-right: 12px; }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li > button {
      grid-row: 1 / 3;
      grid-column: 3;
      align-self: end;
      transition: opacity .3s, background .15s, color .15s; }
    .tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list > li:not(:hover) button {
      opacity: 0; }

.tab-content--privacy > .tab-content--privacy__main > section#account > section#account__sso .sso-list--empty {
  margin-top: 16px;
  padding: 48px;
  border: 1px solid var(--color-surface-secondary);
  display: flex;
  align-items: center;
  justify-content: center; }

.tab-content--privacy > .tab-content--privacy__main > section#how-we-use-your-data {
  display: block; }
  .tab-content--privacy > .tab-content--privacy__main > section#how-we-use-your-data .how-we-use-your-data-disclaimer {
    padding: var(--space-300) var(--space-400);
    display: block;
    background-color: var(--color-surface-secondary);
    color: var(--color-text-primary);
    font-size: var(--font-size-350);
    line-height: var(--font-line-height-500); }
  .tab-content--privacy > .tab-content--privacy__main > section#how-we-use-your-data .how-we-use-your-data-item {
    margin-bottom: 24px; }
    .tab-content--privacy > .tab-content--privacy__main > section#how-we-use-your-data .how-we-use-your-data-item p {
      max-width: 605px; }
    .tab-content--privacy > .tab-content--privacy__main > section#how-we-use-your-data .how-we-use-your-data-item .toggle + span a {
      margin-top: 16px;
      display: inline-block; }
    .tab-content--privacy > .tab-content--privacy__main > section#how-we-use-your-data .how-we-use-your-data-item:last-child {
      margin-bottom: 0; }

.tab-content--privacy > .tab-content--privacy__main > section {
  padding: 24px 0; }
  .tab-content--privacy > .tab-content--privacy__main > section:first-child {
    padding-top: 0; }
  .tab-content--privacy > .tab-content--privacy__main > section:last-child {
    padding-bottom: 0; }

.tab-content--privacy > .tab-content--privacy__main > * + * {
  border-top: solid 1px var(--color-border-on-surface); }

.tab-content--language {
  display: grid;
  grid-template: auto 1fr / 1fr;
  overflow-y: hidden;
  padding: 0; }
  .tab-content--language > .tab-content--language__restart-notification {
    grid-row: 1;
    overflow: hidden;
    height: 0;
    transition: height 300ms; }
    .tab-content--language > .tab-content--language__restart-notification.active {
      height: var(--content-height); }
  .tab-content--language > .tab-content--language__main {
    grid-row: 2;
    grid-column: 1 / span 2;
    overflow-y: scroll;
    padding: 12px 24px 40px 32px; }
  .tab-content--language .language-selector > .radio-button {
    height: auto;
    margin: 0;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-border-on-surface); }
    .tab-content--language .language-selector > .radio-button p:nth-child(3) {
      color: var(--color-text-tertiary);
      font-family: var(--font-family-brand);
      font-size: var(--font-size-300);
      font-weight: var(--font-weight-regular);
      line-height: var(--font-line-height-400);
      margin: 0 8px 0 auto;
      text-shadow: 0 0 currentcolor; }

.tab-content--hotkeys section + section {
  padding-top: 40px;
  border-top: solid 1px var(--color-surface-secondary);
  margin-top: 40px; }

.tab-content--hotkeys ul.hotkey-list > li {
  display: flex;
  align-items: center; }
  .tab-content--hotkeys ul.hotkey-list > li > span {
    flex-grow: 1; }
  .tab-content--hotkeys ul.hotkey-list > li > * + * {
    margin-left: 16px; }

.tab-content--hotkeys ul.hotkey-list > li + li {
  margin-top: 8px; }

.tab-content--hotkeys ul.app-list > li + li {
  margin-top: 32px; }

.tab-content--hotkeys ul.app-list > li {
  display: grid;
  grid-template: auto 1fr / 36px 1fr; }
  .tab-content--hotkeys ul.app-list > li > img {
    width: 24px;
    height: 24px;
    margin-right: 12px; }
  .tab-content--hotkeys ul.app-list > li > header {
    grid-column: 2;
    font-size: 16px;
    color: var(--color-text-tertiary);
    margin-bottom: 16px; }
  .tab-content--hotkeys ul.app-list > li > ul {
    grid-row: 2;
    grid-column: 2;
    overflow: hidden; }

.tab-content--general section + section {
  padding-top: 40px;
  border-top: 1px solid var(--color-surface-secondary);
  margin-top: 40px; }

.tab-content--general .tab-content--general__general > * + * {
  margin-top: 12px; }

.tab-content--general .tab-content--general__dock__when-visible {
  margin: 16px 0 0 0;
  transition: opacity 300ms; }
  .tab-content--general .tab-content--general__dock__when-visible > ul {
    padding: 12px 0; }
  .tab-content--general .tab-content--general__dock__when-visible:not(.active) {
    opacity: 0.3;
    pointer-events: none; }

.tab-content--sounds > section + section {
  margin-top: 12px; }

.tab-content--sounds > section header {
  font-family: var(--font-family-brand);
  font-size: var(--font-size-350);
  font-weight: var(--font-weight-medium);
  line-height: var(--font-line-height-500); }

.tab-content--sounds > section > * + * {
  margin-top: 12px; }

.tab-content--sounds button.button--play {
  transition: 150ms; }
  .tab-content--sounds button.button--play:hover {
    color: var(--color-text-pure); }

.tab-content--sounds .tab-content--sounds__volume {
  display: flex;
  align-items: center; }
  .tab-content--sounds .tab-content--sounds__volume > input {
    flex-grow: 1; }
  .tab-content--sounds .tab-content--sounds__volume > * + * {
    margin-left: 12px; }

.tab-content--capture {
  padding: 0;
  overflow-y: hidden; }
  .tab-content--capture header .more-info {
    margin-left: -2px; }
  .tab-content--capture > .tab-content--capture__main-state {
    display: grid;
    grid-template-rows: auto 1fr;
    height: 100%; }
    .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__recording-in-progress-notification {
      grid-row: 1;
      overflow: hidden;
      height: 0;
      transition: height 300ms; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__recording-in-progress-notification.active {
        height: var(--content-height); }
    .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable {
      grid-row: 2;
      overflow-x: hidden;
      overflow-y: scroll;
      padding: 12px 24px 40px 32px; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box {
        margin: 0 0 24px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > span {
          font-size: var(--font-size-350);
          line-height: var(--font-line-height-500); }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > * + * {
          margin-top: 16px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul {
          display: grid;
          grid-template-columns: repeat(auto-fit, 40px);
          grid-gap: 12px; }
          .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul > li {
            position: relative; }
            .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul > li .more-info {
              position: absolute;
              top: 0;
              left: 0;
              width: 40px;
              height: 40px;
              margin: 0; }
              .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul > li .more-info::before {
                display: none; }
              .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul > li .more-info .tooltip {
                text-align: center;
                width: 180px;
                top: 22px;
                bottom: unset; }
                .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul > li .more-info .tooltip.point-up {
                  top: unset;
                  bottom: 22px; }
                .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul > li .more-info .tooltip p {
                  width: fit-content;
                  margin: auto;
                  min-width: 110px; }
            .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul > li > img {
              width: 40px;
              height: 40px; }
            .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable .relevant-apps-box > ul > li:first-child .more-info .tooltip p {
              margin: unset; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable section.capture-section {
        padding: 24px 0; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable section.capture-section + section.capture-section {
        border-top: 1px solid var(--color-border-on-surface); }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .subsection {
        transition: transform 100ms, opacity 100ms; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .subsection:not(.active) {
          opacity: 0; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .subsection.capture-subsection--video:not(.active) {
          transform: translateX(42px); }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .subsection.capture-subsection--audio:not(.active) {
          transform: translateX(-42px); }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .quality-options {
        display: flex; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .quality-options > section + section {
          margin-left: 40px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .quality-options > section {
          min-width: 180px; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-folder-selectors > section + section {
        margin-top: 12px; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-folder-selectors h2 {
        margin-bottom: 8px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-folder-selectors h2 span {
          color: var(--color-text-secondary);
          font-family: var(--font-family-brand);
          font-size: var(--font-size-350);
          font-weight: var(--font-weight-medium);
          line-height: var(--font-line-height-500); }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .advanced-toggle {
        display: flex;
        justify-content: center;
        padding-bottom: 0; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video > .advanced:not(.active) {
        display: none; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video > .advanced > section:first-child {
        border-top: none; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video > .advanced > section:last-child {
        padding-bottom: 0; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .recording-mode > ul > li + li {
        margin-top: 8px; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .recording-mode > ul > li {
        display: flex;
        align-items: center; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .recording-mode > ul > li > * + * {
          margin-left: 48px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .recording-mode > ul > li > .radio-button {
          flex-shrink: 0; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .recording-mode > ul > li > .dropdown {
          flex: auto;
          min-width: 0; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options > section + section {
        margin-top: 12px; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options > section header {
        margin-bottom: 8px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options > section header span {
          font-family: var(--font-family-brand);
          font-size: var(--font-size-350);
          font-weight: var(--font-weight-medium);
          line-height: var(--font-line-height-500); }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options #opengl-note {
        transition: opacity 300ms 300ms, max-height 300ms, margin 300ms;
        overflow: hidden;
        max-height: 22px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options #opengl-note span, .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options #opengl-note a {
          font-family: var(--font-family-brand);
          font-size: var(--font-size-300);
          font-weight: var(--font-weight-regular);
          line-height: var(--font-line-height-400); }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options #opengl-note span {
          color: var(--color-text-tertiary); }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options #opengl-note a {
          text-decoration: none; }
          .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options #opengl-note a span {
            color: var(--color-text-primary); }
          .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options #opengl-note a:hover span {
            color: var(--color-text-pure); }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .capture-options #opengl-note:not(.active) {
          margin: 0;
          max-height: 0;
          opacity: 0;
          transition: opacity 300ms, max-height 300ms 300ms, margin 300ms 300ms; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .recording-indication > .dropdown {
        margin-top: 8px; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .recording-indication > .corner-selector-wrapper {
        margin-top: 12px;
        display: flex;
        justify-content: flex-end; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .recording-indication header span {
        font-family: var(--font-family-brand);
        font-size: var(--font-size-350);
        font-weight: var(--font-weight-medium);
        line-height: var(--font-line-height-500); }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .encoding-options > section + section {
        margin-top: 12px; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .encoding-options > section header {
        margin-bottom: 8px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video .encoding-options > section header span {
          font-family: var(--font-family-brand);
          font-size: var(--font-size-350);
          font-weight: var(--font-weight-medium);
          line-height: var(--font-line-height-500); }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--video #compatibility-section:not(.active) {
        display: none; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--audio > section.capture-section > section + section {
        margin-top: 12px; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--audio > section.capture-section > section {
        transition: 300ms opacity; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--audio > section.capture-section > section header, .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--audio > section.capture-section > section header span {
          font-family: var(--font-family-brand);
          font-size: var(--font-size-350);
          font-weight: var(--font-weight-medium);
          line-height: var(--font-line-height-500); }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--audio > section.capture-section > section > * + * {
          margin-top: 12px; }
        .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--audio > section.capture-section > section.disabled {
          opacity: 0.3;
          pointer-events: none; }
      .tab-content--capture > .tab-content--capture__main-state > .tab-content--capture__main-state__scrollable > .capture-subsection--audio > section.capture-section:last-child {
        padding-bottom: 0; }
  .tab-content--capture > .tab-content--capture__no-apps-state {
    display: grid;
    grid-template-rows: auto 1fr;
    height: 100%;
    padding: 12px 24px 40px 32px; }
    .tab-content--capture > .tab-content--capture__no-apps-state > h1 {
      margin-bottom: 0; }
    .tab-content--capture > .tab-content--capture__no-apps-state > .tab-content--capture__no-apps-state__content {
      align-self: center;
      display: flex;
      flex-direction: column;
      align-items: center; }
      .tab-content--capture > .tab-content--capture__no-apps-state > .tab-content--capture__no-apps-state__content > p {
        color: var(--color-text-primary);
        font-size: var(--font-size-400);
        font-weight: var(--font-weight-bold);
        line-height: var(--font-line-height-600);
        margin: 16px 0; }

.tab-content--games-overlay {
  display: grid;
  grid-template-rows: [start] auto [menu] auto [list] 1fr [end];
  padding-right: 0;
  padding-bottom: 0;
  overflow-y: hidden;
  position: relative; }
  .tab-content--games-overlay > *:not(.game-list) {
    padding-right: 32px; }
  .tab-content--games-overlay > .game-list-menu {
    display: flex;
    grid-row: menu;
    height: 32px;
    transition: 300ms opacity; }
    .tab-content--games-overlay > .game-list-menu > .search-box {
      flex: auto; }
    .tab-content--games-overlay > .game-list-menu > .game-list-menu__sort-by {
      display: flex; }
      .tab-content--games-overlay > .game-list-menu > .game-list-menu__sort-by > span {
        color: var(--color-neutral-40);
        line-height: 36px; }
      .tab-content--games-overlay > .game-list-menu > .game-list-menu__sort-by > .dropdown {
        width: 208px; }
      .tab-content--games-overlay > .game-list-menu > .game-list-menu__sort-by > * + * {
        margin-left: 12px; }
    .tab-content--games-overlay > .game-list-menu > * + * {
      margin-left: 24px; }
    .tab-content--games-overlay > .game-list-menu.semi-invisible {
      opacity: 0.05;
      pointer-events: none; }
  .tab-content--games-overlay > .game-list {
    grid-row: list;
    overflow-y: scroll;
    margin-top: 12px;
    padding-right: 24px;
    transition: 300ms opacity; }
    .tab-content--games-overlay > .game-list .game-list-item {
      background: var(--color-surface-primary); }
      .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button {
        width: 100%;
        height: 56px;
        background: var(--color-surface-primary);
        display: flex;
        align-items: center;
        font-size: inherit;
        color: var(--color-text-tertiary);
        transition: 150ms background; }
        .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button:hover {
          background: rgba(var(--color-surface-secondary), 0.5); }
        .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > svg {
          width: 24px;
          height: 24px;
          margin: 0 16px;
          flex-shrink: 0;
          transition: transform 300ms; }
        .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > header {
          display: flex;
          align-items: center;
          border-right: 1px solid var(--color-surface-secondary);
          width: 196px;
          flex: 0 0 auto; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > header > img {
            width: 32px;
            height: 32px;
            flex-shrink: 0; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > header > span {
            margin-left: 12px;
            margin-right: 8px; }
        .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > ul.game-list-item__button__app-list {
          flex: auto;
          display: flex;
          margin: 0 24px;
          overflow: hidden;
          transition: 300ms opacity; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > ul.game-list-item__button__app-list > li img {
            width: 20px;
            height: 20px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > ul.game-list-item__button__app-list > li + li {
            margin-left: 8px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > ul.game-list-item__button__app-list.disabled {
            opacity: 0.3;
            pointer-events: none; }
        .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__button > .toggle {
          margin-right: 16px; }
      .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content {
        overflow: hidden;
        height: 0;
        transition: height 300ms; }
        .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner {
          margin-top: 1px;
          padding: 16px 16px 0 24px;
          background: var(--color-surface-primary);
          transition: 300ms opacity; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner .auto-launch-header {
            margin-bottom: 8px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps > h2 {
            margin-bottom: 8px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps > section {
            margin-top: 32px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps > .game-list-item__content__apps__autolaunch > h3 {
            margin-bottom: 8px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps > .game-list-item__content__apps__autolaunch > * + * {
            margin-top: 12px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps .app-icon {
            width: 24px;
            height: 24px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps .app-name {
            margin-left: 12px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps li {
            display: flex; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps li + li {
            margin-top: 12px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps--no-apps > h2 {
            margin-bottom: 40px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps--no-apps .discover-apps {
            display: flex;
            flex-direction: column;
            align-items: center; }
            .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner section.game-list-item__content__apps--no-apps .discover-apps > button {
              margin-top: 16px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner .small-text {
            font-size: 14px;
            color: var(--color-surface-quaternary); }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner > .game-not-detected {
            margin-bottom: 24px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner > section {
            padding-bottom: 40px; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner > section + section {
            padding-top: 40px;
            border-top: 1px solid var(--color-surface-secondary); }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner .corner-selector-wrapper {
            display: flex;
            align-items: center;
            margin-top: 16px;
            transition: 300ms opacity; }
            .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner .corner-selector-wrapper > p {
              flex: 1;
              margin-right: 16px; }
            .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner .corner-selector-wrapper.disabled {
              opacity: 0.3;
              pointer-events: none; }
          .tab-content--games-overlay > .game-list .game-list-item > .game-list-item__content .game-list-item__content__inner.disabled {
            opacity: 0.3;
            pointer-events: none; }
      .tab-content--games-overlay > .game-list .game-list-item.active > .game-list-item__button > svg {
        transform: rotate(90deg); }
      .tab-content--games-overlay > .game-list .game-list-item.active > .game-list-item__content {
        height: var(--content-height); }
    .tab-content--games-overlay > .game-list > * + * {
      margin-top: 4px; }
    .tab-content--games-overlay > .game-list.semi-invisible {
      opacity: 0.05;
      pointer-events: none; }
  .tab-content--games-overlay > .scanning-games {
    grid-row: menu / end;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: 300ms opacity; }
    .tab-content--games-overlay > .scanning-games:not(.active) {
      opacity: 0;
      pointer-events: none; }
    .tab-content--games-overlay > .scanning-games > header {
      color: var(--color-text-primary);
      font-size: var(--font-size-400);
      font-weight: var(--font-weight-regular);
      line-height: var(--font-line-height-600);
      margin-bottom: 20px; }
    .tab-content--games-overlay > .scanning-games > button {
      margin-top: 28px; }
  .tab-content--games-overlay > .no-games-detected {
    grid-row: menu / end;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: 300ms opacity; }
    .tab-content--games-overlay > .no-games-detected:not(.active) {
      opacity: 0;
      pointer-events: none; }
    .tab-content--games-overlay > .no-games-detected > header {
      margin: 16px 0;
      color: var(--color-text-primary);
      font-size: var(--font-size-450);
      font-weight: var(--font-weight-bold);
      line-height: var(--font-line-height-700); }
    .tab-content--games-overlay > .no-games-detected > .no-games-detected__buttons {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px; }
      .tab-content--games-overlay > .no-games-detected > .no-games-detected__buttons button {
        max-width: 100%;
        min-width: 210px; }
  .tab-content--games-overlay > .no-results {
    grid-row: list / end;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: 300ms opacity; }
    .tab-content--games-overlay > .no-results:not(.active) {
      opacity: 0;
      pointer-events: none; }
    .tab-content--games-overlay > .no-results > header {
      color: var(--color-text-primary);
      font-size: var(--font-size-450);
      font-weight: var(--font-weight-bold);
      line-height: var(--font-line-height-700);
      margin: 16px 0 8px;
      display: flex; }
    .tab-content--games-overlay > .no-results > p {
      color: var(--color-text-tertiary);
      font-size: var(--font-size-350);
      line-height: var(--font-line-height-500); }

.tab-content--support > .tab-content--support__about {
  background: var(--color-surface-primary);
  height: 104px;
  padding: 24px;
  display: flex;
  align-items: center; }
  .tab-content--support > .tab-content--support__about > .logo {
    width: 56px;
    height: 56px;
    flex-shrink: 0; }
  .tab-content--support > .tab-content--support__about > .ow-text {
    margin-left: 16px; }
  .tab-content--support > .tab-content--support__about > .separator {
    margin: 0 24px;
    width: 1px;
    height: 48px;
    background: var(--color-surface-secondary); }
  .tab-content--support > .tab-content--support__about > p {
    flex: auto; }

.tab-content--support > .tab-content--support__updater {
  margin-top: 8px;
  background: var(--color-surface-primary);
  height: 84px;
  position: relative; }
  .tab-content--support > .tab-content--support__updater .updater-state {
    display: flex;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 0 24px;
    transition: 300ms opacity; }
    .tab-content--support > .tab-content--support__updater .updater-state:not(.active) {
      opacity: 0;
      pointer-events: none; }
    .tab-content--support > .tab-content--support__updater .updater-state > * + * {
      margin-left: 48px; }
    .tab-content--support > .tab-content--support__updater .updater-state .progress-bar {
      flex: auto; }
    .tab-content--support > .tab-content--support__updater .updater-state .ow-version {
      color: var(--color-text-tertiary);
      margin-left: 8px; }
    .tab-content--support > .tab-content--support__updater .updater-state .progress-with-caption {
      flex: auto;
      display: flex;
      position: relative; }
      .tab-content--support > .tab-content--support__updater .updater-state .progress-with-caption > span {
        position: absolute;
        top: 4px;
        line-height: 20px;
        color: var(--color-surface-tertiary); }
    .tab-content--support > .tab-content--support__updater .updater-state.updater-state--initial {
      justify-content: center; }
    .tab-content--support > .tab-content--support__updater .updater-state.updater-state--checking.active .progress-bar--infinite {
      animation: slide 200ms linear infinite; }
    .tab-content--support > .tab-content--support__updater .updater-state.updater-state--available > p, .tab-content--support > .tab-content--support__updater .updater-state.updater-state--ready-to-relaunch > p, .tab-content--support > .tab-content--support__updater .updater-state.updater-state--already-updated > p {
      flex: auto; }
    .tab-content--support > .tab-content--support__updater .updater-state.updater-state--error > div {
      flex: auto;
      display: flex;
      flex-direction: column;
      align-items: flex-start; }
      .tab-content--support > .tab-content--support__updater .updater-state.updater-state--error > div > header {
        font-size: 18px;
        color: var(--color-text-tertiary);
        margin-bottom: 8px; }

.tab-content--support > .tab-content--support__bullets {
  margin-top: 40px; }
  .tab-content--support > .tab-content--support__bullets > p {
    display: flex; }
    .tab-content--support > .tab-content--support__bullets > p > span {
      margin-left: 12px; }
      .tab-content--support > .tab-content--support__bullets > p > span.plaintext {
        margin-left: 0px; }
  .tab-content--support > .tab-content--support__bullets > * + * {
    margin-top: 24px; }

.expanded-action-panel {
  margin-top: 24px; }
  .expanded-action-panel .expand-btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    color: var(--color-text-secondary);
    font-family: var(--font-family-brand);
    font-size: var(--font-size-400);
    line-height: var(--font-line-height-600);
    width: 100%; }
    .expanded-action-panel .expand-btn span {
      font-weight: var(--font-weight-semi-bold); }
    .expanded-action-panel .expand-btn svg {
      width: 24px;
      height: 24px;
      fill: var(--color-icon-secondary);
      transition: all 150ms ease; }
      .expanded-action-panel .expand-btn svg:hover {
        fill: var(--color-text-pure); }
    .expanded-action-panel .expand-btn.is-expanded svg {
      transform: rotate(180deg); }
    .expanded-action-panel .expand-btn.is-expanded + .expanded-container {
      padding-top: 24px;
      max-height: 200px; }
  .expanded-action-panel .expanded-container {
    overflow: hidden;
    padding: 0;
    max-height: 0px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: all 150ms ease; }

.ng-more-info {
  width: 20px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px; }
  .ng-more-info::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    -webkit-mask-image: url("../../../../assets/svg/more-info.svg");
    background-color: var(--color-icon-secondary); }

.ng-tooltip {
  width: 272px;
  position: fixed;
  display: flex;
  flex-direction: column;
  z-index: 2;
  top: 140px;
  left: 420px; }
  .ng-tooltip:not(.is-shown) {
    opacity: 0;
    pointer-events: none; }
  .ng-tooltip::before {
    content: "";
    width: 16px;
    height: 16px;
    position: absolute;
    transform: rotate(45deg);
    right: 0;
    left: 0;
    margin: auto;
    bottom: -5px;
    background-color: var(--color-surface-tooltip); }
  .ng-tooltip p {
    color: var(--color-text-primary) !important;
    font-size: var(--font-size-350);
    line-height: var(--font-line-height-500);
    background-color: var(--color-surface-tooltip);
    padding: var(--space-400); }