:root {
  --max-width-header: 1280px;
  --max-width-main: 1280px;
  --max-width-footer: 1280px;
  --sidebar-width: 85px;
  --sidebar-margin-right: 48px;
  --height-swerte: 94px;
  --font-size-header: 16px;
  --text-primary: #fff;
  --text-invert: #000;
  --text-active: #fdf48d;
  --text-theme: #3bcc7f;
  --text-faded: rgba(255, 255, 255, 0.5);
  --text-faded-invert: rgba(0, 0, 0, 0.5);
  --bg-primary: #02180b;
  --bg-secondary: #011208;
  --bg-container: #06190b;
  --btn-pagination: #007d06bf;
  --border-primary: rgba(255, 255, 255, 0.15);
  --border-pagination: rgba(0, 125, 6, 0.75);
  --text-event-active: #fdc212;
  --bg-event-title-gradient: #ffe69b;
  --bg-event-title-gradient2: #fac528;
  --bg-event-dialog: rgba(0, 0, 0, 0.8);
  --rgb-event-title: 0, 125, 6;
  --text-reward-point: #ffdd00;
  --text-reward-subtitle: #66ff00;
  --text-reward-counting: #ff0000;
  --text-reward-fav-off: #54A65B;
  --text-reward-fav-on: #000;
  --text-invert-fav-off:#efefef;
  --bg-reward-container: #002813;
  --bg-reward-field: #001e0e;
  --bg-reward-header: #02180b;
  --bg-reward-overlay: rgba(0, 0, 0, 0.8);
  --bg-reward-dialog-gradient: rgba(23, 119, 28, 0.825);
  --bg-reward-dialog-gradient2: rgba(26, 57, 16, 0.705);
  --bg-reward-hot: #ff1bab;
  --bg-reward-new: #18b00a;
  --bg-reward-limit: #ff0000;
  --bg-reward-sale: #ffbe2a;
  --btn-reward-primary: rgba(21, 255, 0, 0.65);
  --btn-reward-secondary: #003c1d;
  --btn-reward-third: #fdc212;
  --btn-reward-range: rgba(21, 255, 0, 1);
  --btn-reward-fav-off: #004205;
  --btn-reward-fav-on: #15FF00;
  --border-reward-primary: #66ff00;
  --drop-shadow-reward-popular: rgba(0, 255, 0, 0.7);
  --text-task-counting: #dc5252;
  --bg-task-title-gradient: #ffe69b;
  --bg-task-title-gradient2: #fac528;
  --bg-task-progress: rgba(0, 0, 0, 0.15);
  --bg-task-progress-fill-gradient: #f7d44e;
  --bg-task-progress-fill-gradient2: #ba6c18;
  --bg-task-require-gradient: rgba(41, 245, 75, 0.3);
  --bg-task-require-gradient2: rgba(42, 83, 38, 0.096);
  --bg-task-list: rgba(0, 0, 0, 0.25);
  --bg-task-list-progress: #004609;
  --bg-task-list-progress-fill: #f7d44e;
  --btn-task-target-gradient: rgba(0, 125, 6, 0.75);
  --btn-task-target-gradient2: rgba(9, 34, 1, 0.15);
  --btn-task-claim-gradient: #fff200;
  --btn-task-claim-gradient2: #c57300;
  --btn-task-uncompleted: rgba(47, 101, 46, 0.4);
  --border-task-primary: #376832;
  --border-task-claim: #c57300;
  --border-task-require: rgba(126, 182, 71, 0.45);
  --box-shadow-task-primary: rgba(0, 255, 170, 0.16);
  --box-shadow-task-progress: rgba(0, 0, 0, 0.25);
  --bg-vivid-container: #002A06;
  --bg-vivid-primary: #04180F;
  --bg-vivid-checked: transparent;
  --bg-vivid-active: #FDC212;
  --bg-vivid-extra: #66FF00;
  --bg-vivid-d-info: #124015;
  --bg-vivid-light: #0C3617;
  --bg-vivid-input: #041D08;
  --border-vivid-primary: transparent;
  --border-vivid-active: #FDC212;
  --border-vivid-info: #227C3F;
  --border-vivid-form: #003A21;
  --text-vivid-primary: #04180F;
  --text-vivid-active: #FDC212;
  --btn-vivid-active: #FDC212;
  --btn-vivid-extra: #ff7e29;
  --btn-vivid-extra-number: #ff7e29;
  --btn-vivid-semi: #00460B;
  --btn-gradient: #557e3b;
  --btn-gradient2: #15270c;
  --btn-gradient3: #FDC212;
  --btn-gradient4: #945600;
  --radius-vivid-container: 8px;
  --bg-sidebar: #02180B;
  --bg-sidebar-group: #082011;
  --bg-vt-gradient: #013114;
  --bg-vt-gradient2: #02190B;
  --text-sidebar-title: #3ACC77;
  --btn-vt-primary: #075227;
  --required-color: #ef4444;
  --error-color: #ef4444;
  --failed-color: #ef4444;
  --hint-color: #ff5353;
  --success-color: #22c55e;
  --warning-color: #f59e0b;
  --pending-color: #f59e0b;
  --none-color: #d4d4d4;
}

@font-face {
  font-family: Creepster-Regular;
  src: url(../Creepster-Regular.ttf);
  font-display: swap;
}
:root {
  --max-width-raffle-container: 1280px;
  --max-width-raffle-header: 1280px;
  --text-raffle-theme: #ff8e43;
  --text-raffle-count: #ff8e43;
  --text-raffle-title: #fdf512;
  --text-raffle-box: #ddff91;
  --text-raffle-cell-title: #ffe052;
  --text-raffle-doc: #aa7cae;
  --bg-raffle-main: linear-gradient(
      to right,
      #011208 0%,
      #014521 50%,
      #011208 100%
  );
  --bg-raffle-main2: linear-gradient(
      to bottom,
      #011208 0%,
      rgba(1, 69, 33, 0.4) 50%,
      #011208 100%
  );
  --bg-raffle-header: #04010a;
  --bg-raffle-block-gradient: rgba(249, 214, 108, 0.15);
  --bg-raffle-block-gradient2: rgba(249, 214, 108, 0);
  --bg-raffle-marquee: #160f27;
  --bg-raffle-box: rgba(249, 214, 108, 0.08);
  --bg-raffle-touch: rgba(255, 255, 255, 0.05);
  --bg-raffle-touch2: linear-gradient(145deg, #ffb159, #db641a);
  --bg-raffle-task-item: transparent;
  --bg-raffle-prize-item:
      linear-gradient(0deg, rgba(21, 8, 33, 0.72), rgba(21, 8, 33, 0.72)),
      linear-gradient(
          145deg,
          rgba(249, 240, 108, 0.15) 6.17%,
          rgba(249, 214, 108, 0) 41.23%
      );
  --bg-raffle-modal: #180f23;
  --bg-raffle-scratch:
      linear-gradient(0deg, rgba(21, 8, 33, 0.72), rgba(21, 8, 33, 0.72)),
      linear-gradient(
          145deg,
          rgba(249, 240, 108, 0.15) 6.17%,
          rgba(249, 214, 108, 0) 41.23%
      );
  --bg-raffle-table-header: #2e1b45;
  --bg-raffle-live: rgba(249, 214, 108, 0.04);
  --bg-raffle-rule-item:
      linear-gradient(0deg, rgba(21, 8, 33, 0.72), rgba(21, 8, 33, 0.72)),
      linear-gradient(
          145deg,
          rgba(249, 240, 108, 0.15) 6.17%,
          rgba(249, 214, 108, 0) 41.23%
      );
  --bg-raffle-field: #1e142b;
  --border-raffle-v: #af9369;
  --border-raffle-primary: #e4a4ff;
  --border-raffle-secondary: #77cd00;
  --border-raffle-third: #f9d66c;
  --border-raffle-box: rgba(249, 214, 108, 0.28);
  --border-raffle-touch: rgba(255, 255, 255, 0.12);
  --border-raffle-touch2: rgba(255, 140, 0, 0.36);
  --border-raffle-task-item: rgba(249, 214, 108, 0.17);
  --border-raffle-prize-item: rgba(249, 214, 108, 0.16);
  --border-raffle-share: rgba(255, 140, 0, 0.36);
  --border-raffle-norm: rgba(249, 214, 108, 0.26);
  --border-raffle-rule: rgba(249, 214, 108, 0.14);
  --border-raffle-form: #d99a00;
  --border-raffle-remind: #f39052;
  --btn-raffle-gradient: linear-gradient(#ffb159, #db641a);
  --btn-raffle-gradient2: linear-gradient(#ffb159, #db641a);
  --btn-raffle-gradient3: linear-gradient(#ffb159, #db641a);
  --btn-raffle-share: linear-gradient(145deg, #0b7d20, #0db50d);
  --btn-raffle-form: #ffbe2a;
  --box-shadow-raffle-remind:
      0 18px 38px rgba(255, 140, 0, 0.24),
      inset 0 2px 0 rgba(255, 255, 255, 0.55),
      inset 0 -2px 0 rgba(180, 70, 0, 0.18);
  --box-shadow-raffle-remind2:
      0 24px 52px rgba(255, 165, 0, 0.34), 0 0 26px rgba(255, 140, 0, 0.12),
      inset 0 2px 0 rgba(255, 255, 255, 0.62);
  --box-shadow-raffle-share: 0 12px 28px rgba(13, 181, 13, 0.18);
  --box-shadow-raffle-share2:
      0 16px 34px rgba(13, 181, 13, 0.32), 0 0 18px rgba(56, 242, 111, 0.25);
  --green-1000: #031008;
  --green-950: #06170c;
  --green-900: #092a06;
  --green-850: #0a3514;
  --green-800: #0d471d;
  --green-700: #0d651f;
  --green-bright: #0db50d;
  --green-neon: #38f26f;
  --gold-100: #fff7d7;
  --gold-200: #ffe99e;
  --gold-300: #fdf512;
  --gold-400: #efbd43;
  --gold-500: #d99b25;
  --gold-600: #a96d13;
  --cream: #fff8e7;
  --muted: #aebba9;
  --muted-2: #7e907c;
  --danger: #ff6a6a;
  --surface: rgba(10, 43, 19, 0.76);
  --surface-strong: rgba(8, 30, 14, 0.95);
  --line: rgba(249, 214, 108, 0.18);
  --shadow-gold: 0 14px 46px rgba(217, 155, 37, 0.18);
  --shadow-dark: 0 24px 80px rgba(0, 0, 0, 0.42);
  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --container: 1240px;
}

@media (max-width: 1280px) {
  :root {
    --max-width-raffle-container: 1200px;
  }
  .raffle-wrapper .raffle-container {
    padding: 0 20px;
  }
}
@media (max-width: 768px) {
  :root {
    --max-width-raffle-container: 100%;
  }
}
@font-face {
  font-family: SourceSans3-Regular;
  src: url(../SourceSans3-Regular.ttf);
  font-display: swap;
}
@font-face {
  font-family: RobotoCondensed-Regular;
  src: url(../RobotoCondensed-Regular.ttf);
  font-display: swap;
}
html {
  scroll-behavior: smooth;
}

* {
  box-sizing: border-box;
  font-family: RobotoCondensed-Regular, "Arial", sans-serif;
}

* {
  box-sizing: border-box;
  font-family: RobotoCondensed-Regular, "Arial", sans-serif;
}
* ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  background-color: #030005;
}
* ::-webkit-scrollbar-track {
  background-color: transparent;
}
* ::-webkit-scrollbar-thumb {
  border-radius: 25px;
  background-color: rgba(0, 0, 0, 0.3);
}

body {
  margin: 0;
  padding: 0;
  font-family: RobotoCondensed-Regular, "Arial", sans-serif;
  scroll-behavior: smooth;
  background-color: #030005;
}
body::-webkit-scrollbar {
  display: none;
}
body ::-webkit-scrollbar-track {
  display: none;
}
body::-webkit-scrollbar-thumb {
  display: none;
}
body ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
body button {
  outline: none;
  border: none;
  cursor: pointer;
  background: transparent;
}
body button:not(:disabled):hover {
  filter: brightness(1.2);
}
body button:disabled {
  filter: grayscale(1);
}
body a {
  text-decoration: none;
}
body select {
  border: none;
  outline: none;
  font-weight: normal;
}
body input {
  border: none;
  outline: none;
  background: transparent;
  font-weight: normal;
}
body {
  /* Chrome, Safari, Edge, Opera */
}
body input[type=number]::-webkit-outer-spin-button,
body input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
body {
  /* Firefox */
}
body input[type=number] {
  -moz-appearance: textfield;
}
body input[type=date] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
}
body #toast-container {
  margin-top: 10px;
}
body #toast-container .toast.toast-error {
  background-color: #da2a2a;
}
body #toast-container .toast.toast-success {
  background-color: #67c23a;
}
body #toast-container .toast.toast-warning {
  background-color: #e6a23c;
}
body #toast-container .toast.toast-info {
  background-color: #909399;
}

div.v-red,
ul.v-red,
ol.v-red,
li.v-red,
span.v-red,
p.v-red,
a.v-red,
font.v-red,
h1.v-red,
h2.v-red,
h3.v-red,
h4.v-red,
h5.v-red,
h6.v-red,
i.v-red {
  color: var(--error-color) !important;
}
div.v-green,
ul.v-green,
ol.v-green,
li.v-green,
span.v-green,
p.v-green,
a.v-green,
font.v-green,
h1.v-green,
h2.v-green,
h3.v-green,
h4.v-green,
h5.v-green,
h6.v-green,
i.v-green {
  color: var(--success-color) !important;
}
div.v-orange,
ul.v-orange,
ol.v-orange,
li.v-orange,
span.v-orange,
p.v-orange,
a.v-orange,
font.v-orange,
h1.v-orange,
h2.v-orange,
h3.v-orange,
h4.v-orange,
h5.v-orange,
h6.v-orange,
i.v-orange {
  color: var(--warning-color) !important;
}
div.v-faded,
ul.v-faded,
ol.v-faded,
li.v-faded,
span.v-faded,
p.v-faded,
a.v-faded,
font.v-faded,
h1.v-faded,
h2.v-faded,
h3.v-faded,
h4.v-faded,
h5.v-faded,
h6.v-faded,
i.v-faded {
  color: var(--none-color) !important;
}

