:root {
  --txt: color-mix(
    in oklab,
    var(--color-accent) 60%,
    rgb(0 0 0 / 0)
  ) !important;
  --main: #0c085d !important;
  --secondary: #0aa6c7 !important;
  --light-black: #282727 !important;
  --black: #000000 !important;
  --white: #ffffff !important;
  --light-yellow: #f9eb57 !important;
  /* --color-ns-green: var(--secondary) !important; */
  --new-main: #121166 !important;
  --new-secondary: #dee5ff !important;
  --bg1: linear-gradient(
    90deg,
    #f7b2ff 0%,
    #d96cff 45%,
    #6a5cff 100%
  ) !important;
  --bg2: linear-gradient(
    135deg,
    #f7b2ff 0%,
    #d96cff 50%,
    #6a5cff 100%
  ) !important;
  --bg3: linear-gradient(
    135deg,
    #f9c8ff 0%,
    #e18bff 50%,
    #7a6dff 100%
  ) !important;
  --gc-bg: linear-gradient(135deg, #f7b2ff 0%, #d96cff 50%, #6a5cff 100%);
  --bg-light: linear-gradient(
    135deg,
    rgba(247, 178, 255, 0.2) 0%,
    rgba(217, 108, 255, 0.2) 50%,
    rgba(106, 92, 255, 0.2) 100%
  ) !important;
  --purple: #864ffe !important;
  --bg: #f4f5f8 !important;
  --note: #dce3fd !important;
  --txt2: #1a1a1c !important;
  --new-bg: linear-gradient(
    90deg,
    var(--new-main) 0%,
    var(--new-secondary) 100%
  ) !important;
  --new-bg2: linear-gradient(
    135deg,
    var(--new-main) 0%,
    #6f7cff 50%,
    var(--new-secondary) 100%
  ) !important;
  --new-bg3: linear-gradient(
    180deg,
    var(--new-secondary) 0%,
    var(--new-main) 100%
  ) !important;
}

.oh {
  overflow: hidden !important;
}
.trans-unform {
  transform: unset !important;
}

.ws-note {
  /* background-image: var(--bg1); */
  background: var(--new-main);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.ws-note2 {
  background: var(--new-secondary);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.ws-btn-bg1 {
  background: var(--bg1);
}

.ws-btn-bg2 {
  background: var(--bg2);
}

.ws-btn-bg3 {
  background: var(--bg3);
}

.ws-btn-bg-light {
  background: var(--bg-light);
}

.ws-btn-purple {
  background: var(--purple);
}

p:where(.dark, .dark *) {
  color: color-mix(in oklab, var(--color-accent) 60%, transparent) !important;
}

.btn-green {
  background-color: var(--new-main);
  color: #fff !important;
}

.glass-bg {
  background: var(--new-bg3) !important;
  backdrop-filter: blur(5px) saturate(200%) !important;
  -webkit-backdrop-filter: blur(5px) saturate(200%) !important;
  background-color: rgba(255, 255, 255, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, 0.125) !important;
}
.glass-bg2 {
  background: linear-gradient(
    180deg,
    rgba(222, 229, 255, 0.6) 0%,
    rgba(18, 17, 102, 0.6) 100%
  ) !important;

  backdrop-filter: blur(8px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(180%) !important;

  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 12px;
}

.new-btn-main {
  background: var(--new-main) !important;
  color: #fff !important;
  border-color: var(--new-main) !important;
  min-width: 250px !important;
}
.new-btn-main:hover {
  background: var(--black) !important;
  color: var(--white) !important;
  border-color: var(--black) !important;
}
.new-btn-secondary {
  background: var(--white) !important;
  color: var(--black) !important;
  border-color: var(--white) !important;
  min-width: 250px !important;
}
.new-btn-secondary:hover {
  background: var(--new-main) !important;
  color: var(--white) !important;
  border-color: var(--new-main) !important;
}

/* 
body {
        position: relative;
}

body::after {
        position: absolute;
        content: '';
        width: 1px;
        height: 100%;
        background: red;
        top: 0;
        left: 50px;
        z-index: 100;
}

body::before {
        position: absolute;
        content: '';
        width: 1px;
        height: 100%;
        background: red;
        top: 0;
        right: 50px;
        z-index: 100;
} */