.swiper-button-next,
.swiper-button-prev {
  color: transparent;
}

.main-wrapper {
  width: 100%;
  position: relative;
  background-color: #030005;
  background-image: url(../../images/raffle/halloween/wbg.png);
  background-size: 100%;
  background-repeat: no-repeat;
}
.main-wrapper .raffle-container .raffle-prize-wrapper {
  background-image: url(../../images/raffle/halloween/wbg-prize.png);
  background-size: 100%;
  background-repeat: no-repeat;
}
.main-wrapper .raffle-container .raffle-rule-wrapper {
  background-image: url(../../images/raffle/halloween/wbg-rule.png);
  background-size: 100%;
  background-repeat: no-repeat;
}
.main-wrapper {
  padding-top: 62px;
}

.raffle-header-wrapper {
  width: 100%;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 20px;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 500;
  background: var(--bg-raffle-header);
}
.raffle-header-wrapper .raffle-header-container {
  width: 100%;
  max-width: var(--max-width-raffle-header);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-left {
  display: flex;
  align-items: center;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-left > a {
  display: flex;
  height: 62px;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-left > a > img {
  width: 100%;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right {
  display: flex;
  align-items: center;
  gap: 10px;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-navigation {
  display: none;
  align-items: center;
  color: color-mix(in srgb, var(--text-primary) 80%, transparent);
  font-size: 14px;
  padding: 0 10px;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-navigation:hover, .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-navigation.active {
  color: var(--text-raffle-theme);
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-primary {
  display: none;
  color: var(--text-primary);
  border: solid 1px var(--border-raffle-touch);
  background: var(--bg-raffle-touch);
  font-size: 14px;
  border-radius: 12px;
  padding: 6px 20px;
  height: 34px;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-primary svg {
  display: none;
  width: 20px;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-secondary {
  display: none;
  color: var(--text-primary);
  border: solid 1px var(--border-raffle-touch2);
  background: var(--bg-raffle-touch2);
  font-size: 14px;
  border-radius: 12px;
  padding: 6px 20px;
  height: 34px;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-secondary svg {
  display: none;
  width: 20px;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-ticket {
  display: none;
  color: var(--text-raffle-box);
  background: var(--bg-raffle-box);
  border: solid 1px var(--border-raffle-box);
  align-items: center;
  gap: 8px;
  padding: 6px 20px;
  border-radius: 13px;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
  height: 34px;
  cursor: pointer;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-ticket svg {
  width: 20px;
  color: var(--text-raffle-title);
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right .header-user {
  display: none;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: bold;
  border-radius: 12px;
  padding: 6px 20px;
  height: 34px;
}
.raffle-header-wrapper .raffle-header-container .raffle-header-right > a.show,
.raffle-header-wrapper .raffle-header-container .raffle-header-right > div.show {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}

.raffle-wrapper {
  width: 100%;
  min-height: 60vh;
  display: flex;
  justify-content: center;
  position: relative;
  padding: 0;
  background-repeat: no-repeat;
  background-size: cover;
}
.raffle-wrapper .raffle-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-topic {
  max-width: var(--max-width-raffle-container);
}
.raffle-wrapper .raffle-container .raffle-marquee {
  max-width: var(--max-width-raffle-container);
}
.raffle-wrapper .raffle-container .raffle-sum {
  max-width: var(--max-width-raffle-container);
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container {
  max-width: var(--max-width-raffle-container);
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container {
  max-width: var(--max-width-raffle-container);
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container {
  max-width: var(--max-width-raffle-container);
}
.raffle-wrapper .raffle-container .raffle-topic {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first {
  width: 50%;
  display: flex;
  flex-direction: column;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(1) > span {
  font-size: clamp(12px, 0.95vw, 16px);
  font-weight: bold;
  color: var(--text-raffle-theme);
  text-transform: uppercase;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(2) > img {
  width: 100%;
  max-width: 550px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(2) > img:first-of-type {
  display: block;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(2) > img:last-of-type {
  display: none;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(3) {
  flex-direction: column;
  gap: 8px;
  display: none;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(3) > span:nth-of-type(1) {
  color: var(--text-primary);
  font-size: clamp(20px, 1.72vw, 29px);
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(3) > span:nth-of-type(2) {
  color: color-mix(in srgb, var(--text-primary) 70%, transparent);
  font-size: clamp(12px, 0.95vw, 14px);
  text-align: center;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) {
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(1) > span {
  font-size: clamp(14px, 1.3vw, 22px);
  font-weight: bold;
  color: var(--text-raffle-theme);
  letter-spacing: 1px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(2) {
  gap: 14px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(2) > div {
  width: 18%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 10px;
  border-radius: 24px;
  border: solid 1px color-mix(in srgb, var(--border-raffle-primary) 50%, transparent);
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(2) > div > span:first-of-type {
  font-size: clamp(30px, 2.8vw, 46px);
  font-weight: bold;
  color: var(--text-raffle-count);
  text-shadow: 0 0 4px rgba(255, 190, 42, 0.45), 0 0 10px rgba(255, 190, 42, 0.3);
  animation: yellowGlow 1.8s ease-in-out infinite alternate;
}
@keyframes yellowGlow {
  from {
    text-shadow: 0 0 3px rgba(255, 190, 42, 0.35), 0 0 8px rgba(255, 190, 42, 0.2);
  }
  to {
    text-shadow: 0 0 5px rgba(255, 190, 42, 0.55), 0 0 14px rgba(255, 190, 42, 0.35);
  }
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(2) > div > span:last-of-type {
  font-size: clamp(12px, 1.2vw, 16px);
  font-weight: bold;
  color: var(--text-primary);
  letter-spacing: 0.5px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) {
  flex-direction: column;
  gap: 12px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(1) > button {
  width: 100%;
  padding: 16px 0;
  background: var(--btn-raffle-gradient);
  border: 1px solid var(--border-raffle-remind);
  border-radius: 30px;
  box-shadow: var(--box-shadow-raffle-remind);
  font-size: clamp(16px, 1.32vw, 22px);
  font-weight: 950;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  white-space: nowrap;
  animation: limePulse 1.9s ease-in-out infinite;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(1) > button > span {
  color: var(--text-invert);
  font-size: 20px;
  font-weight: bold;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(1) > button::after {
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.66), transparent);
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(2) {
  width: 100%;
  display: none;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(2) > div {
  border-radius: 24px;
  width: calc((100% - 20px) / 3);
  display: flex;
  padding: 8px 4px;
  justify-content: center;
  align-items: center;
  border: solid 1px color-mix(in srgb, var(--border-raffle-secondary) 70%, transparent);
  gap: 4px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(2) > div > span:first-of-type {
  color: var(--text-primary);
  font-size: 14px;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(2) > div > span:last-of-type {
  color: var(--text-raffle-count);
  font-size: 14px;
  font-weight: bold;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-second {
  width: 50%;
  display: flex;
}
.raffle-wrapper .raffle-container .raffle-topic .raffle-topic-second > img {
  width: 100%;
}
.raffle-wrapper .raffle-container .raffle-marquee {
  width: 100%;
  height: 30px;
  display: flex;
  background: color-mix(in srgb, var(--bg-raffle-marquee) 85%, transparent);
  border: solid 1px color-mix(in srgb, var(--border-raffle-third) 15%, transparent);
  border-radius: 24px;
  margin-bottom: 30px;
}
.raffle-wrapper .raffle-container .raffle-marquee > div {
  height: 100%;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(1) {
  display: none;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) {
  width: 100%;
  display: flex;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:first-of-type {
  width: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  background: var(--btn-raffle-gradient2);
  border-radius: 24px 0 0 24px;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:first-of-type > img {
  width: 20px;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:first-of-type > span {
  color: var(--text-invert);
  font-size: 12px;
  font-weight: bold;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type {
  width: calc(100% - 60px);
  display: block;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content {
  overflow: hidden;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .js-marquee {
  display: inline-flex;
  gap: 20px;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .raffle-marquee-item {
  display: flex;
  align-items: center;
  position: relative;
  gap: 8px;
  height: 30px;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .raffle-marquee-item::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #38f26f;
  box-shadow: 0 0 14px rgba(56, 242, 111, 0.9);
  animation: raffle-live-dot 1.2s ease-in-out infinite;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .raffle-marquee-item span:first-of-type {
  color: var(--text-raffle-title);
  padding-left: 3px;
}
.raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .raffle-marquee-item span:last-of-type {
  color: color-mix(in srgb, var(--text-primary) 70%, transparent);
}
@keyframes raffle-live-dot {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 6px rgba(56, 242, 111, 0.5);
    opacity: 1;
  }
  50% {
    transform: scale(1.2);
    box-shadow: 0 0 8px rgba(56, 242, 111, 0.8), 0 0 16px rgba(56, 242, 111, 0.5);
    opacity: 0.75;
  }
}
.raffle-wrapper .raffle-container .raffle-sum {
  width: 100%;
  display: flex;
  padding: 6px 0;
  gap: 12px;
  margin-bottom: 30px;
  background-image: url(../../images/raffle/halloween/rock.png);
  background-size: 100% 100%;
}
.raffle-wrapper .raffle-container .raffle-sum > div {
  display: flex;
  width: calc((100% - 24px) / 3);
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  padding: 12px 14px;
  gap: 16px;
}
.raffle-wrapper .raffle-container .raffle-sum > div > div {
  display: flex;
}
.raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(1) {
  justify-content: space-between;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(1) > img {
  width: 70px;
}
.raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(2) {
  flex-direction: column;
  justify-content: center;
}
.raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(2) > span {
  line-height: 1;
}
.raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(2) > span:first-of-type {
  font-size: 32px;
  font-weight: bold;
  color: var(--text-primary);
  margin-bottom: 4px;
}
.raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(2) > span:last-of-type {
  font-size: 16px;
  font-weight: bold;
  color: color-mix(in srgb, var(--text-primary) 50%, transparent);
}
.raffle-wrapper .raffle-container .raffle-base-title {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-base-title > span:nth-of-type(1) {
  color: var(--text-raffle-title);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-align: center;
}
.raffle-wrapper .raffle-container .raffle-base-title > span:nth-of-type(2) {
  color: var(--text-primary);
  font-size: 48px;
  letter-spacing: 0;
  line-height: 1.08;
  text-align: center;
}
.raffle-wrapper .raffle-container .raffle-base-title > span:nth-of-type(3) {
  margin: 14px auto 0;
  font-size: 15px;
  line-height: 1.65;
  color: var(--text-raffle-doc);
  text-align: center;
}
.raffle-wrapper .raffle-container .raffle-marquee,
.raffle-wrapper .raffle-container .raffle-sum {
  margin-bottom: 15px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper,
.raffle-wrapper .raffle-container .raffle-prize-wrapper,
.raffle-wrapper .raffle-container .raffle-rule-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
  min-height: 500px;
  margin-bottom: 30px;
  padding-top: 70px;
  position: relative;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper::after,
.raffle-wrapper .raffle-container .raffle-prize-wrapper::after,
.raffle-wrapper .raffle-container .raffle-rule-wrapper::after {
  content: "";
  width: 100%;
  height: 1px;
  background: color-mix(in srgb, var(--border-raffle-third) 15%, transparent);
  position: absolute;
  bottom: -40px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper,
.raffle-wrapper .raffle-container .raffle-prize-wrapper,
.raffle-wrapper .raffle-container .raffle-rule-wrapper {
  margin-bottom: 30px;
  padding-top: 30px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content {
  width: 100%;
  display: -webkit-box;
  overflow-x: scroll;
  padding: 30px 10px;
  cursor: grab;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  cursor: grab;
  user-select: none;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  position: relative;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content.dragging {
  cursor: grabbing;
  scroll-behavior: auto;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .fill-btn,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .transparent-btn {
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content::-webkit-scrollbar {
  display: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content ::-webkit-scrollbar-track {
  display: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content::-webkit-scrollbar-thumb {
  display: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content {
  -webkit-box-pack: center;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content.center {
  -webkit-box-pack: center;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content.center .raffle-task-item {
  width: 35%;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-hat {
  width: 180px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  pointer-events: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-ghost {
  width: 180px;
  position: absolute;
  top: 0;
  right: 0;
  pointer-events: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-candle {
  width: 120px;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
  pointer-events: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item {
  width: 30%;
  display: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item.show {
  display: flex;
  position: relative;
  aspect-ratio: 1596/2346;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item {
  flex-direction: column;
  position: relative;
  flex-direction: column;
  padding: 85px 32px;
  border-radius: 24px;
  gap: 16px;
  background-image: url(../../images/raffle/halloween/task-item.png);
  background-size: 100% 100%;
  margin-right: 10px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item:last-child {
  margin-right: 0;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-title {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-title > span {
  color: color-mix(in srgb, var(--text-raffle-title) 100%, transparent);
  font-size: 24px;
  font-family: Creepster-Regular;
  font-weight: bold;
  text-transform: uppercase;
  position: absolute;
  top: 3%;
  left: 50%;
  transform: translateX(-50%);
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-title > div {
  background: var(--btn-raffle-gradient2);
  font-size: 13px;
  border-radius: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  padding: 0 8px;
  font-weight: bold;
  text-transform: uppercase;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-title.claimed > div {
  color: #041b0b;
  background: linear-gradient(145deg, #7dff9d, #38f26f 54%, #12bd49);
  border: 1px solid rgba(119, 255, 157, 0.82);
  box-shadow: 0 10px 28px rgba(56, 242, 111, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.58);
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail > div > svg,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail > div img {
  width: 70px;
  height: 70px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail > span:first-of-type {
  color: var(--text-primary);
  font-size: clamp(26px, 2.1vw, 34px);
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail > span:last-of-type {
  color: color-mix(in srgb, var(--text-primary) 80%, transparent);
  font-size: 14px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div {
  width: 100%;
  display: flex;
  gap: 8px;
  padding: 10px 10px;
  border-radius: 16px;
  position: relative;
  border: solid 0.5px var(--border-raffle-primary);
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div.no-border {
  border: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div {
  display: flex;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.order {
  width: 25px;
  height: 25px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.order > span {
  color: var(--text-raffle-title);
  font-size: 14px;
  font-weight: bold;
  border-radius: 50%;
  border: solid 2px color-mix(in srgb, #fff 6%, transparent);
  width: 25px;
  height: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.texts {
  justify-content: space-between;
  width: 100%;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.texts > span {
  color: color-mix(in srgb, var(--text-primary) 70%, transparent);
  font-size: 16px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.texts > svg {
  width: 15px;
  height: 15px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.statistics {
  width: 100%;
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.statistics > div {
  display: flex;
  width: calc((100% - 10px) / 2);
  border-radius: 16px;
  border: solid 0.5px var(--border-raffle-primary);
  padding: 10px;
  flex-direction: column;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.statistics > div > span:first-of-type {
  font-size: 28px;
  color: var(--text-raffle-title);
  font-weight: bold;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.statistics > div > span {
  color: var(--text-primary);
  font-size: 14px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: auto;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a {
  width: 100%;
  height: 40px;
  max-width: 300px;
  display: none;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.show,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.show {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.fill-btn,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.fill-btn {
  border-radius: 16px;
  background: var(--btn-raffle-gradient3);
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.fill-btn > svg,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.fill-btn > svg {
  color: var(--text-invert);
  width: 18px;
  height: 18px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.fill-btn > svg path,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.fill-btn > svg path {
  fill: var(--text-invert);
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.fill-btn > span,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.fill-btn > span {
  color: var(--text-invert);
  font-size: 16px;
  font-weight: bold;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.fill-btn.show-scratch, .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.fill-btn.show-claim-ticket, .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.fill-btn.show-deposit,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.fill-btn.show-scratch,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.fill-btn.show-claim-ticket,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.fill-btn.show-deposit {
  animation: claim-ticket-pulse 1.8s ease-in-out infinite;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.transparent-btn,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.transparent-btn {
  border-radius: 16px;
  border: solid 1px rgba(249, 214, 108, 0.15);
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.transparent-btn > span,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.transparent-btn > span {
  color: var(--text-primary);
  font-size: 16px;
  font-weight: bold;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.claimed-btn,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.claimed-btn {
  border-radius: 16px;
  background: rgba(56, 242, 111, 0.07);
  pointer-events: none;
  border: 1px solid rgba(56, 242, 111, 0.26);
  gap: 8px;
}
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.claimed-btn > span,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button.claimed-btn > i,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.claimed-btn > span,
.raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a.claimed-btn > i {
  color: var(--success-color);
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content {
  width: 100%;
  display: flex;
  justify-content: center;
  display: grid;
  grid-template-columns: repeat(60, 1fr);
  gap: 10px;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item {
  display: flex;
  position: relative;
  grid-column: span 10;
  min-height: 248px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 20px;
  border: 1px solid var(--border-raffle-prize-item);
  border-radius: 12px;
  background: var(--bg-raffle-prize-item);
  overflow: hidden;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-quantity {
  width: 100%;
  display: flex;
  align-items: center;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-quantity > div {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-self: flex-start;
  min-height: 30px;
  align-items: center;
  padding: 0 11px;
  border-radius: 999px;
  color: var(--green-1000);
  background: var(--gold-300);
  font-size: 10px;
  font-weight: 950;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-art {
  width: 100%;
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  color: var(--gold-300);
  aspect-ratio: 1/1;
  position: relative;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-art > img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy > span:nth-of-type(1) {
  color: var(--gold-300);
  font-size: 10px;
  font-weight: normal;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy > span:nth-of-type(2) {
  margin: 6px 0 0;
  font-size: 23px;
  letter-spacing: -0.035em;
  font-size: 18px;
  color: var(--text-primary);
  line-height: 1;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy > span:nth-of-type(3) {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  display: none;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 18px;
  margin-bottom: 12px;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div {
  display: flex;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-video {
  width: 65%;
  display: flex;
  border: 1px solid var(--border-raffle-norm);
  border-radius: 27px;
  background: var(--bg-raffle-live);
  box-shadow: var(--shadow-dark);
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-video > iframe {
  flex: 1;
  width: 100%;
  border: 0;
  border-radius: 27px;
  aspect-ratio: 16/9;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail {
  width: calc(35% - 18px);
  display: flex;
  min-height: auto;
  padding: 34px;
  flex-direction: column;
  border: 1px solid var(--border-raffle-norm);
  border-radius: 27px;
  background: var(--bg-raffle-live);
  box-shadow: var(--shadow-dark);
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div {
  width: 100%;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(1) > span {
  color: var(--gold-300);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(2) > span {
  color: var(--text-primary);
  font-size: 42px;
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: 0;
  margin: 8px 0 0;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(3) {
  margin-top: 8px;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(3) > span {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.2;
  display: block;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(4) {
  display: grid;
  gap: 11px;
  margin: 12px 0;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(4) > div {
  display: flex;
  align-items: center;
  gap: 11px;
  color: #e4ede2;
  font-size: 14px;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(4) > div > svg {
  width: 19px;
  color: var(--green-neon);
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(5) {
  display: flex;
  gap: 10px;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(5) > a {
  width: calc((100% - 10px) / 2);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  border-radius: 18px;
  background: #0862F7;
  color: #fff;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(5) > a:hover {
  filter: brightness(1.2);
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(5) > button {
  width: calc((100% - 10px) / 2);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  border-radius: 18px;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(6) {
  margin-top: 15px;
}
.raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(6) > span {
  color: var(--muted-2);
  font-size: 11px;
  line-height: 1.4;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper {
  margin-bottom: 0;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper::after {
  display: none;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content .raffle-rule-item {
  min-height: 210px;
  padding: 23px;
  border: 1px solid var(--border-raffle-rule);
  border-radius: 21px;
  background: var(--bg-raffle-rule-item);
  display: flex;
  flex-direction: column;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content .raffle-rule-item > div:nth-of-type(1) {
  display: flex;
  justify-content: center;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content .raffle-rule-item > div:nth-of-type(1) > span {
  color: var(--text-raffle-title);
  font-size: 42px;
  font-family: Creepster-Regular;
  font-weight: 950;
  line-height: 1;
  text-align: center;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content .raffle-rule-item > div:nth-of-type(2) {
  display: flex;
  justify-content: center;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content .raffle-rule-item > div:nth-of-type(2) > span {
  margin: 17px 0 0;
  font-size: 18px;
  color: var(--text-primary);
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content .raffle-rule-item > div:nth-of-type(3) {
  display: flex;
  justify-content: center;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content .raffle-rule-item > div:nth-of-type(3) > span {
  display: block;
  margin: 9px 0 0;
  color: var(--text-raffle-doc);
  font-size: 14px;
  line-height: 1.2;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list {
  width: 80%;
  display: grid;
  gap: 12px;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list .faq-item {
  border: 1px solid var(--border-raffle-rule);
  border-radius: 18px;
  background: var(--bg-raffle-rule-item);
  overflow: hidden;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list .faq-item .faq-button {
  width: 100%;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 21px;
  color: white;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-weight: 850;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list .faq-item .faq-button svg {
  flex: 0 0 auto;
  width: 20px;
  color: var(--gold-300);
  transition: transform 0.25s ease;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list .faq-item .faq-answer {
  display: none;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list .faq-item .faq-answer .faq-answer > div {
  overflow: hidden;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list .faq-item .faq-answer p {
  margin: 0;
  padding: 0 21px 20px;
  color: var(--text-raffle-doc);
  font-size: 13px;
  line-height: 1.65;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list .faq-item.open .faq-answer {
  display: grid;
  grid-template-rows: 1fr;
}
.raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list .faq-item.open .faq-button svg {
  transform: rotate(45deg);
}
.raffle-wrapper .raffle-container .raffle-copyright-wrapper {
  margin-top: auto;
  padding: 25px 0;
}
.raffle-wrapper .raffle-container .raffle-copyright-wrapper .raffle-copyright-container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.raffle-wrapper .raffle-container .raffle-copyright-wrapper .raffle-copyright-container > span {
  color: var(--text-raffle-doc);
  font-size: 14px;
}

.modal {
  background: rgba(0, 0, 0, 0.8);
}
.modal .modal-dialog {
  width: min(90vw, 650px);
  max-width: unset;
  margin: auto;
}
.modal .modal-dialog::-webkit-scrollbar {
  display: none;
}
.modal .modal-dialog ::-webkit-scrollbar-track {
  display: none;
}
.modal .modal-dialog::-webkit-scrollbar-thumb {
  display: none;
}
.modal .modal-dialog .modal-content {
  background: transparent;
  border: 0;
  box-shadow: none;
  max-height: 90vh;
}
.modal .modal-dialog .modal-content .modal-body {
  position: relative;
  width: 100%;
  padding: 0;
  background: var(--bg-raffle-modal);
  border-radius: 8px;
  padding: 10px;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title {
  width: 100%;
  display: flex;
  padding: 4px 10px;
  align-items: center;
  justify-content: space-between;
  position: relative;
  margin-bottom: 10px;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title::after {
  content: "";
  width: 100%;
  height: 1px;
  background: color-mix(in srgb, var(--border-raffle-third) 15%, transparent);
  position: absolute;
  bottom: 0;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title.no-border-bot::after {
  display: none;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title .modal-inner-title-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title .modal-inner-title-content > span.kicker {
  color: var(--gold-300);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-align: left;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title .modal-inner-title-content > span.title {
  font-size: 21px;
  letter-spacing: -0.035em;
  color: var(--text-primary);
  text-align: left;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title .modal-inner-title-content > span.hint {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
  text-align: left;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title .modal-inner-title-close {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  border: solid 1px color-mix(in srgb, var(--text-primary) 30%, transparent);
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title .modal-inner-title-close > i {
  color: var(--text-primary);
  font-size: 16px;
  transition: transform 0.3s ease, color 0.3s ease;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-title .modal-inner-title-close:hover > i {
  transform: rotate(180deg);
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-wrapper {
  width: 100%;
  display: flex;
}
.modal .modal-dialog .modal-content .modal-body .modal-inner-wrapper .modal-inner-container {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.v-form {
  display: none;
  gap: 4px;
  min-width: 260px;
  grid-template-columns: repeat(2, 1fr);
  font-size: 1rem;
}
.v-form.show {
  display: grid;
}
.v-form.full {
  width: 100%;
}
.v-form > div {
  grid-column: 1/-1;
}
.v-form .v-field {
  display: none;
  gap: 2px;
}
.v-form .v-field.show {
  display: grid;
}
.v-form .v-field.half {
  grid-column: span 1;
}
.v-form .v-field.required > .v-label::before {
  content: "*";
  color: var(--required-color);
  margin-right: 6px;
}
.v-form .v-reveal-field.required > .v-label::before {
  content: "*";
  color: var(--required-color);
  margin-right: 6px;
}
.v-form .v-label {
  width: 100%;
  font-weight: 600;
  color: var(--muted);
  text-align: left;
  font-size: 12px;
}
.v-form .v-input {
  position: relative;
  display: grid;
  gap: 6px;
}
.v-form .v-input input {
  padding: 7px 36px 7px 8px;
  border-radius: var(--radius-vivid-container);
  background-color: var(--bg-vivid-primary);
  color: color-mix(in srgb, var(--text-primary) 80%, transparent);
  outline: none;
}
.v-form .v-input input.with-border {
  border: 1px solid var(--border-vivid-info);
}
.v-form .v-input input::-moz-placeholder {
  color: #6b6b6b;
  font-size: 12px;
}
.v-form .v-input input::placeholder {
  color: #6b6b6b;
  font-size: 12px;
}
.v-form .v-input input:focus {
  border-color: var(--text-event-active);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--text-event-active) 80%, transparent);
}
.v-form .v-input input:disabled,
.v-form .v-input input[readonly] {
  background-color: color-mix(in srgb, var(--bg-vivid-primary) 50%, var(--bg-primary));
  border-color: color-mix(in srgb, var(--border-vivid-info) 70%, transparent);
  color: color-mix(in srgb, var(--text-primary) 70%, transparent);
  cursor: not-allowed;
}
.v-form .v-input .selector {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: relative;
}
.v-form .v-input .selector.with-border > div {
  border: 1px solid var(--border-vivid-info);
}
.v-form .v-input .selector > div {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px;
  border-radius: 8px;
  background: var(--bg-vivid-primary);
  cursor: pointer;
}
.v-form .v-input .selector > div > span,
.v-form .v-input .selector > div > i {
  color: var(--text-primary);
  font-size: 14px;
}
.v-form .v-input .selector > div.active > span,
.v-form .v-input .selector > div.active > i {
  color: var(--text-event-active);
}
.v-form .v-input .selector > ul {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 100%;
  display: none;
  flex-direction: column;
  padding: 8px;
  border-radius: 8px;
  gap: 10px;
  background: var(--bg-vivid-primary);
  z-index: 2;
}
.v-form .v-input .selector > ul.show {
  display: flex;
}
.v-form .v-input .selector > ul > li {
  width: 100%;
  display: flex;
  position: relative;
  padding: 4px 0;
  cursor: pointer;
}
.v-form .v-input .selector > ul > li .certain-name,
.v-form .v-input .selector > ul > li .bonus-name,
.v-form .v-input .selector > ul > li .bonus-min {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 14px;
}
.v-form .v-input .selector > ul > li .info-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-primary);
  font-size: 1rem;
  background: transparent;
  border: 0;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.v-form .v-input .selector > ul > li .info-btn.show {
  display: inline-flex;
}
.v-form .v-input .selector > ul > li.active .certain-name,
.v-form .v-input .selector > ul > li.active .bonus-name,
.v-form .v-input .selector > ul > li.active .bonus-min,
.v-form .v-input .selector > ul > li.active .info-btn, .v-form .v-input .selector > ul > li:hover .certain-name,
.v-form .v-input .selector > ul > li:hover .bonus-name,
.v-form .v-input .selector > ul > li:hover .bonus-min,
.v-form .v-input .selector > ul > li:hover .info-btn {
  color: var(--text-event-active);
}
.v-form .v-input .v-tabs {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
}
.v-form .v-input .v-tabs > button {
  padding: 7px 16px;
  border: 1px solid transparent;
  border-radius: var(--radius-vivid-container);
  background-color: var(--bg-vivid-primary);
  color: var(--text-primary);
}
.v-form .v-input .v-tabs > button > span {
  color: var(--text-primary);
}
.v-form .v-input .v-tabs > button.active {
  border-color: var(--text-event-active);
}
.v-form select {
  padding: 7px 8px;
  border-radius: var(--radius-vivid-container);
  background-color: var(--bg-vivid-primary);
  color: var(--text-primary);
}
.v-form select.with-border {
  border: 1px solid var(--border-vivid-info);
}
.v-form select option {
  background-color: var(--bg-vivid-primary);
  color: var(--text-primary);
}
.v-form select:disabled {
  background-color: color-mix(in srgb, var(--bg-vivid-primary) 50%, var(--bg-primary));
  border-color: color-mix(in srgb, var(--border-vivid-info) 70%, transparent);
  color: color-mix(in srgb, var(--text-primary) 70%, transparent);
  cursor: not-allowed;
}
.v-form .v-input-group {
  display: flex;
  align-items: center;
  gap: 8px;
}
.v-form .v-input-group .v-prefix {
  padding: 4px 10px;
  border: 1px solid var(--border-vivid-primary);
  border-radius: var(--radius-vivid-container);
  background-color: var(--bg-raffle-field);
  color: var(--text-primary);
  font-size: 0.9rem;
  white-space: nowrap;
}
.v-form .v-input-group .v-prefix.with-border {
  border: 1px solid var(--border-vivid-info);
}
.v-form .v-input-group .v-suffix {
  padding: 4px 10px;
  border: 1px solid var(--border-vivid-primary);
  border-radius: var(--radius-vivid-container);
  background-color: var(--bg-raffle-field);
  color: var(--text-primary);
  font-size: 0.9rem;
  white-space: nowrap;
  justify-content: center;
  align-items: center;
  min-width: 90px;
}
.v-form .v-input-group .v-suffix.with-border {
  border: 1px solid var(--border-vivid-info);
}
.v-form .v-input-group .v-suffix.v-suffix-btn {
  color: var(--gold-200);
  border: 1px solid rgba(249, 214, 108, 0.42);
}
.v-form .v-input-group .v-prefix,
.v-form .v-input-group .v-suffix {
  display: none;
}
.v-form .v-input-group .v-prefix.show,
.v-form .v-input-group .v-suffix.show {
  display: flex;
  width: 100px;
}
.v-form .v-input-group .v-input-group-item {
  width: 100%;
  display: flex;
  align-items: center;
  position: relative;
}
.v-form .v-input-group .v-input-group-item.prefix-label::after {
  content: attr(data-prefix);
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  color: var(--muted);
}
.v-form .v-input-group .v-input-group-item.prefix-label > input {
  padding: 4px 10px 4px 32px;
}
.v-form .v-input-group .v-input-group-item input,
.v-form .v-input-group .v-input-group-item select {
  width: 100%;
  padding: 4px 10px;
  border-radius: var(--radius-vivid-container);
  background-color: var(--bg-raffle-field);
  color: var(--text-primary);
  outline: none;
  border: solid 1px var(--border-raffle-v);
  font-size: 13px;
}
.v-form .v-input-group .v-input-group-item input.with-border,
.v-form .v-input-group .v-input-group-item select.with-border {
  border: 1px solid var(--border-vivid-info);
}
.v-form .v-input-group .v-input-group-item input::-moz-placeholder, .v-form .v-input-group .v-input-group-item select::-moz-placeholder {
  color: #6b6b6b;
  font-size: 12px;
}
.v-form .v-input-group .v-input-group-item input::placeholder,
.v-form .v-input-group .v-input-group-item select::placeholder {
  color: #6b6b6b;
  font-size: 12px;
}
.v-form .v-input-group .v-input-group-item input:disabled,
.v-form .v-input-group .v-input-group-item input[readonly] {
  background-color: color-mix(in srgb, var(--bg-vivid-primary) 50%, var(--bg-primary));
  border-color: color-mix(in srgb, var(--border-vivid-info) 70%, transparent);
  color: color-mix(in srgb, var(--text-primary) 70%, transparent);
  cursor: not-allowed;
}
.v-form .v-input-group .v-input-group-item .v-input-group-item-icon-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--text-primary);
  display: none;
  justify-content: center;
  align-items: center;
}
.v-form .v-input-group .v-input-group-item .v-input-group-item-icon-btn.disabled {
  pointer-events: none;
}
.v-form .v-input-group .v-input-group-item .v-input-group-item-icon-btn.show {
  display: flex;
}
.v-form .v-input-group .v-input-group-item .v-input-group-item-icon-btn > i.fa-eye, .v-form .v-input-group .v-input-group-item .v-input-group-item-icon-btn > i.fa-eye-slash {
  color: var(--text-primary);
  font-size: 12px;
}
.v-form .v-reveal-field {
  display: none;
  gap: 4px;
  padding: 4px 8px;
  border-radius: 12px;
  border: solid 1px color-mix(in srgb, var(--border-raffle-third) 15%, transparent);
  margin: 6px 0;
  position: relative;
}
.v-form .v-reveal-field.show {
  display: grid;
}
.v-form .v-reveal-field .v-reveal-group {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 8px;
}
.v-form .v-reveal-field .v-reveal-item {
  flex: 0 0 auto;
}
.v-form .v-reveal-field .v-reveal-item .v-reveal-inner {
  display: flex;
  gap: 10px;
}
.v-form .v-reveal-field .v-reveal-item .v-reveal-inner > input {
  flex: 0 0 45px;
  width: 45px;
  height: 45px;
  padding: 6px;
  box-sizing: border-box;
  border: 1px solid var(--border-raffle-v);
  border-radius: var(--radius-vivid-container);
  background-color: var(--bg-raffle-field);
  color: var(--text-primary);
  text-align: center;
  outline: none;
  font-size: 18px;
}
.v-form .v-reveal-field .v-reveal-item .v-reveal-inner > input::-webkit-outer-spin-button, .v-form .v-reveal-field .v-reveal-item .v-reveal-inner > input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.v-form .v-reveal-field .v-reveal-item .v-reveal-inner > input[type=number] {
  -webkit-appearance: textfield;
          appearance: textfield;
  -moz-appearance: textfield;
}
.v-form .v-reveal-field .v-reveal-suffix {
  flex: 1 1 80px;
  min-width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  border: 1px solid var(--border-vivid-primary);
  border-radius: var(--radius-vivid-container);
  background-color: var(--bg-vivid-primary);
  color: var(--text-primary);
  font-size: 0.9rem;
  white-space: nowrap;
  cursor: pointer;
}
.v-form .v-reveal-field .v-reveal-suffix.v-reveal-suffix-btn {
  background: var(--btn-raffle-form);
  color: var(--text-invert);
  border-color: rgba(249, 214, 108, 0.42);
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.v-form .v-reveal-field .v-reveal-suffix.v-reveal-suffix-btn:hover {
  border-color: var(--gold-200);
}
.v-form .v-reveal-field .v-message {
  font-size: 14px;
}
.v-form .v-reveal-field .v-message.faded {
  opacity: 0.7;
}
@media (max-width: 576px) {
  .v-form .v-reveal-field .v-reveal-item .v-reveal-inner {
    gap: 6px;
  }
  .v-form .v-reveal-field .v-reveal-item .v-reveal-inner > input {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    font-size: 16px;
  }
  .v-form .v-reveal-field .v-reveal-suffix {
    min-width: 70px;
  }
}
.v-form .v-icon {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 14px;
  opacity: 0.7;
  pointer-events: none;
}
.v-form .v-icon-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--text-primary);
  display: none;
  justify-content: center;
  align-items: center;
}
.v-form .v-icon-btn > i,
.v-form .v-icon-btn > span {
  font-size: 14px;
}
.v-form .v-icon-btn > svg {
  width: 16px;
  height: 16px;
}
.v-form .v-icon-btn:disabled {
  pointer-events: none;
}
.v-form .v-icon-btn.show {
  display: flex;
}
.v-form .v-text-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  border-radius: 8px;
  background: var(--bg-vivid-active);
  cursor: pointer;
  color: var(--text-invert);
  display: none;
  justify-content: center;
  align-items: center;
}
.v-form .v-text-btn > i,
.v-form .v-text-btn > span {
  font-size: 14px;
  color: var(--text-invert);
}
.v-form .v-text-btn > svg {
  width: 16px;
  height: 16px;
}
.v-form .v-text-btn.verified {
  background: transparent;
  pointer-events: none;
}
.v-form .v-text-btn.verified > span {
  color: var(--success-color);
}
.v-form .v-text-btn:disabled {
  pointer-events: none;
  filter: grayscale(1);
}
.v-form .v-text-btn.show {
  display: flex;
}
.v-form .v-message {
  font-size: 12px;
  color: var(--hint-color);
  text-align: left;
}
.v-form .v-message.success {
  color: var(--success-color);
}
.v-form .v-message.faded {
  color: var(--muted-2);
}
.v-form .v-extra {
  display: grid;
  gap: 8px;
  font-size: 0.9rem;
  color: var(--text-primary);
  padding: 12px 10px;
  border-radius: var(--radius-vivid-container);
  background: var(--bg-secondary);
  border: none;
}
.v-form .v-extra .v-hint {
  display: grid;
  color: var(--text-faded);
  text-align: center;
}
.v-form .v-extra .v-hint.is-centered {
  text-align: center;
}
.v-form .v-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
}
.v-form .v-check input {
  width: 16px;
  height: 16px;
  accent-color: var(--success-color);
}
.v-form .v-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: 4px;
  gap: 10px;
}
.v-form .v-actions > button {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: bold;
  color: var(--text-primary);
  margin: 10px 0;
  border-radius: 12px;
  background: var(--btn-raffle-form);
  border: solid 1px var(--border-raffle-form);
  color: var(--text-invert);
}
.v-form .v-actions > button > span {
  color: var(--text-invert);
}
.v-form .v-actions > button {
  display: none;
}
.v-form .v-actions > button.show {
  display: flex;
}
.v-form .v-actions.is-single {
  justify-content: center;
}
.v-form .v-actions.is-single > button {
  flex: 1 1 100%;
  width: 100%;
}
.v-form .v-graph {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 5px 0;
}
.v-form .v-graph canvas {
  width: 50%;
  height: 40px;
  margin-right: 8px;
  border-radius: var(--radius-vivid-container);
}
.v-form .v-graph > button {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  overflow: hidden;
  background: var(--btn-raffle-gradient);
  box-shadow: 0 12px 30px rgba(217, 155, 37, 0.23), inset 0 1px 0 rgba(255, 255, 255, 0.86);
  color: var(--text-invert);
}
.v-form .v-graph > button > span {
  color: var(--text-invert);
}
.v-form .v-graph > button {
  border-radius: var(--radius-vivid-container);
  font-size: 1rem;
  gap: 8px;
}
.v-form .v-graph > button span,
.v-form .v-graph > button i {
  color: var(--text-invert);
}
.v-form .v-age {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.v-form .v-age > img {
  width: 30px;
  height: 30px;
  margin-right: 10px;
}
.v-form .v-age > span {
  color: #c4c4c4;
  font-size: 12px;
  line-height: 1.2;
  text-transform: uppercase;
}

.v-switcher {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.v-switcher-btn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 20px;
  cursor: pointer;
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 10px;
  color: #d3d3d3;
  border-radius: 12px;
  border: solid 1px var(--border-raffle-v);
}
.v-switcher-btn.active, .v-switcher-btn:hover {
  border-color: transparent;
  border-radius: 12px;
  overflow: hidden;
  background: var(--btn-raffle-gradient);
  box-shadow: 0 12px 30px rgba(217, 155, 37, 0.23), inset 0 1px 0 rgba(255, 255, 255, 0.86);
  color: var(--text-invert);
}
.v-switcher-btn.active > span, .v-switcher-btn:hover > span {
  color: var(--text-invert);
}

.d-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 1rem;
  padding: 4px 10px;
}
.d-form > li {
  width: 100%;
  display: none;
  flex-direction: column;
  position: relative;
}
.d-form > li.border-b::after {
  content: "";
  width: 100%;
  height: 1px;
  background: var(--border-raffle-v);
  position: absolute;
  bottom: -3px;
}
.d-form > li.show {
  display: flex;
}
.d-form > li > label.d-label {
  text-align: left;
  color: var(--text-primary);
  margin-bottom: 2px;
}
.d-form > li > span.d-message {
  width: 100%;
  color: red;
  font-size: 1rem;
}
.d-form > li > div {
  width: 100%;
  display: flex;
}
.d-form > li.d-touch .d-inner, .d-form > li.d-touch2 .d-inner {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.d-form > li.d-touch .d-inner > div, .d-form > li.d-touch2 .d-inner > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  background: linear-gradient(rgba(249, 214, 108, 0.1490196078), rgba(249, 214, 108, 0));
  border: 2px solid color-mix(in srgb, var(--border-raffle-third) 15%, transparent);
  border-radius: 12px;
  cursor: pointer;
  font-size: 1rem;
  width: calc((100% - 40px) / 5);
  height: auto;
  position: relative;
  padding: 3px 0;
  gap: 1px;
}
.d-form > li.d-touch .d-inner > div > img, .d-form > li.d-touch2 .d-inner > div > img {
  width: 80%;
}
.d-form > li.d-touch .d-inner > div > span, .d-form > li.d-touch2 .d-inner > div > span {
  text-align: center;
  color: var(--text-primary);
  line-height: 1;
  font-size: 12px;
  text-transform: uppercase;
}
.d-form > li.d-touch .d-inner > div > div.checked, .d-form > li.d-touch2 .d-inner > div > div.checked {
  display: none;
}
.d-form > li.d-touch .d-inner > div.active, .d-form > li.d-touch2 .d-inner > div.active {
  border-color: var(--border-raffle-third);
}
.d-form > li.d-touch .d-inner > div.active > div.checked, .d-form > li.d-touch2 .d-inner > div.active > div.checked {
  position: absolute;
  left: 2px;
  top: 2px;
  border-radius: 50%;
  background: var(--btn-vivid-active);
  width: 15px;
  height: 15px;
  display: none;
  justify-content: center;
  align-items: center;
}
.d-form > li.d-touch .d-inner > div.active > div.checked > i, .d-form > li.d-touch2 .d-inner > div.active > div.checked > i {
  font-size: 10px;
  color: var(--text-vivid-primary);
}
.d-form > li.d-touch .d-inner > div > div.extra {
  display: none;
}
.d-form > li.d-touch .d-inner > div.extra > div.extra {
  position: absolute;
  right: 2px;
  top: 2px;
  border-radius: 50%;
  width: 15px;
  height: 15px;
  display: none;
  justify-content: center;
  align-items: center;
}
.d-form > li.d-touch .d-inner > div.extra > div.extra > svg {
  width: 15px;
  height: 15px;
}
.d-form > li.d-touch .d-inner > div.extra > div.extra > svg > path {
  fill: var(--btn-vivid-extra);
}
.d-form > li.d-touch .d-inner > div.extra > div.extra > svg {
  transform-origin: bottom center;
  animation: fire 1.2s ease-in-out infinite alternate;
}
.d-form > li.d-touch2 .d-inner > div > div.extra {
  display: none;
}
.d-form > li.d-touch2 .d-inner > div.extra > div.extra {
  position: absolute;
  right: 2px;
  top: 2px;
  border-radius: 8px;
  background: var(--btn-vivid-extra-number);
  padding: 1px 2px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.d-form > li.d-touch2 .d-inner > div.extra > div.extra > span {
  color: var(--text-invert);
  font-size: 10px;
}
.d-form > li.d-detail {
  flex-direction: column;
}
.d-form > li.d-detail .d-inner {
  flex-direction: column;
}
.d-form > li.d-detail .d-inner > ul {
  width: 100%;
  display: flex;
  flex-direction: column;
  background: var(--bg-vivid-primary);
  border: 1px solid var(--border-vivid-primary);
  padding: 15px;
  border-radius: 8px;
  position: relative;
  gap: 4px;
}
.d-form > li.d-detail .d-inner > ul > li {
  width: 100%;
  display: flex;
  align-items: center;
}
.d-form > li.d-detail .d-inner > ul > li:hover {
  filter: brightness(1.1);
}
.d-form > li.d-detail .d-inner > ul > li {
  cursor: pointer;
}
.d-form > li.d-detail .d-inner > ul > li > span {
  color: var(--text-primary);
  font-size: 1rem;
}
.d-form > li.d-detail .d-inner > ul > li > span:last-of-type {
  margin-left: 5px;
  color: var(--text-event-active);
}
.d-form > li.d-detail .d-inner > ul > li > i {
  margin-left: 5px;
  font-size: 1rem;
  color: var(--text-event-active);
}
.d-form > li.d-detail .d-inner > div {
  width: 100%;
  display: none;
  flex-direction: column;
  background: var(--bg-vivid-primary);
  border: 1px solid var(--border-vivid-primary);
  margin-top: 15px;
  padding: 15px;
  border-radius: 8px;
  position: relative;
}
.d-form > li.d-detail .d-inner > div.show {
  display: flex;
}
.d-form > li.d-detail .d-inner > div > span {
  color: var(--text-primary);
  font-size: 1rem;
  margin-bottom: 10px;
}
.d-form > li.d-detail .d-inner > div > img {
  width: 60%;
  max-width: 200px;
  border-radius: 8px;
  padding: 10px 10px;
  background-color: var(--text-primary);
}
.d-form > li.d-extreme .d-inner {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.d-form > li.d-extreme .d-inner > span {
  color: var(--text-primary);
  font-size: 1rem;
}
.d-form > li.d-address.d-inner {
  flex-direction: column;
  margin-bottom: 15px;
  display: none;
}
.d-form > li.d-address.d-inner.show {
  display: flex;
}
.d-form > li.d-address.d-inner > div:first-of-type {
  display: flex;
  background: transparent;
  border: solid 1px #a7a1a1;
  padding: 10px 10px;
  border-radius: 8px;
  margin-bottom: 10px;
  cursor: pointer;
}
.d-form > li.d-address.d-inner > div:first-of-type > span {
  color: #fff;
  margin-right: 10px;
}
.d-form > li.d-address.d-inner > div:first-of-type > i {
  color: #fff;
}
.d-form > li.d-address.d-inner > div:last-of-type {
  display: flex;
  flex-direction: column;
}
.d-form > li.d-address.d-inner > div:last-of-type > span {
  color: #fff;
  margin-bottom: 10px;
}
.d-form > li.d-address.d-inner > div:last-of-type > div {
  display: flex;
}
.d-form > li.d-address.d-inner > div:last-of-type > div > img,
.d-form > li.d-address.d-inner > div:last-of-type > div > canvas {
  width: 60%;
  max-width: 200px;
  border-radius: 8px;
  padding: 10px 10px;
  background-color: #fff;
}
.d-form > li.d-release .d-inner {
  width: 100%;
  display: flex;
  align-items: center;
}
.d-form > li.d-release .d-inner > div {
  width: 20px;
  height: 20px;
  border: solid 1px #fff;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-right: 8px;
  cursor: pointer;
}
.d-form > li.d-release .d-inner > span {
  color: #fff;
  font-size: 1rem;
  cursor: pointer;
}
.d-form > li.d-release .d-inner.active > div::after {
  content: "";
  width: 6px;
  height: 6px;
  background: red;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.d-form > li.d-field {
  flex-direction: column;
}
.d-form > li.d-field .d-inner {
  flex-direction: column;
}
.d-form > li.d-field .d-inner > div {
  width: 100%;
  display: flex;
}
.d-form > li.d-field .d-inner > div.typing {
  position: relative;
}
.d-form > li.d-field .d-inner > div.typing > input,
.d-form > li.d-field .d-inner > div.typing select {
  width: 100%;
  color: var(--text-primary);
  background: var(--bg-raffle-field);
  border: 1px solid var(--border-raffle-v);
  border-radius: 12px;
  margin-bottom: 5px;
  padding: 6px 10px;
  text-align: left;
  font-size: 16px;
}
.d-form > li.d-field .d-inner > div.typing > input.focus,
.d-form > li.d-field .d-inner > div.typing select.focus {
  border: 1px solid var(--border-raffle-third);
}
.d-form > li.d-field .d-inner > div.typing::after {
  content: attr(data-bonus);
  position: absolute;
  right: 0;
  top: 0;
  background: var(--bg-vivid-active);
  color: var(--text-invert);
  font-size: 12px;
  border-radius: 0 8px 0 8px;
  padding: 0px 6px;
}
.d-form > li.d-field .d-inner > div.typing .d-icon-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background: transparent;
  font-size: 14px;
  cursor: pointer;
  color: var(--text-primary);
}
.d-form > li.d-field .d-inner > div.fill {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 10px;
}
.d-form > li.d-field .d-inner > div.fill > button {
  background: var(--bg-raffle-field);
  border: 1px solid #ffdf91;
  border-radius: 12px;
  color: #ffdf91;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1 1 calc(12.5% - 5px);
  height: 40px;
  position: relative;
  font-size: 16px;
}
.d-form > li.d-field .d-inner > div.fill > button.active {
  background: #ffdf91;
  border-color: #ffdf91;
  color: var(--text-invert);
}
.d-form > li.d-field .d-inner > div.fill > button::after {
  content: attr(data-bonus);
  position: absolute;
  right: -1px;
  top: -1px;
  background: var(--bg-vivid-active);
  color: var(--text-invert);
  font-size: 10px;
  border-radius: 0 8px 0 8px;
  padding: 0px 4px;
}
.d-form > li.d-field .d-inner > div.hint {
  width: 100%;
  display: flex;
}
.d-form > li.d-field .d-inner > div.hint > span {
  font-size: 14px;
  color: var(--hint-color);
}
.d-form > li.d-field .d-inner > div.selector {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.d-form > li.d-field .d-inner > div.selector.with-border > div {
  border: 1px solid var(--border-vivid-info);
}
.d-form > li.d-field .d-inner > div.selector > div {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px;
  border-radius: 8px;
  background: var(--bg-vivid-primary);
  cursor: pointer;
}
.d-form > li.d-field .d-inner > div.selector > div > span,
.d-form > li.d-field .d-inner > div.selector > div > i {
  color: var(--text-primary);
  font-size: 14px;
}
.d-form > li.d-field .d-inner > div.selector > div.active > span,
.d-form > li.d-field .d-inner > div.selector > div.active > i {
  color: var(--text-event-active);
}
.d-form > li.d-field .d-inner > div.selector > ul {
  width: 100%;
  display: none;
  flex-direction: column;
  padding: 8px;
  border-radius: 8px;
  gap: 10px;
  background: var(--bg-vivid-primary);
}
.d-form > li.d-field .d-inner > div.selector > ul.show {
  display: flex;
}
.d-form > li.d-field .d-inner > div.selector > ul > li {
  width: 100%;
  display: flex;
  position: relative;
  padding: 4px 0;
  cursor: pointer;
}
.d-form > li.d-field .d-inner > div.selector > ul > li .bonus-name,
.d-form > li.d-field .d-inner > div.selector > ul > li .bonus-min {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 14px;
}
.d-form > li.d-field .d-inner > div.selector > ul > li .info-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-primary);
  font-size: 1rem;
  background: transparent;
  border: 0;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.d-form > li.d-field .d-inner > div.selector > ul > li .info-btn.show {
  display: inline-flex;
}
.d-form > li.d-field .d-inner > div.selector > ul > li.active .bonus-name,
.d-form > li.d-field .d-inner > div.selector > ul > li.active .bonus-min,
.d-form > li.d-field .d-inner > div.selector > ul > li.active .info-btn, .d-form > li.d-field .d-inner > div.selector > ul > li:hover .bonus-name,
.d-form > li.d-field .d-inner > div.selector > ul > li:hover .bonus-min,
.d-form > li.d-field .d-inner > div.selector > ul > li:hover .info-btn {
  color: var(--text-event-active);
}
.d-form > li.d-receipt {
  cursor: default;
  flex-wrap: wrap;
}
.d-form > li.d-receipt .d-inner > div {
  width: calc(100% - 85px - 10px);
  height: 40px;
  background: var(--bg-vivid-primary);
  border-radius: 9px;
  border: 1px solid var(--border-vivid-primary);
  text-align: center;
  display: flex;
  align-items: center;
  margin-right: 10px;
  padding-left: 5%;
}
.d-form > li.d-receipt .d-inner > div > span {
  color: rgba(170, 170, 170, 0.6666666667);
  font-size: 14px;
}
.d-form > li.d-receipt .d-inner > button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 85px;
  height: 40px;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: bold;
  color: var(--text-primary);
  background: var(--btn-vivid-semi);
  border-radius: 8px;
  border: solid 1px var(--border-vivid-info);
}
.d-form > li.d-receipt .d-inner > button:hover {
  filter: brightness(1.2);
}
.d-form > li.d-receipt .d-inner > input {
  display: none;
}
.d-form > li.d-list {
  flex-direction: column;
}
.d-form > li.d-list .d-inner > ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.d-form > li.d-list .d-inner > ul > li {
  width: calc(50% - 5px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: var(--bg-vivid-primary);
  border: 1px solid var(--border-vivid-primary);
  border-radius: 8px;
  color: var(--text-primary);
  padding: 10px 14px;
  cursor: pointer;
  position: relative;
  gap: 5px;
}
.d-form > li.d-list .d-inner > ul > li > i {
  display: none;
  position: absolute;
  left: 8px;
  top: 8px;
  font-size: 1.2rem;
  color: green;
}
.d-form > li.d-list .d-inner > ul > li > a {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.d-form > li.d-list .d-inner > ul > li > a > span,
.d-form > li.d-list .d-inner > ul > li > a > i {
  color: var(--text-primary);
}
.d-form > li.d-list .d-inner > ul > li.none, .d-form > li.d-list .d-inner > ul > li.link-row {
  width: 100%;
  font-size: 14px;
}
.d-form > li.d-list .d-inner > ul > li.bank.add, .d-form > li.d-list .d-inner > ul > li.bank.link-row {
  width: 100%;
  justify-content: center;
}
.d-form > li.d-list .d-inner > ul > li.bank .bank-body {
  display: grid;
  grid-template-columns: 56px minmax(220px, 1fr);
  width: min(100%, 520px);
  margin: 0 auto;
  justify-content: center;
  align-items: center;
  -moz-column-gap: 12px;
       column-gap: 12px;
}
.d-form > li.d-list .d-inner > ul > li.bank .thumb {
  width: 56px;
  height: 56px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}
.d-form > li.d-list .d-inner > ul > li.bank .thumb > img {
  width: 44px;
  height: 44px;
  -o-object-fit: contain;
     object-fit: contain;
}
.d-form > li.d-list .d-inner > ul > li.bank .meta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 4px;
  margin: 0 auto;
}
.d-form > li.d-list .d-inner > ul > li.bank .meta > span {
  color: var(--text-primary);
  text-align: center;
  width: 100%;
  line-height: 1.3;
  font-size: 14px;
}
.d-form > li.d-list .d-inner > ul > li.bank > a:hover > span,
.d-form > li.d-list .d-inner > ul > li.bank > a:hover > i {
  color: var(--text-active);
}
.d-form > li.d-list .d-inner > ul > li.bonus {
  align-items: center;
  justify-content: center;
  padding: 12px 20px 12px 10px;
}
.d-form > li.d-list .d-inner > ul > li.bonus .bonus-name,
.d-form > li.d-list .d-inner > ul > li.bonus .bonus-min {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 14px;
}
.d-form > li.d-list .d-inner > ul > li.bonus .bonus-min {
  display: none;
}
.d-form > li.d-list .d-inner > ul > li.bonus .bonus-name > span {
  color: var(--text-primary);
}
.d-form > li.d-list .d-inner > ul > li.bonus .bonus-min > span {
  border: solid 1px #efefef;
  border-radius: 12px;
  padding: 3px 8px;
}
.d-form > li.d-list .d-inner > ul > li.bonus > .info-btn {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-primary);
  font-size: 1rem;
  background: transparent;
  border: 0;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.d-form > li.d-list .d-inner > ul > li.bonus > .info-btn.show {
  display: inline-flex;
}
.d-form > li.d-list .d-inner > ul > li > div.checked {
  display: none;
}
.d-form > li.d-list .d-inner > ul > li.active {
  color: var(--text-primary);
  border: 2px solid var(--text-event-active);
  background: var(--bg-vivid-checked);
}
.d-form > li.d-list .d-inner > ul > li.active > i {
  display: flex;
}
.d-form > li.d-list .d-inner > ul > li.active > div.checked {
  position: absolute;
  right: -2px;
  top: -2px;
  border-radius: 0 8px 0 8px;
  background: var(--bg-vivid-active);
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.d-form > li.d-list .d-inner > ul > li.active > div.checked > i {
  font-size: 12px;
  color: var(--text-vivid-primary);
}
.d-form > li.d-list .d-inner > ul > li.active .bonus-name > span {
  color: var(--text-event-active);
}
.d-form > li.d-list .d-inner > ul > li.active > .info-btn > i {
  color: var(--text-event-active);
}
.d-form > li.d-list .d-inner > ul > li.none > span {
  color: var(--text-primary);
  font-size: 14px;
}
.d-form > li.d-list.account_bank .d-inner > ul > li {
  width: calc(50% - 5px);
}
.d-form > li.d-list.bonus .d-inner > ul > li {
  width: calc((100% - 20px) / 3);
}
.d-form > li.d-btn {
  justify-content: center;
  padding: 5px 0;
}
.d-form > li.d-btn .d-inner {
  justify-content: center;
}
.d-form > li.d-btn .d-inner > button {
  display: flex;
  flex-direction: column;
  width: 80%;
  font-size: 1rem;
  font-weight: bold;
  padding: 0;
  border-radius: 8px;
  border: solid 1px var(--border-vivid-active);
  overflow: hidden;
}
.d-form > li.d-btn .d-inner > button > div {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  background: var(--btn-raffle-form);
}
.d-form > li.d-btn .d-inner > button > div > span {
  color: var(--text-invert);
  font-size: 14px;
}
.d-form > li.d-btn .d-inner > button:disabled {
  filter: grayscale(1);
}
.d-form > li.d-btn .d-inner > button:not(:disabled):hover {
  filter: brightness(1.2);
}

.v-table-sum {
  width: 100%;
  display: none;
  flex-wrap: wrap;
}
.v-table-sum.show {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}
.v-table-sum > div {
  width: calc((100% - 20px) / 3);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: solid 1px var(--border-raffle-v);
  border-radius: 18px;
  padding: 12px;
}
.v-table-sum > div > span:first-of-type {
  color: var(--btn-raffle-form);
  font-size: 20px;
  font-weight: bold;
  text-align: left;
}
.v-table-sum > div > span:last-of-type {
  color: color-mix(in srgb, var(--text-primary) 80%, transparent);
  font-size: 14px;
  text-align: left;
}

.v-table-wrapper {
  --v-table-radius: 18px;
  width: 100%;
  display: flex;
  flex-direction: column;
  background: rgba(0, 0, 0, 0.3);
  border-radius: var(--v-table-radius);
  border: 1px solid var(--border-primary);
  max-height: 500px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  position: relative;
}
.v-table-wrapper::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  background-color: transparent;
  display: none;
}
.v-table-wrapper::-webkit-scrollbar-track {
  background-color: transparent;
  display: none;
}
.v-table-wrapper::-webkit-scrollbar-thumb {
  border-radius: 25px;
  background-color: transparent;
  display: none;
}
.v-table-wrapper .v-table-header {
  background: var(--bg-raffle-table-header);
  position: sticky;
  top: 0;
  z-index: 2;
}
.v-table-wrapper .v-table-header > div > div > span {
  color: var(--text-raffle-cell-title) !important;
}
.v-table-wrapper .v-table-header,
.v-table-wrapper .v-table-body {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.v-table-wrapper .v-table-header > div,
.v-table-wrapper .v-table-body > div {
  width: 100%;
  display: flex;
}
.v-table-wrapper .v-table-header > div > div,
.v-table-wrapper .v-table-body > div > div {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px 10px;
  color: var(--text-primary);
  text-align: center;
  font-size: clamp(12px, 1vw, 14px);
  white-space: break-spaces;
  word-break: break-all;
  box-sizing: border-box;
  gap: 5px;
}
.v-table-wrapper .v-table-header > div > div > span,
.v-table-wrapper .v-table-body > div > div > span {
  word-break: break-word;
}
.v-table-wrapper .v-table-header > div > div > span.cell-title,
.v-table-wrapper .v-table-body > div > div > span.cell-title {
  display: none;
  color: var(--text-raffle-cell-title);
}
.v-table-wrapper .v-table-header > div > div > span.cell-text,
.v-table-wrapper .v-table-body > div > div > span.cell-text {
  width: 100%;
  display: block;
  color: var(--text-primary);
}
.v-table-wrapper .v-table-header > div > div > span.cell-text.cell-pending,
.v-table-wrapper .v-table-body > div > div > span.cell-text.cell-pending {
  color: var(--pending-color);
}
.v-table-wrapper .v-table-header > div > div > span.cell-text.cell-success,
.v-table-wrapper .v-table-body > div > div > span.cell-text.cell-success {
  color: var(--success-color);
}
.v-table-wrapper .v-table-header > div > div > span.cell-text.cell-copy,
.v-table-wrapper .v-table-body > div > div > span.cell-text.cell-copy {
  color: var(--text-raffle-cell-title);
  cursor: pointer;
  text-decoration: underline;
}
.v-table-wrapper .v-table-header > div > div > span.cell-text.cell-copy > i,
.v-table-wrapper .v-table-body > div > div > span.cell-text.cell-copy > i {
  margin-left: 2px;
}
.v-table-wrapper .v-table-header > div > div > button,
.v-table-wrapper .v-table-body > div > div > button {
  width: 50%;
  height: 35px;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: radial-gradient(164.42% 682.32% at 1.19% 4.76%, var(--btn-task-target-gradient) 0%, var(--btn-task-target-gradient2) 100%);
  border: 1px solid var(--border-task);
  box-shadow: 0px 4px 4px 0px var(--box-shadow-task-primary) inset;
  color: var(--text-primary);
  font-size: 14px;
}
.v-table-wrapper .v-table-header > div > div:last-child,
.v-table-wrapper .v-table-body > div > div:last-child {
  border-right: none;
}
.v-table-wrapper .v-table-body > div:last-child > div {
  border-bottom: none;
}
.v-table-wrapper .v-table-header > div:first-child > div:first-child {
  border-top-left-radius: inherit;
}
.v-table-wrapper .v-table-header > div:first-child > div:last-child {
  border-top-right-radius: inherit;
}
.v-table-wrapper .v-table-body > div:last-child > div:first-child {
  border-bottom-left-radius: inherit;
}
.v-table-wrapper .v-table-body > div:last-child > div:last-child {
  border-bottom-right-radius: inherit;
}

.v-pagination-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.v-pagination-wrapper .v-pagination-container {
  padding: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.v-pagination-wrapper .v-pagination-container > button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  border: solid 1px var(--border-pagination);
}
.v-pagination-wrapper .v-pagination-container > button > span,
.v-pagination-wrapper .v-pagination-container > button i {
  color: var(--text-primary);
  font-size: 14px;
}
.v-pagination-wrapper .v-pagination-container > button.active, .v-pagination-wrapper .v-pagination-container > button:hover {
  background: var(--btn-pagination);
}

.app-install-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
}
.app-install-wrapper > img {
  width: 70%;
  display: none;
  border-radius: 8px;
}
.app-install-wrapper > img.show {
  display: block;
}

.refer-wrapper {
  width: 100%;
  display: flex;
}
.refer-wrapper .refer-left {
  width: 60%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.refer-wrapper .refer-left .refer-left-field {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.refer-wrapper .refer-left .refer-left-field > label {
  width: 100%;
  text-align: left;
  font-size: 14px;
  color: var(--text-primary);
}
.refer-wrapper .refer-left .refer-left-field > div {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
}
.refer-wrapper .refer-left .refer-left-field > div > input {
  width: calc(100% - 70px);
  height: 40px;
  background: var(--bg-raffle-field);
  border: solid 1px var(--border-raffle-v);
  border-radius: 12px;
  color: #6b6b6b;
  padding: 0 10px;
}
.refer-wrapper .refer-left .refer-left-field > div > button {
  width: 60px;
  height: 40px;
  border-radius: 12px;
  border: solid 1px var(--btn-raffle-form);
}
.refer-wrapper .refer-left .refer-left-field > div > button > span,
.refer-wrapper .refer-left .refer-left-field > div > button > i {
  font-size: 16px;
  color: var(--btn-raffle-form);
}
.refer-wrapper .refer-right {
  width: 40%;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 15px;
}
.refer-wrapper .refer-right .refer-right-qr-img {
  width: 100%;
  display: flex;
}
.refer-wrapper .refer-right .refer-right-qr-img > div {
  display: flex;
  background: #fff;
  padding: 4px;
}
.refer-wrapper .refer-right .refer-right-qr-img > div > img {
  width: 100%;
}
.refer-wrapper .refer-right .refer-right-download {
  width: 100%;
  display: none;
}
.refer-wrapper .refer-right .refer-right-download.show {
  display: flex;
}
.refer-wrapper .refer-right .refer-right-download > a {
  width: 100%;
  background: var(--btn-raffle-form);
  border-radius: 12px;
  padding: 8px;
}
.refer-wrapper .refer-right .refer-right-download > a > span {
  color: var(--text-invert);
  font-size: 16px;
  font-weight: bold;
}
.refer-wrapper .refer-right .refer-right-download > a:hover {
  filter: brightness(1.2);
}

.scratch-wrapper {
  width: 100%;
  padding: 0 0 8px 0;
}
.scratch-wrapper .scratch-startup {
  width: 100%;
  display: none;
  flex-direction: column;
}
.scratch-wrapper .scratch-startup.show {
  display: flex;
}
.scratch-wrapper .scratch-startup > div {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.scratch-wrapper .scratch-startup > div:nth-of-type(1) {
  justify-content: center;
  align-items: center;
  margin-bottom: 12px;
}
.scratch-wrapper .scratch-startup > div:nth-of-type(1) > div {
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  color: #17230c;
  font-size: clamp(28px, 4vw, 36px);
  background: linear-gradient(145deg, #fff2b1, #d9a71d);
  box-shadow: 0 18px 45px rgba(217, 167, 29, 0.22);
}
.scratch-wrapper .scratch-startup > div:nth-of-type(2) {
  margin-bottom: 10px;
}
.scratch-wrapper .scratch-startup > div:nth-of-type(2) > span:first-of-type {
  color: #fff;
  font-size: clamp(22px, 4vw, 30px);
}
.scratch-wrapper .scratch-startup > div:nth-of-type(2) > span:last-of-type {
  max-width: 620px;
  margin: 10px auto;
  color: var(--muted);
  font-size: clamp(12px, 1.4vw, 14px);
  line-height: 1.2;
}
.scratch-wrapper .scratch-startup > div:nth-of-type(3) {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  max-width: 600px;
  margin: auto;
}
.scratch-wrapper .scratch-startup > div:nth-of-type(3) > button {
  position: relative;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 5px;
  border-radius: 14px;
  color: var(--green-1000);
  font-size: clamp(14px, 1.6vw, 16px);
  font-weight: 900;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.scratch-wrapper .scratch-startup > div:nth-of-type(3) > button:first-of-type {
  overflow: hidden;
  background: linear-gradient(145deg, var(--gold-100), var(--gold-300) 45%, var(--gold-500));
  box-shadow: 0 12px 30px rgba(217, 155, 37, 0.23), inset 0 1px 0 rgba(255, 255, 255, 0.86);
}
.scratch-wrapper .scratch-startup > div:nth-of-type(3) > button:last-of-type {
  color: var(--gold-200);
  border: 1px solid rgba(249, 214, 108, 0.42);
  background: rgba(249, 214, 108, 0.06);
}

.scratch-game {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  text-align: center;
}
.scratch-game .scratch-step {
  display: none;
}
.scratch-game .scratch-step.show {
  display: block;
}
.scratch-game #scratch-step-1 h2 {
  margin: 0 0 18px;
  color: #fff;
  font-size: clamp(20px, 4vw, 28px);
  font-weight: 700;
}
.scratch-game .scratch-card-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  width: 100%;
}
.scratch-game .scratch-select-card {
  position: relative;
  width: 100%;
  aspect-ratio: 4/3;
  cursor: pointer;
  transition: transform 0.2s ease;
}
.scratch-game .scratch-select-card:hover {
  transform: translateY(-3px);
}
.scratch-game .scratch-select-card.disabled {
  cursor: default;
}
.scratch-game .scratch-select-card.selected {
  transform: scale(0.96);
}
.scratch-game .scratch-select-card.selected .scratch-select-card-inner {
  animation: none;
}
.scratch-game .scratch-select-card.selected .scratch-select-card-inner::before {
  animation: none;
}
.scratch-game .scratch-select-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 10px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
  color: #555;
  animation: scratch-breathe 2.5s ease-in-out infinite;
}
.scratch-game .scratch-select-card-inner span {
  position: relative;
  z-index: 2;
  font-size: 28px;
  font-weight: 700;
}
.scratch-game .scratch-select-card-inner > img {
  width: 100%;
}
.scratch-game .scratch-select-card-inner::before {
  content: "";
  position: absolute;
  top: -60%;
  left: -80%;
  width: 45%;
  height: 220%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.65), transparent);
  transform: rotate(20deg);
  pointer-events: none;
  animation: scratch-shine 2s ease-in-out infinite;
}
.scratch-game {
  /* ========================================
     BREATHING DELAY
  ======================================== */
}
.scratch-game .scratch-select-card:nth-child(1) .scratch-select-card-inner {
  animation-delay: 0s;
}
.scratch-game .scratch-select-card:nth-child(2) .scratch-select-card-inner {
  animation-delay: 0.45s;
}
.scratch-game .scratch-select-card:nth-child(3) .scratch-select-card-inner {
  animation-delay: 0.9s;
}
.scratch-game .scratch-select-card:nth-child(4) .scratch-select-card-inner {
  animation-delay: 1.35s;
}
.scratch-game .scratch-select-card:nth-child(5) .scratch-select-card-inner {
  animation-delay: 1.8s;
}
.scratch-game .scratch-select-card:nth-child(6) .scratch-select-card-inner {
  animation-delay: 2.25s;
}
.scratch-game {
  /* ========================================
     SHINE DELAY
     Separate from breathing
  ======================================== */
}
.scratch-game .scratch-select-card:nth-child(1) .scratch-select-card-inner::before {
  animation-delay: 0s;
}
.scratch-game .scratch-select-card:nth-child(2) .scratch-select-card-inner::before {
  animation-delay: 0.3s;
}
.scratch-game .scratch-select-card:nth-child(3) .scratch-select-card-inner::before {
  animation-delay: 0.6s;
}
.scratch-game .scratch-select-card:nth-child(4) .scratch-select-card-inner::before {
  animation-delay: 0.9s;
}
.scratch-game .scratch-select-card:nth-child(5) .scratch-select-card-inner::before {
  animation-delay: 1.2s;
}
.scratch-game .scratch-select-card:nth-child(6) .scratch-select-card-inner::before {
  animation-delay: 1.5s;
}
.scratch-game {
  /* ========================================
     BREATHING
  ======================================== */
}
@keyframes scratch-breathe {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
  }
  50% {
    transform: scale(1.025);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.25), 0 0 18px rgba(245, 197, 66, 0.4);
  }
}
.scratch-game {
  /* ========================================
     SHINE
  ======================================== */
}
@keyframes scratch-shine {
  0% {
    left: -80%;
    opacity: 0;
  }
  8% {
    opacity: 1;
  }
  30% {
    left: 140%;
    opacity: 1;
  }
  31%, 100% {
    left: 140%;
    opacity: 0;
  }
}
.scratch-game #scratch-step-2 {
  width: 100%;
}
.scratch-game .scratch-card {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.scratch-game .scratch-card .scratch-overlay {
  width: 100%;
  position: relative;
}
.scratch-game .scratch-card .scratch-overlay > img {
  width: 100%;
}
.scratch-game .scratch-card .scratch-overlay {
  pointer-events: none;
  z-index: 3;
}
.scratch-game .scratch-card #scratch-canvas {
  z-index: 2;
  position: absolute;
  width: 38%;
  height: 73%;
  top: 14%;
  right: 12%;
}
.scratch-game .scratch-card .scratch-prize {
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.scratch-game .scratch-card .scratch-prize .scratch-prize-amount {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
.scratch-game .scratch-card .scratch-prize .scratch-prize-amount > img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.scratch-game #scratch-canvas {
  display: block;
  touch-action: none;
  cursor: crosshair;
  border-radius: 8px;
}
.scratch-game #scratch-status {
  min-height: 24px;
  margin-top: 18px;
  color: #fff;
  font-size: 16px;
}
.scratch-game #scratch-progress {
  margin-top: 8px;
  color: #aaa;
  font-size: 13px;
  display: none;
}
.scratch-game #scratch-step-3 {
  width: 100%;
}
.scratch-game .scratch-result {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 20px;
  border: 1px solid var(--border-raffle-norm);
  border-radius: 24px;
  background: var(--bg-raffle-scratch);
}
.scratch-game .scratch-result > div {
  width: 100%;
  display: none;
  justify-content: center;
  align-items: center;
}
.scratch-game .scratch-result > div.show {
  display: flex;
  margin-bottom: 6px;
}
.scratch-game .scratch-result > div.scratch-result-quantity.show {
  margin-bottom: 10px;
}
.scratch-game .scratch-result > div.scratch-result-quantity > span {
  display: inline-flex;
  padding: 7px 12px;
  border-radius: 99px;
  color: #16230c;
  background: var(--gold-300);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0.13em;
}
.scratch-game .scratch-result > div.scratch-result-title > span {
  color: #fff;
  font-size: clamp(20px, 4vw, 36px);
  line-height: 1;
}
.scratch-game .scratch-result > div.scratch-result-img > img {
  width: min(80%, 420px);
}
.scratch-game .scratch-result > div.scratch-result-name > span {
  color: var(--text-raffle-title);
  font-size: clamp(22px, 5vw, 44px);
  font-weight: 950;
  text-transform: capitalize;
}
.scratch-game .scratch-result > div.scratch-result-txt {
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
}
.scratch-game .scratch-result > div.scratch-result-txt > span {
  font-size: clamp(12px, 1.2vw, 14px);
  text-align: left;
  letter-spacing: 0.1px;
}
.scratch-game .scratch-result > div.scratch-result-txt > span:nth-of-type(1) {
  color: var(--text-raffle-title);
  font-weight: bold;
}
.scratch-game .scratch-result > div.scratch-result-txt > span {
  color: var(--text-primary);
  line-height: 1.3;
}
.scratch-game .scratch-result > div.scratch-result-share > button,
.scratch-game .scratch-result > div.scratch-result-share > a {
  position: relative;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 19px;
  border-radius: 14px;
  font-weight: 900;
  letter-spacing: 0.02em;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: var(--text-invert);
  background: var(--btn-raffle-gradient);
  animation: claim-ticket-pulse 1.8s ease-in-out infinite;
}
.scratch-game .scratch-result > div.scratch-result-share > button:hover,
.scratch-game .scratch-result > div.scratch-result-share > a:hover {
  filter: brightness(1.15);
}
@keyframes buttonPulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: var(--box-shadow-raffle-share);
  }
  50% {
    transform: scale(1.16);
    box-shadow: var(--box-shadow-raffle-share2);
  }
}
.scratch-game .scratch-result-title {
  margin-bottom: 20px;
  font-size: 28px;
  font-weight: 800;
}
.scratch-game .scratch-result-label {
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 2px;
}
.scratch-game .scratch-result-amount {
  margin-bottom: 30px;
  font-size: 52px;
  line-height: 1;
  font-weight: 900;
}
.scratch-game #share-prize {
  min-width: 200px;
  height: 48px;
  padding: 0 30px;
  border: 0;
  border-radius: 24px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
}
.scratch-game #share-prize:hover {
  opacity: 0.85;
}
.scratch-game #share-status {
  margin-top: 12px;
  font-size: 13px;
}
.scratch-game #result-card-id {
  display: none;
}
.scratch-game .scratch-loading {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #222;
  color: #fff;
  font-size: 18px;
}
@media (max-width: 576px) {
  .scratch-game {
    max-width: 100%;
  }
  .scratch-game .scratch-card-list {
    gap: 8px;
    grid-template-columns: repeat(2, 1fr);
  }
  .scratch-game .scratch-select-card-inner {
    border-radius: 8px;
  }
  .scratch-game .scratch-select-card-inner span {
    font-size: 22px;
  }
  .scratch-game .scratch-prize-label {
    font-size: 14px;
  }
  .scratch-game .scratch-prize-amount {
    font-size: 38px;
  }
  .scratch-game .scratch-result {
    padding: 10px 15px;
  }
  .scratch-game .scratch-result-title {
    font-size: 24px;
  }
  .scratch-game .scratch-result-amount {
    font-size: 42px;
  }
  .scratch-game #share-prize {
    width: 100%;
    max-width: 220px;
  }
}

.mobile-bottom-banner {
  display: none;
}
@media (max-width: 768px) {
  .mobile-bottom-banner {
    position: fixed;
    left: 0;
    bottom: calc(5px + env(safe-area-inset-bottom));
    z-index: 100;
    width: 100%;
    height: 100px;
    align-items: center;
    justify-content: center;
  }
  .mobile-bottom-banner.show {
    display: flex;
  }
  .mobile-bottom-banner > button {
    width: 70%;
    padding: 10px;
    background: var(--btn-raffle-gradient);
    border: 1px solid var(--border-raffle-remind);
    border-radius: 30px;
    box-shadow: var(--box-shadow-raffle-remind);
    font-size: 14px;
    font-weight: 950;
    letter-spacing: -0.01em;
    text-transform: uppercase;
    white-space: nowrap;
    animation: limePulse 1.9s ease-in-out infinite;
  }
  .mobile-bottom-banner > button > span {
    color: var(--text-invert);
    font-size: 14px;
    font-weight: bold;
  }
  .mobile-bottom-banner > button::after {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.66), transparent);
  }
}

.seo-content-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.seo-content-wrapper .seo-content-container {
  width: 100%;
  display: flex;
  max-width: 1440px;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: var(--bg-raffle-rule-item);
  border: 1px solid var(--border-raffle-rule);
  border-radius: 21px;
}
.seo-content-wrapper .seo-content-container > li {
  width: 100%;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  font-size: 1rem;
  color: var(--text-primary);
}
.seo-content-wrapper .seo-content-container > li .seo-content-title {
  width: 100%;
  padding: 15px 20px;
  border-radius: inherit;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.seo-content-wrapper .seo-content-container > li .seo-content-title > div {
  width: calc(100% - 50px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.seo-content-wrapper .seo-content-container > li .seo-content-title > div > h1,
.seo-content-wrapper .seo-content-container > li .seo-content-title > div > h2 {
  color: var(--text-raffle-count);
  cursor: pointer;
  width: calc(100% - 50px);
  font-size: 21px;
  margin-bottom: 4px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-title > div > p {
  color: var(--text-primary);
  font-size: 15px;
  margin: 0;
  display: block;
  line-height: 1.1;
}
.seo-content-wrapper .seo-content-container > li .seo-content-title > i {
  width: 50px;
  color: var(--text-raffle-count);
  font-size: 18px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt {
  width: 100%;
  padding: 5px 20px;
  display: none;
  border-radius: 0 0 8px 8px;
  font-size: 14px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt > h2,
.seo-content-wrapper .seo-content-container > li .seo-content-txt > h3,
.seo-content-wrapper .seo-content-container > li .seo-content-txt > h4,
.seo-content-wrapper .seo-content-container > li .seo-content-txt > h5,
.seo-content-wrapper .seo-content-container > li .seo-content-txt > h6 {
  color: var(--text-raffle-count);
  font-size: 16px;
  margin: 5px 0;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt a {
  color: var(--text-raffle-count);
  text-decoration: underline;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt > p {
  margin-bottom: 3px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt > p > span {
  color: var(--text-primary);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  margin-top: 10px;
  margin-bottom: 10px;
  border: 1px solid var(--border-raffle-v);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr {
  border-bottom: 1px solid var(--border-raffle-v);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr:last-child {
  border-bottom: none;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr td {
  padding: 10px 12px;
  vertical-align: middle;
  border: 1px solid var(--border-raffle-v);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr td:last-child {
  border: none;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr td:first-child span {
  display: inline-block;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr td:last-child a {
  text-decoration: underline;
  transition: color 0.2s ease;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr:first-child td {
  color: var(--text-primary);
  font-weight: bold;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr:first-child td a {
  color: var(--text-raffle-count);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr:not(:first-child) td {
  color: var(--text-primary);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt table tbody tr:not(:first-child) td a {
  color: var(--text-raffle-count);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul {
  width: 100%;
  padding-left: 1.2em;
  margin: 5px 0;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot {
  list-style: disc inside;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li::marker {
  color: var(--text-raffle-count);
  font-size: 14px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h2,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h3,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h4,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h5,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h6 {
  width: 98%;
  display: inline;
  color: #fff;
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li > span > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h2 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h3 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h4 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h5 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h6 > span {
  color: var(--text-raffle-count);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li > h2,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h3,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h4,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h5,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li h6,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li a {
  color: var(--text-raffle-count);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.dot li:not(:last-of-type) {
  margin-bottom: 3px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number {
  list-style: decimal inside;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li::marker {
  color: var(--text-raffle-count);
  font-size: 14px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h2,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h3,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h4,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h5,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h6,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li a {
  width: 98%;
  display: inline;
  color: #fff;
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li > span > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h2 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h3 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h4 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h5 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h6 > span,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li a > span {
  color: var(--text-raffle-count);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li > h2,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h3,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h4,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h5,
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li h6 {
  color: var(--text-raffle-count);
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul.number li:not(:last-of-type) {
  margin-bottom: 3px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul ul {
  padding-left: 1.5em;
  padding-right: 1.5em;
  margin: 5px 0;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul li ul li::marker {
  color: var(--text-raffle-count);
  font-size: 12px;
}
.seo-content-wrapper .seo-content-container > li .seo-content-txt ul li ul li > span {
  color: var(--text-raffle-count);
}
.seo-content-wrapper .seo-content-container > li:not(:last-of-type) {
  margin-bottom: 15px;
}
.seo-content-wrapper .seo-content-container > li.show .seo-content-title {
  border-radius: 8px 8px 0 0;
}
.seo-content-wrapper .seo-content-container > li.show .seo-content-txt {
  display: block;
}

@media (max-width: 1280px) {
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item {
    padding: 12px;
    min-height: 0;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-quantity > div {
    min-height: 25px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy > span:nth-of-type(2) {
    font-size: 17px;
  }
}
@media (max-width: 768px) {
  .raffle-header-wrapper {
    padding: 0 4px;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-left > a {
    display: flex;
    flex: 0 0 auto;
    height: 45px;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-left > a > img {
    display: block;
    height: 100%;
    width: auto;
    flex-shrink: 0;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right {
    gap: 4px;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-navigation {
    display: none;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-navigation.show {
    display: none;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-user {
    padding: 2px 2px;
    margin-right: 4px;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-ticket {
    padding: 2px 6px;
    border-radius: 8px;
    min-width: 64px;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-ticket > span:first-of-type {
    display: none;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-primary,
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-secondary {
    border-radius: 8px;
    padding: 2px 6px;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-primary > svg,
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-secondary > svg {
    display: block;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-primary > span,
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-secondary > span {
    display: none;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-login {
    margin-right: 4px;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-login,
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-register {
    padding: 4px 10px;
    width: 70px;
    justify-content: center;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-login > svg,
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-register > svg {
    display: none;
  }
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-login > span,
  .raffle-header-wrapper .raffle-header-container .raffle-header-right .header-register > span {
    display: block;
  }
  .raffle-wrapper {
    padding: 0 0 0 0;
  }
  .raffle-wrapper .raffle-container {
    padding: 0 12px;
  }
  .raffle-wrapper .raffle-container .raffle-topic {
    flex-direction: column;
    margin-bottom: 0;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first {
    width: 100%;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(1) {
    display: none;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(1) > span {
    font-size: clamp(12px, 0.95vw, 16px);
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(2) > img {
    width: 100%;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(2) > img:first-of-type {
    display: none;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(2) > img:last-of-type {
    display: block;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(3) {
    margin: 0;
    gap: 0;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(3) > span {
    display: none;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) {
    margin-bottom: 8px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(2) {
    gap: 4px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(2) > div {
    width: 60px;
    height: 60px;
    border-radius: 12px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(2) > div > span:first-of-type {
    font-size: 18px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(4) > div:nth-of-type(2) > div > span:last-of-type {
    font-size: 10px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) {
    gap: 8px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(1) {
    display: none;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(1) > button > span {
    font-size: 16px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(2) {
    gap: 4px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(2) > div {
    width: calc((100% - 12px) / 3);
    padding: 4px 2px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(2) > div > span:first-of-type {
    font-size: 9px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-first > div:nth-of-type(5) > div:nth-of-type(2) > div > span:last-of-type {
    font-size: 9px;
  }
  .raffle-wrapper .raffle-container .raffle-topic .raffle-topic-second {
    width: 100%;
    display: none;
  }
  .raffle-wrapper .raffle-container .raffle-marquee {
    margin-bottom: 8px;
    height: 25px;
  }
  .raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .js-marquee {
    gap: 8px;
  }
  .raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .raffle-marquee-item {
    gap: 4px;
    height: 25px;
  }
  .raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .raffle-marquee-item span:first-of-type {
    padding-left: 3px;
    font-size: 12px;
  }
  .raffle-wrapper .raffle-container .raffle-marquee > div:nth-of-type(2) > div:last-of-type.raffle-marquee-content .raffle-marquee-item span:last-of-type {
    font-size: 12px;
  }
  .raffle-wrapper .raffle-container .raffle-sum {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
    background-image: none;
  }
  .raffle-wrapper .raffle-container .raffle-sum > div {
    width: calc((100% - 8px) / 2);
    padding: 10px 10px 12px 10px;
    gap: 10px;
    background-image: url(../../images/raffle/halloween/rock.png);
    background-size: 100% 100%;
  }
  .raffle-wrapper .raffle-container .raffle-sum > div:nth-of-type(1) {
    width: 100%;
  }
  .raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(1) > img {
    width: 35px;
  }
  .raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(2) > span:first-of-type {
    font-size: 19px;
  }
  .raffle-wrapper .raffle-container .raffle-sum > div > div:nth-of-type(2) > span:last-of-type {
    font-size: 11px;
  }
  .raffle-wrapper .raffle-container .raffle-base-title {
    gap: 6px;
  }
  .raffle-wrapper .raffle-container .raffle-base-title > span:nth-of-type(2) {
    font-size: 24px;
  }
  .raffle-wrapper .raffle-container .raffle-base-title > span:nth-of-type(3) {
    margin: 0;
    font-size: 12px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content {
    flex-direction: column;
    -webkit-box-pack: start;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content.center {
    -webkit-box-pack: center;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content.center .raffle-task-item {
    width: 80%;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-hat {
    width: 80px;
    position: absolute;
    top: 0;
    left: 0;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-ghost {
    width: 80px;
    position: absolute;
    top: 0;
    right: 0;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-candle {
    width: 80px;
    position: absolute;
    bottom: 0;
    left: 0;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item {
    width: 80%;
    padding: 70px 20px;
    margin-right: 8px;
    display: flex;
    flex-direction: column;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item.double-btns .raffle-task-item-step > div {
    padding: 4px 0;
    background: transparent;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-title > span {
    top: 2.2%;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-title > div {
    font-size: 12px;
    height: 25px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail > div {
    margin-bottom: 4px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail > span:first-of-type {
    font-size: 20px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-detail > span:last-of-type {
    font-size: 12px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step {
    gap: 4px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div {
    padding: 4px 10px;
    gap: 4px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.texts > span {
    font-size: 13px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.statistics > div > span {
    font-size: 13px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-step > div > div.statistics > div > span:first-of-type {
    font-size: 24px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn {
    margin-top: auto;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > button,
  .raffle-wrapper .raffle-container .raffle-task-wrapper .raffle-task-container .raffle-task-content .raffle-task-item .raffle-task-item-btn > a {
    width: 100%;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container {
    gap: 6px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content {
    gap: 2px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item {
    grid-column: span 15;
    padding: 6px 10px;
    min-height: 0;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-quantity {
    justify-content: center;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-quantity > div {
    padding: 0 5px;
    min-height: 18px;
    font-size: 8px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy {
    align-items: center;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy > span:nth-of-type(1) {
    letter-spacing: 0;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy > span:nth-of-type(2) {
    margin: 2px 0 0;
    font-size: 10px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-content .raffle-prize-item > div.prize-copy > span:nth-of-type(3) {
    margin: 2px 0 0 0;
    font-size: 7px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live {
    flex-direction: column;
    gap: 0;
    border-radius: 27px;
    background: var(--bg-raffle-live);
    box-shadow: var(--shadow-dark);
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-video {
    width: 100%;
    border-radius: 0;
    border: none;
    background: transparent;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-video > iframe {
    border-radius: 27px 27px 0 0;
    border: none;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail {
    width: 100%;
    padding: 12px 12px 0 12px;
    min-height: auto;
    border-radius: 0;
    border: none;
    background: transparent;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(1) > span {
    font-size: 11px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(2) > span {
    font-size: 24px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(3) > span {
    font-size: 12px;
  }
  .raffle-wrapper .raffle-container .raffle-prize-wrapper .raffle-prize-container .raffle-prize-live > div.raffle-prize-live-detail > div:nth-of-type(5) > button {
    min-height: 46px;
    font-size: 14px;
  }
  .raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content {
    grid-template-columns: repeat(1, 1fr);
  }
  .raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-content .raffle-rule-item {
    min-height: 160px;
  }
  .raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list {
    width: 100%;
  }
  .raffle-wrapper .raffle-container .raffle-rule-wrapper .raffle-rule-container .raffle-rule-list .faq-list {
    width: 100%;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper,
  .raffle-wrapper .raffle-container .raffle-prize-wrapper,
  .raffle-wrapper .raffle-container .raffle-rule-wrapper {
    margin-bottom: 15px;
    padding-top: 15px;
  }
  .raffle-wrapper .raffle-container .raffle-task-wrapper::after,
  .raffle-wrapper .raffle-container .raffle-prize-wrapper::after,
  .raffle-wrapper .raffle-container .raffle-rule-wrapper::after {
    content: "";
    width: 100%;
    height: 1px;
    background: color-mix(in srgb, var(--border-raffle-third) 15%, transparent);
    position: absolute;
    bottom: -15px;
  }
  .raffle-wrapper .raffle-container .raffle-copyright-wrapper {
    padding-bottom: 10px;
  }
  .d-form > li.d-touch .d-inner > div,
  .d-form > li .d-touch2 .d-inner > div {
    width: calc((100% - 20px) / 3);
  }
  .v-table-sum {
    gap: 4px;
  }
  .v-table-sum > div {
    width: 100%;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
    padding: 4px 12px;
  }
  .v-table-sum > div > span:first-of-type {
    font-size: 18px;
  }
  .v-table-sum > div > span:last-of-type {
    font-size: 12px;
  }
  .v-table-wrapper {
    border: none;
    background: transparent;
  }
  .v-table-wrapper .v-table-header {
    display: none;
  }
  .v-table-wrapper .v-table-body {
    gap: 4px;
  }
  .v-table-wrapper .v-table-body > div {
    flex-direction: column;
    border-radius: var(--v-table-radius);
    background: rgba(0, 0, 0, 0.3);
    padding: 10px;
  }
  .v-table-wrapper .v-table-body > div > div {
    justify-content: flex-start;
    border-right: none;
    border-bottom: none;
    padding: 0px 10px;
  }
  .v-table-wrapper .v-table-body > div > div > span.cell-title {
    display: block;
  }
  .v-table-wrapper .v-table-body > div > div > span.cell-text {
    width: auto;
  }
  .v-pagination-wrapper .v-pagination-container {
    gap: 5px;
    padding: 10px 0;
  }
  .v-pagination-wrapper .v-pagination-container > button {
    width: 25px;
    height: 25px;
  }
  .v-pagination-wrapper .v-pagination-container > button > span,
  .v-pagination-wrapper .v-pagination-container > button > i {
    font-size: 12px;
  }
  .app-install-wrapper > img {
    width: 90%;
  }
  .refer-wrapper {
    flex-direction: column;
    gap: 15px;
  }
  .refer-wrapper .refer-left {
    width: 100%;
  }
  .refer-wrapper .refer-right {
    width: 100%;
  }
  .refer-wrapper .refer-right .refer-right-qr-img {
    justify-content: center;
  }
  .refer-wrapper .refer-right .refer-right-qr-img > div {
    width: 50%;
  }
  .v-form .v-age {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .v-form .v-age > img {
    width: 20px;
    height: 20px;
    margin-right: 4px;
  }
  .v-form .v-age > span {
    color: #c4c4c4;
    font-size: 8px;
    line-height: 1;
    text-transform: uppercase;
  }
}
.primary-btn {
  overflow: hidden;
  border-radius: 12px;
  overflow: hidden;
  background: var(--btn-raffle-gradient);
  box-shadow: 0 12px 30px rgba(217, 155, 37, 0.23), inset 0 1px 0 rgba(255, 255, 255, 0.86);
  color: var(--text-invert);
}
.primary-btn > span {
  color: var(--text-invert);
}

.is-btn {
  position: relative;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 19px;
  border-radius: 14px;
  color: var(--green-1000) #031008;
  font-weight: 900;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

@keyframes limePulse {
  0%, 100% {
    transform: translateY(0);
    box-shadow: var(--box-shadow-raffle-remind);
  }
  50% {
    transform: translateY(-3px) scale(1.012);
    box-shadow: var(--box-shadow-raffle-remind2);
  }
}
@keyframes claim-ticket-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(249, 214, 108, 0), 0 0 0 0 rgba(249, 214, 108, 0);
  }
  15% {
    transform: scale(1.08);
    box-shadow: 0 0 0 4px rgba(249, 214, 108, 0.18), 0 0 22px 6px rgba(249, 214, 108, 0.45);
  }
  30% {
    transform: scale(1);
    box-shadow: 0 0 0 8px rgba(249, 214, 108, 0.08), 0 0 35px 10px rgba(249, 214, 108, 0.3);
  }
  45% {
    transform: scale(1.04);
    box-shadow: 0 0 0 3px rgba(249, 214, 108, 0.2), 0 0 18px 5px rgba(249, 214, 108, 0.5);
  }
  60% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(249, 214, 108, 0), 0 0 10px 2px rgba(249, 214, 108, 0.25);
  }
}/*# sourceMappingURL=raffle-halloween.css.map */