/* Route details using the BYD corporate site's restrained monochrome palette,
   square controls, flat surfaces and generous spacing. */

/* Functional headers stay compact so the work surface follows near the fold. */
.app-shell:not([data-route="start"]):not([data-route="company"]) .get-media-banner {
  grid-template-columns: minmax(0, 1fr);
  min-height: 0;
  margin: 0 0 18px;
}
.app-shell:not([data-route="start"]):not([data-route="company"]) .get-media-banner > img {
  width: 100%;
  height: 150px;
  min-height: 0;
  max-height: 150px;
  object-fit: cover;
  object-position: center;
}
.app-shell:not([data-route="start"]):not([data-route="company"]) .get-media-banner > div { padding: 16px 18px; }
.app-shell:not([data-route="start"]):not([data-route="company"]) .get-media-banner strong {
  margin-top: 6px;
  font-size: 20px;
  line-height: 1.25;
  text-shadow: none;
}
.app-shell:not([data-route="start"]):not([data-route="company"]) .get-media-banner p { margin-top: 8px; font-size: 12px; line-height: 1.5; }
.app-shell[data-route="company"] .get-media-banner > img { height: 200px; min-height: 0; max-height: 200px; }

/* Every route uses the same square, 48px action controls as the reference site. */
:is(.get-copy-box, .invite-code-actions, .record-pagination, .team-pagination,
  .card-flip-history-pager, .scratch-history-pages, .invite-qr-actions,
  .activity-page-actions, .withdraw-confirm-actions, .first-withdraw-actions) button,
.invite-code-actions .invite-code-button,
.user-guide-return,
.team-milestone-card .team-milestone-claim,
.team-milestone-card .team-milestone-upgrade,
.team-milestone-vip-notice > a,
.lucky-hero .hero-actions :is(a, button),
.aeei-card-flip .card-flip-start,
.scratch-host .scratch-primary,
.activity-popup-card :is(.activity-popup-primary, .activity-popup-secondary),
.flash-drop-form button,
.new-member-reward-card .new-member-reward-claim,
.lucky-prize-dialog .lucky-prize-confirm,
.sunshine-purchase-dialog .sunshine-modal-submit,
.vip-purchase-confirm-actions button,
.treasure-pot-modal-share,
.treasure-pot-modal-later,
.first-withdraw-support-btn,
.recharge-payment-return-btn,
.recharge-channel-card .recharge-channel-submit,
.turnover-exchange-card .turnover-exchange-submit {
  min-height: 48px;
  padding: 12px 20px;
  border-width: 1px;
  border-style: solid;
  border-radius: 0;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .025em;
  box-shadow: none;
  text-shadow: none;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.get-copy-box button:hover,
.invite-code-actions .invite-code-button:hover,
.user-guide-return:hover,
.record-pagination button:hover:not(:disabled),
.team-pagination button:hover:not(:disabled),
.card-flip-history-pager button:hover:not(:disabled) {
  color: #fff;
  background: #252728;
  border-color: #252728;
}
:is(.task-card-actions, .record-pagination, .team-pagination, .card-flip-history-pager,
  .scratch-history-pages, .invite-qr-actions, .activity-page-actions) button:focus-visible,
.invite-code-button:focus-visible,
.user-guide-return:focus-visible {
  outline: 2px solid #727272;
  outline-offset: 3px;
}
.sunshine-fund-hero,
.sunshine-fund-hero-copy > span,
.sunshine-fund-hero-mark,
.sunshine-fund-stats > div,
.sunshine-fund-section,
.sunshine-records,
.sunshine-record-item,
.sunshine-record-head em,
.sunshine-plan-card,
.sunshine-plan-status,
.sunshine-fund-notice,
.sunshine-purchase-rule,
.sunshine-modal-summary > div,
.wealth-order-card,
.sunshine-rate-row,
.card-flip-summary,
.card-flip-stage,
.card-flip-result,
.inbox-input-box,
.inbox-thread-item,
.inbox-reply-form textarea,
.chat-image-draft,
.app-download-option,
.invite-qr-code,
.invite-qr-code-text,
.turnover-exchange-summary > div,
.turnover-exchange-option,
.turnover-exchange-selected > div,
.turnover-exchange-rate,
.turnover-exchange-preview span {
  border-radius: 0;
  box-shadow: none;
}

/* Product photography sits above the information, as on a vehicle catalogue. */
.task-board-intro { display:grid; gap:10px; margin-bottom:16px; padding:0 2px; }
.task-board-eyebrow { color:#b8151b; font-size:10px; font-weight:600; letter-spacing:.08em; }
.task-board-intro h2 { margin:7px 0; color:#252728; font-size:22px; line-height:1.25; }
.task-board-intro > div > p { margin:0; color:#656b73; font-size:12px; line-height:1.6; }
.task-board-rules { padding:0 12px; border:1px solid #e0e3e8; border-radius:10px; background:#fff; }
.task-board-rules summary { display:flex; align-items:center; gap:7px; min-height:42px; color:#454b52; font-size:12px; font-weight:600; cursor:pointer; }
.task-board-rules summary::after { content:"+"; margin-left:auto; font-size:18px; font-weight:400; }
.task-board-rules[open] summary::after { content:"−"; }
.task-board-rules summary svg { width:15px; height:15px; }
.task-board-rules p { margin:0 0 12px; color:#656b73; font-size:12px; line-height:1.65; }
.task-board-status { margin-bottom:12px; font-size:12px; }
#app[data-route="myTask"] .get-stats-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:8px; margin-bottom:18px; }
#app[data-route="myTask"] .get-stats-grid .stat { min-width:0; min-height:0; padding:12px 9px; border-radius:10px; }
#app[data-route="myTask"] .get-stats-grid .stat > span { font-size:10px; line-height:1.4; }
#app[data-route="myTask"] .get-stats-grid .stat > strong { font-size:clamp(16px,4.5vw,22px); line-height:1.4; overflow-wrap:anywhere; }
.task-history-amount { display:grid; gap:5px; color:#515b66 !important; text-align:right; font-variant-numeric:tabular-nums; }
.task-history-amount small { color:#6a717a; font-size:10px; font-weight:500; }
.task-board-empty { display:grid; justify-items:center; gap:10px; padding:22px 12px; text-align:center; border:1px dashed #dfe2e7; border-radius:12px; background:#fafbfc; }
.task-board-empty > svg { width:30px; height:30px; color:#b8151b; }
.task-board-empty h3 { margin:0; font-size:17px; color:#30353b; }
.task-board-empty p { margin:0; max-width:48ch; color:#656b73; font-size:12px; line-height:1.65; }
.task-board-empty-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:6px; width:100%; }
.task-board-empty-actions :is(a,button) { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; margin:0; font-size:12px; }
.task-board-empty-actions svg { width:16px; height:16px; }
.task.get-task-card {
  min-width: 0;
  min-height: 0;
  color: #252728;
  background: #fff;
  border: 1px solid #dedede;
  border-radius: 12px;
  box-shadow: none;
}
.get-task-list { gap: 16px; }
#app[data-route="myTask"] .section-title { margin-bottom:14px; }
.task.get-task-card.is-task-available .task-card-body { gap:10px; padding:16px; }
.task.get-task-card.is-task-available h3 { font-size:18px; }
.task.get-task-card.is-task-available .task-card-summary { flex-wrap:nowrap; align-items:center; gap:10px; }
.task.get-task-card.is-task-available .task-card-summary span { flex:1 1 0; min-width:0; font-size:11px; }
.task.get-task-card.is-task-available .task-card-summary strong { flex:0 0 auto; font-size:22px; white-space:nowrap; }
.task.get-task-card .task-card-product-background {
  display: block;
  position: relative;
  inset: auto;
  width: 100%;
  height: 96px;
  overflow: hidden;
  background: #f5f5f5;
}
.task.get-task-card .task-card-product-background img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  opacity: 1;
  filter: none;
  transform: none;
}
.task.get-task-card::after { display: none; }
.task.get-task-card .task-card-body {
  display: grid;
  gap: 12px;
  min-width: 0;
  min-height: 0;
  align-content: start;
  padding: 18px;
  background: transparent;
}
.task.get-task-card h3 {
  max-width: 100%;
  margin: 0;
  color: #252728;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
  text-shadow: none;
  white-space: normal;
  overflow-wrap: anywhere;
}
.task.get-task-card .task-card-actions { justify-content: stretch; width: 100%; max-width: 100%; margin: 0; }
.task-card-labels { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:10px; font-weight:600; letter-spacing:.025em; color:#656b73; }
.task-card-labels > :first-child { color:#b8151b; }
.task-card-labels > :last-child { padding:4px 8px; border-radius:5px; background:#f2f3f5; text-align:right; }
.is-task-available .task-card-labels > :last-child { color:#b8151b; background:#fff0f1; }
.is-task-settled .task-card-labels > :last-child { color:#2d644c; background:#edf6f1; }
.task.get-task-card .task-card-actions button {
  flex: 1 1 auto;
  width: 100%;
  min-height: 48px;
  padding: 12px 20px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .025em;
  box-shadow: none;
  white-space: normal;
}
.task.get-task-card .task-card-actions button:not(:disabled) {
  color: #fff;
  background: #c91822;
  border: 1px solid #c91822;
}
.task.get-task-card .task-card-actions button:disabled {
  color: #51565b;
  background: #f5f5f5;
  border: 1px solid #dedede;
  opacity: 1;
}
.task.get-task-card .task-card-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 16px;
  padding: 0;
  color: #51565b;
  background: transparent;
  border: 0;
}
.task.get-task-card .task-card-summary span {
  flex: 1 1 150px;
  color: #616161;
  font-size: 13px;
  line-height: 1.6;
  white-space: normal;
  overflow-wrap: anywhere;
}
.task.get-task-card .task-card-summary strong {
  padding: 0;
  color: #252728;
  background: transparent;
  border-radius: 0;
  font-size: 24px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  text-shadow: none;
}
/* EV task sequence: connect the lead, transfer energy, then confirm the result. */
.task.get-task-card:is(.is-task-running, .is-task-credited) .task-card-actions,
.task.get-task-card.is-task-settled :is(.task-card-actions, .task-card-summary) { display: none; }
.task-fulfillment.task-energy {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 12px;
  color: #252728;
  background: #fafbfc;
  border: 1px solid #e0e3e8;
  border-radius: 10px;
  box-shadow: none;
}
.task-energy__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .13em;
}
.task-energy__meta > :last-child {
  max-width: 65%;
  color: #51565b;
  font-size: 11px;
  letter-spacing: .02em;
  text-align: right;
  overflow-wrap: anywhere;
}
.task-energy__visual {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  max-width: 480px;
  height: 170px;
  margin-inline: auto;
  overflow: hidden;
  isolation: isolate;
  background: #e9edef;
  border: 1px solid #e0e5e9;
  border-radius: 7px;
}
.task-energy__backdrop {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 64%;
  opacity: .94;
  filter: saturate(.8) brightness(1.04);
  pointer-events: none;
}
.task-energy__visual::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, rgba(255, 255, 255, .08), transparent 55%, rgba(245, 248, 249, .1));
  pointer-events: none;
}
.task-energy__visual::after {
  position: absolute;
  z-index: 2;
  left: 3%;
  bottom: 15%;
  width: 21%;
  height: 5%;
  content: "";
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(18, 27, 35, .23), transparent 72%);
  filter: blur(1px);
  pointer-events: none;
}
.task-energy__ground {
  position: absolute;
  z-index: 2;
  left: 32%;
  bottom: 24%;
  width: 63%;
  height: 13px;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 40%, rgba(201, 24, 34, .11), transparent 72%), radial-gradient(ellipse at 50% 65%, rgba(23, 31, 39, .26), transparent 72%);
  opacity: .7;
  filter: blur(1.3px);
  transform: scaleX(.92);
  pointer-events: none;
}
.task-energy__charger-image {
  position: absolute;
  z-index: 3;
  top: 12%;
  left: 3.5%;
  display: block;
  width: 20%;
  height: 69%;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(1px 3px 2px rgba(18, 27, 35, .2));
  pointer-events: none;
}
.task-energy__charger-light {
  position: absolute;
  z-index: 5;
  top: 42%;
  left: 12.7%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #aab5be;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .25);
  pointer-events: none;
}
.task-energy__product {
  position: absolute;
  z-index: 3;
  top: 17%;
  left: 32%;
  width: 64%;
  height: 67%;
  object-fit: contain;
  object-position: center;
  opacity: 1;
  filter: none;
  mix-blend-mode: normal;
  -webkit-mask-image: none;
  mask-image: none;
  transition: opacity .25s ease, transform .4s ease;
}
.task-energy__scene {
  position: absolute;
  z-index: 4;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  transition: opacity .25s ease;
}
.task-energy__scene :is(path, rect, circle, ellipse) {
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.task-energy__scene :is(.task-energy__cable-shadow, .task-energy__cable-edge, .task-energy__cable-track, .task-energy__cable-highlight, .task-energy__cable-flow) { vector-effect:none; }
.task-energy__cable-shadow { stroke: #0e141b; stroke-width: 6.5; opacity: .16; }
.task-energy__cable-edge { stroke: #10171e; stroke-width: 4.8; }
.task-energy__cable-track { stroke-width: 3.8; }
.task-energy__cable-highlight { stroke: #a3adb5; stroke-width: .7; opacity: .36; }
.task-energy__cable-flow {
  stroke: #ef5960;
  stroke-width: 1.1;
  stroke-dasharray: 3 97;
  opacity: 0;
  filter: drop-shadow(0 0 1px rgba(215, 25, 32, .3));
}
.task-energy__plug { filter: drop-shadow(0 1px 1px rgba(9, 15, 22, .2)); }
.task-energy__charge-pack {
  position: absolute;
  z-index: 5;
  left: 31%;
  right: 8%;
  bottom: 4%;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 18px;
  min-width: 0;
  padding: 3px 7px;
  background: rgba(249, 251, 252, .74);
  border: 1px solid rgba(221, 228, 233, .8);
  border-radius: 8px;
  opacity: .9;
}
.task-energy__charge-pack > svg { flex: 0 0 9px; width: 9px; height: 12px; }
.task-energy__charge-pack > svg path { fill: #c91822; }
.task-energy__charge-pack > small { color: #7a828c; font-size: 8px; font-weight: 600; letter-spacing: .08em; }
.task-energy__charge-track {
  flex: 1;
  min-width: 0;
  height: 5px;
  overflow: hidden;
  border-radius: 5px;
  background: #ebdfe2;
}
.task-energy__charge-track > i {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: #c91822;
  transform: scaleX(var(--task-charge, 0));
  transform-origin: left;
  transition: transform .22s linear;
}
.task-energy[data-task-stage="preparing"] .task-energy__product { animation: byd-ev-arrive .55s ease-out both; }
.task-energy[data-task-stage="preparing"] .task-energy__plug { animation: byd-ev-plug .55s .15s ease-out both; }
.task-energy[data-task-stage="preparing"] .task-energy__charger-light { background: #d7232b; box-shadow: 0 0 4px rgba(215, 35, 43, .45); animation: byd-ev-connect 1.2s ease-in-out infinite; }
.task-energy[data-task-stage="processing"] .task-energy__charger-light,
.task-energy[data-task-stage="verifying"] .task-energy__charger-light { background: #d7232b; box-shadow: 0 0 4px rgba(215, 35, 43, .45); }
.task-energy[data-task-stage="processing"] .task-energy__cable-flow {
  opacity: .95;
  animation: byd-ev-transfer 1.65s linear infinite;
}
.task-energy[data-task-stage="processing"] .task-energy__ground { animation: byd-ev-energy 2.1s ease-in-out infinite; }
.task-energy[data-task-stage="verifying"] .task-energy__cable-flow { opacity: .5; }
.task-energy[data-task-stage="verifying"] .task-energy__charge-pack { animation: byd-ev-verify 1.6s ease-in-out infinite; }
.task-energy[data-task-stage="settling"] .task-energy__charger-light { background: #bd7b45; }
.task-energy[data-task-stage="paused"] .task-energy__charger-light { background: #aab5be; box-shadow: none; }
.task-energy[data-task-stage="paused"] .task-energy__charge-pack > svg path { fill: #8b939e; }
.task-energy[data-task-stage="paused"] .task-energy__charge-track > i { background: #8b939e; }
.task-energy:is([data-task-stage="paused"], [data-task-stage="ready"], [data-task-stage="retry"], [data-task-stage="settling"]) .task-energy__visual *,
.task-energy:is([data-task-stage="paused"], [data-task-stage="ready"], [data-task-stage="retry"], [data-task-stage="settling"]) .task-energy__meter > i {
  animation: none;
  transition: none;
}
.task-energy__complete {
  position: absolute;
  z-index: 6;
  inset: 0;
  display: grid;
  place-items: center;
  color: #c91822;
  opacity: 0;
  pointer-events: none;
}
.task-energy__complete svg { display: block; width: 56px; height: 56px; overflow: visible; }
.task-energy__complete :is(circle, path) {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 0;
}
.task-energy__check-ring { stroke-width: 1; }
.task-energy__check { stroke-width: 1.8; }
.task-energy .task-fulfillment__headline,
.task-energy .task-fulfillment__headline strong,
.task-energy .task-fulfillment__headline span { color: #252728; }
.task-energy .task-fulfillment__headline strong { font-size: 13px; font-weight: 500; line-height: 1.5; }
.task-energy .task-fulfillment__headline span { font-size: 12px; font-weight: 500; font-variant-numeric: tabular-nums; }
.task-energy__meter { height: 2px; overflow: hidden; background: #dedede; }
.task-energy__meter > i {
  display: block;
  width: var(--task-progress, 0%);
  height: 100%;
  background: #c91822;
  transition: width .22s linear;
}
.task-energy__steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.task-energy__steps > span { display: flex; align-items: center; gap: 4px; min-width: 0; color: #62666b; }
.task-energy__steps > span:nth-child(2) { justify-content: center; }
.task-energy__steps > span:last-child { justify-content: flex-end; }
.task-energy__steps :is(i, .dot) { display: block; flex: 0 0 4px; width: 4px; height: 4px; background: currentColor; }
.task-energy__steps small { font-size: 10px; font-weight: 500; line-height: 1.5; letter-spacing: .025em; }
.task-energy__steps .is-active,
.task-energy__steps .is-done { color: #252728; }
.task-energy__steps .is-active small { font-weight: 600; }
.task-energy__result {
  display: grid;
  gap: 6px;
  padding: 16px 0 4px;
  border-top: 1px solid #dedede;
  text-align: center;
}
.task-energy__result[hidden] { display: none; }
.task-energy__result small { color: #51565b; font-size: 12px; font-weight: 500; letter-spacing: .03em; }
.task-energy__result strong { color: #252728; font-size: clamp(24px, 6vw, 32px); font-weight: 500; line-height: 1.2; font-variant-numeric: tabular-nums; }
.task-fulfillment.task-energy > p { margin: 0; color: #51565b; font-size: 12px; line-height: 1.6; text-align: left; }
.task-energy[data-task-stage="completed"] :is(.task-energy__product, .task-energy__scene, .task-energy__ground, .task-energy__charge-pack, .task-energy__backdrop, .task-energy__charger-image, .task-energy__charger-light) { opacity: 0; }
.task-energy[data-task-stage="completed"] .task-energy__visual::before,
.task-energy[data-task-stage="completed"] .task-energy__visual::after { opacity: 0; }
.task-energy[data-task-stage="completed"] .task-energy__visual * { animation: none; }
.task-energy[data-task-stage="completed"] .task-energy__complete { opacity: 1; }
.task-energy[data-task-stage="completed"] .task-energy__visual { height:70px; background:transparent; border-color:transparent; }
.task-energy[data-task-stage="completed"] :is(.task-energy__meta, .task-energy__meter, .task-energy__steps, [data-task-progress-label]) { display:none; }
.task-energy[data-task-stage="completed"] .task-fulfillment__headline { justify-content:center; }
.task-energy[data-task-stage="completed"] > p { text-align:center; }
.task-energy[data-task-stage="paused"] .task-energy__meter > i { background:#74797e; }
.task-energy[data-task-stage="retry"] .task-fulfillment__headline strong { color:#b8151b; }
.task-energy[data-task-stage="completed"][data-task-celebrate="true"] .task-energy__visual { height: 170px; animation: byd-ev-scene-finish 1.8s ease-in-out both; }
.task-energy[data-task-stage="completed"][data-task-celebrate="true"] .task-energy__product { animation: byd-ev-depart .85s ease-in both; }
.task-energy[data-task-stage="completed"][data-task-celebrate="true"] .task-energy__scene { animation: byd-ev-station-finish .6s ease-out both; }
.task-energy[data-task-stage="completed"][data-task-celebrate="true"] :is(.task-energy__backdrop, .task-energy__charger-image, .task-energy__charger-light) { animation: byd-ev-station-finish .7s ease-out both; }
.task-energy[data-task-stage="completed"][data-task-celebrate="true"] .task-energy__complete { animation: byd-ev-result-appear .2s .75s ease-out both; }
.task-energy[data-task-stage="completed"][data-task-celebrate="true"] .task-energy__check-ring { animation: byd-energy-check .5s .75s ease-out both; }
.task-energy[data-task-stage="completed"][data-task-celebrate="true"] .task-energy__check { animation: byd-energy-check .35s 1s ease-out both; }
.task-energy[data-task-stage="completed"][data-task-celebrate="true"] .task-energy__result { animation: byd-energy-reward .4s 1.1s ease-out both; }
@keyframes byd-ev-arrive { from { opacity: .3; transform: translateX(12px); } to { opacity: 1; transform: none; } }
@keyframes byd-ev-plug { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes byd-ev-connect { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@keyframes byd-ev-transfer { to { stroke-dashoffset: -100; } }
@keyframes byd-ev-energy { 0%, 100% { opacity: .35; transform: scaleX(.9); } 50% { opacity: .8; transform: scaleX(1); } }
@keyframes byd-ev-verify { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
@keyframes byd-ev-depart { 0% { opacity: 1; transform: none; } 25% { opacity: 1; } 100% { opacity: 0; transform: translateX(46%); } }
@keyframes byd-ev-station-finish { 0%, 30% { opacity: .8; } 100% { opacity: 0; } }
@keyframes byd-ev-result-appear { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: none; } }
@keyframes byd-ev-scene-finish { 0%, 72% { height: 170px; } 100% { height: 70px; } }
@keyframes byd-energy-check { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes byd-energy-reward { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .task-energy *, .task-energy *::before, .task-energy *::after { animation: none !important; transition: none !important; }
  .task-energy[data-task-stage="completed"][data-task-celebrate="true"] .task-energy__visual { height: 70px; }
  .task-energy[data-task-stage="completed"] :is(.task-energy__product, .task-energy__scene, .task-energy__ground, .task-energy__charge-pack, .task-energy__backdrop, .task-energy__charger-image, .task-energy__charger-light) { opacity: 0; transform: none; }
  .task-energy[data-task-stage="completed"] .task-energy__complete,
  .task-energy[data-task-stage="completed"] .task-energy__result { opacity: 1; transform: none; }
  .task-energy__complete :is(circle, path) { stroke-dashoffset: 0; }
}

/* Income summaries are readable cards; referral/team tables keep local scrolling. */
.income-level-card, .reward-table, .team-member-table-scroll { min-width:0; max-width:100%; background:#fff; border:1px solid #e0e3e8; border-radius:12px; box-shadow:none; }
.income-level-card { display:grid; gap:0; padding:0; overflow:hidden; }
.income-level-hero { min-height:0; justify-items:start; padding:22px; color:#252728; background:#f8f9fb; border:0; border-bottom:1px solid #e0e3e8; border-radius:0; box-shadow:none; text-align:left; }
.income-level-hero::before { display:none; }
.income-level-hero span { color:#b8151b; font-size:11px; letter-spacing:.1em; text-shadow:none; }
.income-level-hero h3 { margin-top:7px; color:#252728; font-size:22px; font-weight:600; letter-spacing:-.02em; text-shadow:none; }
.income-plan-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; padding:20px; min-width:0; }
.income-plan-card { display:flex; flex-direction:column; gap:15px; min-width:0; padding:18px; color:#252728; background:#fff; border:1px solid #e0e3e8; border-radius:12px; }
.income-plan-card > header { display:grid; gap:5px; }
.income-plan-card h4 { margin:0; color:#252728; font-size:20px; font-weight:600; line-height:1.3; }
.income-plan-card > header p { margin:0; color:#656b73; font-size:12px; line-height:1.5; }
.income-plan-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0; min-width:0; }
.income-plan-metrics > div { display:grid; align-content:start; gap:8px; min-width:0; container-type:inline-size; }
.income-plan-metrics dt { color:#656b73; font-size:11px; line-height:1.5; }
.income-plan-metrics dd { margin:0; color:#252728; font-size:clamp(14px,11cqw,23px); font-weight:600; line-height:1.3; letter-spacing:-.03em; white-space:nowrap; font-variant-numeric:tabular-nums; }
.income-plan-metrics > div:last-child dd { color:#bd171f; font-weight:700; }
.income-plan-availability { margin:0; color:#626a75; font-size:12px; line-height:1.65; }
.income-plan-gift { margin:0; padding:10px 12px; color:#9e1820; background:#fff2f3; border:1px solid #f0d8db; border-radius:8px; font-size:12px; line-height:1.6; }
.income-plan-card.has-expiry-gift { border-color:#e9c1c5; }
.income-plan-card.is-trial { background:#f8f9fb; }
.income-plan-details { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; margin-top:auto; padding:9px 0 0; color:#b8151b; border-top:1px solid #e7e9ed; font-size:13px; font-weight:600; text-decoration:none; }
.income-plan-details svg { width:16px; height:16px; }
.income-level-card > .notice { margin:0 20px 20px; padding:14px 16px; color:#51565b; background:#f7f8fa; border:1px solid #e4e6eb; border-radius:8px; font-size:13px; line-height:1.7; }
.team-member-table-scroll { overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }
.reward-table-head { color:#616161; background:#f5f5f5; border-color:#dedede; font-size:12px; font-weight:600; }
.reward-table-head span { color:#616161; }
.reward-table-row { color:#454545; background:#fff; border-color:#e9e9e9; font-size:14px; font-weight:500; }
.reward-table-row:nth-child(odd) { background:#fafafa; }
.reward-table-row strong { color:#252728; font-weight:600; }
.reward-table-row span { color:#454545; font-variant-numeric:tabular-nums; }
.reward-banner { color:#252728; background:#f5f5f5; border:1px solid #dedede; border-radius:8px; font-size:14px; font-weight:600; }
@media (min-width:600px) { .income-plan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:960px) { .income-plan-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.reward-table { overflow-x: auto; overscroll-behavior-x: contain; }
.reward-table-head,
.reward-table-row { min-width: 650px; grid-template-columns: 100px 130px repeat(3, minmax(140px, 1fr)); }
[data-route="profit"] .chart { padding: 24px 16px 28px; background: #fff; border: 1px solid #dedede; border-radius: 0; }
[data-route="profit"] .bar i { background: #252728; border-radius: 0; box-shadow: none; }
[data-route="profit"] .bar span { color: #51565b; }
.income-detail-row b { color: #252728; font-variant-numeric: tabular-nums; }
.income-detail-row span,
.income-detail-row em { color: #51565b; }
.income-detail-hero { color: #fff; background: #252728; border-color: #454545; box-shadow: none; }
.income-detail-hero .hero-head strong,
.income-detail-hero .balance strong { color: #fff; }
.income-detail-hero .hero-head span,
.income-detail-hero .balance span { color: #cccccc; }
.record-pagination button,
.team-pagination button { color: #454545; background: #fff; border: 1px solid #dedede; border-radius: 0; }
.team-level-tabs { gap: 0; padding: 0; background: #fff; border: 0; border-bottom: 1px solid #dedede; border-radius: 0; }
.team-level-tabs button { min-height: 56px; color: #51565b; background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; }
.team-level-tabs button.active { color: #252728; background: #fff; border-bottom-color: #252728; box-shadow: none; }
.team-level-tabs button span { color: inherit; }
.team-level-tabs button.active strong,
.team-level-tabs button.active span { color: #252728; }
.team-member-table { min-width: 620px; color: #454545; background: #fff; font-size: 13px; }
.team-member-table th { color: #51565b; background: #f5f5f5; border-color: #dedede; font-size: 12px; font-weight: 600; }
.team-member-table td { border-color: #e9e9e9; }
.team-member-table tbody tr:nth-child(even) { background: #fafafa; }
.team-member-table .team-member-amount { color: #252728; font-weight: 600; }
.team-member-table-note { color: #51565b; font-size: 12px; line-height: 1.6; }
.get-copy-box { background: #fff; border-color: #dedede; border-radius: 0; }
.get-copy-box code { color: #454545; font-size: 13px; }
.get-copy-box button,
.invite-code-actions .invite-code-button { color: #252728; background: #fff; border: 1px solid #252728; border-radius: 0; box-shadow: none; }
.invite-code-actions .invite-code-button svg { color: #252728; }
.invite-code-actions .invite-code-button small { color: #51565b; }
.team-stats-grid.get-stats-grid > .stat-button.active { color: #252728; background: #f5f5f5; border-color: #9d9d9d; }
.team-milestone-section { padding: 18px; background: #fff; border: 1px solid #dedede; border-radius: 0; }
.team-milestone-vip-notice,
.team-milestone-summary { color: #252728; background: #f5f5f5; border: 1px solid #dedede; border-radius: 0; }
.team-milestone-summary strong,
.team-milestone-vip-notice strong { color: #252728; }
.team-milestone-summary span,
.team-milestone-summary small,
.team-milestone-vip-notice small { color: #51565b; font-size: 12px; line-height: 1.5; }
.team-milestone-card,
.team-milestone-card.is-locked,
.team-milestone-card.is-claimed,
.team-milestone-card.is-claimable {
  gap: 14px;
  padding: 18px;
  color: #252728;
  background: #fff;
  border: 1px solid #dedede;
  border-radius: 0;
  box-shadow: none;
}
.team-milestone-card::after { display: none; }
.team-milestone-card.is-claimable { border-color: #9d9d9d; }
.team-milestone-card.is-claimable:hover { border-color: #252728; box-shadow: none; }
.team-milestone-card .team-milestone-reward { padding: 8px 10px; background: #f5f5f5; border-color: #dedede; border-radius: 0; }
.team-milestone-card .team-milestone-reward strong,
.team-milestone-card .team-milestone-card-head strong,
.team-milestone-progress-meta strong { color: #252728; }
.team-milestone-card .team-milestone-reward span,
.team-milestone-progress-meta span,
.team-milestone-claimed-time { color: #51565b; font-size: 12px; }
.team-milestone-kicker svg { color: #252728; }
.team-milestone-progress { height: 6px; background: #e9e9e9; }
.team-milestone-progress i { background: #252728; box-shadow: none; }
.team-milestone-status,
.team-milestone-status.is-claimed { color: #616161; background: #f5f5f5; border-color: #dedede; font-size: 12px; }
.team-milestone-status.is-claimable { color: #252728; background: #f5f5f5; border-color: #dedede; }
.team-milestone-card .team-milestone-claim,
.team-milestone-card .team-milestone-upgrade,
.team-milestone-vip-notice > a { color: #fff; background: #252728; border: 1px solid #252728; box-shadow: none; }
.team-milestone-locked-note,
.team-milestone-claimed-note { color: #51565b; font-size: 12px; line-height: 1.5; }

/* Editorial, help, profile and document screens. */
.job-hero {
  min-height: 260px;
  gap: 16px;
  padding: 32px 24px;
  color: #fff;
  background: linear-gradient(90deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .25)), var(--job-bg), #252728;
  background-size: cover;
  background-position: center;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.job-hero::before { display: none; }
.job-hero > span { width: fit-content; color: #fff; background: transparent; font-size: 12px; font-weight: 500; letter-spacing: .12em; }
.job-hero h2 { color: #fff; font-size: 30px; font-weight: 500; line-height: 1.2; }
.job-hero p { color: #fff; font-size: 13px; line-height: 1.7; }
.helpbook-list { gap: 0; padding: 0; overflow: visible; background: transparent; border: 0; border-top: 1px solid #dedede; }
.helpbook-row { min-height: 80px; padding: 20px 0; background: #fff; border: 0; border-bottom: 1px solid #dedede; border-radius: 0; }
.helpbook-row:last-child { border-bottom: 1px solid #dedede; }
.helpbook-row strong { color: #252728; font-size: 15px; font-weight: 600; }
.helpbook-row span { color: #51565b; }
.helpbook-row:hover { border-color: #bcbcbc; background: #fafafa; }
.help-detail,
.company-certificate-gallery { gap: 24px; padding: 24px; color: #252728; background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.help-detail-title > span,
.company-certificate-head > span { flex: 0 0 42px; width: 42px; height: 42px; color: #252728; background: #f5f5f5; border-radius: 0; }
.help-detail h2 { color: #252728; font-size: 24px; font-weight: 500; line-height: 1.35; letter-spacing: 0; }
.help-detail-intro,
.help-detail-body p,
.company-certificate-head p { color: #51565b; font-size: 14px; line-height: 1.8; }
.help-detail-body { gap: 16px; }
.help-detail-body p { padding-left: 14px; border-left: 2px solid #dedede; overflow-wrap: anywhere; }
.company-certificate-head { align-items: flex-start; gap: 14px; }
.company-certificate-head h3 { margin-bottom: 8px; color: #252728; font-size: 17px; line-height: 1.4; }
.company-certificate-head p { margin-top: 10px; }
.get-info-image-card { overflow: hidden; background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.get-info-image-card figcaption { padding: 18px; background: #fff; }
.get-info-image-card figcaption strong { color: #252728; font-size: 16px; line-height: 1.4; }
.get-info-image-card figcaption span { color: #51565b; font-size: 14px; line-height: 1.7; }
.get-charity-hero { overflow: hidden; border: 1px solid #dedede; border-radius: 0; background: #252728; box-shadow: none; }
.get-charity-hero > div { background: linear-gradient(90deg, rgba(0, 0, 0, .96), rgba(0, 0, 0, .58)); }
.get-charity-hero span,
.get-charity-hero h2,
.get-charity-hero p { color: #fff; }
.charity-gallery .charity-image,
.anti-fraud-gallery .anti-fraud-image { background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.charity-gallery .charity-image > span { color: #fff; background: rgba(0, 0, 0, .72); border-color: rgba(255, 255, 255, .25); }
.user-guide-intro,
.user-guide-state,
.user-guide-page,
.user-guide-page figure { color: #252728; background: #fff; border-color: #dedede; border-radius: 0; box-shadow: none; }
.user-guide-intro > span,
.user-guide-state > span { color: #252728; background: #f5f5f5; }
.user-guide-intro p,
.user-guide-state p,
.user-guide-page figcaption { color: #51565b; font-size: 13px; }
.user-guide-return { color: #252728; background: #fff; border: 1px solid #252728; border-radius: 0; }
[data-route="set"] .row { min-height: 76px; border-radius: 0; }
[data-route="set"] .row-icon { color: #252728; background: #f5f5f5; border: 0; border-radius: 0; }
[data-route="set"] .row-main strong { color: #252728; font-size: 14px; font-weight: 600; }
[data-route="set"] .row-main > span { color: #51565b; font-size: 13px; line-height: 1.5; }
[data-route="language"] .row.row-button,
[data-route="language"] .row.row-button.is-selected { color: #252728; background: #fff; border-color: #dedede; border-radius: 0; box-shadow: none; }
[data-route="language"] .row.row-button.is-selected { border-color: #252728; background: #f5f5f5; }
[data-route="language"] .row.row-button.is-selected :is(strong, span, svg) { color: #252728; }
.identity-upload-card { min-width: 0; padding: 16px; color: #454545; background: #f7f7f7; border: 1px dashed #bcbcbc; border-radius: 0; }
.identity-upload-card > span { color: #454545; font-size: 13px; }
.identity-upload-card em { color: #252728; font-size: 13px; }
.identity-upload-card img { border-radius: 0; }
.job-intro-copy,
.job-action-panel,
.job-progress-panel,
.job-salary-history,
.job-empty-state,
.job-position-card { color: #252728; background: #fff; border-color: #dedede; border-radius: 0; box-shadow: none; }
.job-position-card > b { color: #252728; background: #f5f5f5; }
.job-position-card p,
.job-intro-copy p,
.job-action-panel p { color: #51565b; font-size: 14px; line-height: 1.7; }
.job-progress-track { background: #e9e9e9; }
.job-progress-track i { background: #252728; }

/* Deposit and withdrawal details. Shared form controls come from automotive.css. */
[data-route="recharge"] .get-form-card,
[data-route="withdraw"] .withdraw-simple-card { gap: 20px; padding: 24px 20px; border-radius: 12px; }
[data-route="recharge"] .field > small { color: #51565b; font-size: 12px; line-height: 1.6; }
.withdraw-simple-balance strong { color: #252728; letter-spacing: 0; }
.withdraw-simple-card .withdraw-amount-chip { min-height: 52px; color: #454545; background: #f7f7f7; border: 1px solid #dedede; border-radius: 8px; box-shadow: none; }
.withdraw-simple-card .withdraw-amount-chip.active { color: #fff; background: #d71920; border-color: #d71920; box-shadow: none; }
.withdraw-simple-fees { padding: 16px 0; border-color: #dedede; }
.withdraw-simple-fees > span { color: #51565b; font-size: 13px; }
.withdraw-simple-fees strong,
.withdraw-simple-fees > span:last-child strong { color: #252728; }
.withdraw-simple-rules { color: #51565b; text-align: left; font-size: 12px; line-height: 1.8; }
.withdraw-simple-history { padding: 0 18px; background: #fff; border-color: #dedede; border-radius: 0; }
.withdraw-simple-history summary { min-height: 62px; color: #454545; }
.bank-picker-search,
.recharge-channel-bank-picker { background: #f7f7f7; border-color: #dedede; border-radius: 0; }
.bank-picker-option { color: #252728; background: #fff; border-color: #dedede; }
.bank-picker-option.is-selected,
.bank-picker-option:hover { background: #f5f5f5; border-color: #9d9d9d; }
.recharge-channel-option { color: #252728; background: #fff; border-color: #dedede; border-radius: 0; box-shadow: none; }
.recharge-channel-option small,
.recharge-channel-option span { color: #51565b; }
.recharge-channel-option strong { color: #252728; }
.sunshine-plan-card { color: #252728; background: #fff; border-color: #dedede; box-shadow: none; }
.sunshine-plan-card.active { background: #f5f5f5; border-color: #252728; }
.sunshine-plan-card strong { color: #252728; }
[data-route="wealthFund"] .sunshine-fund-hero { color: #fff; background: #252728; border: 1px solid #454545; box-shadow: none; }
[data-route="wealthFund"] .sunshine-fund-hero h2 { font-size: 24px; line-height: 1.25; }
[data-route="wealthFund"] .sunshine-fund-hero-copy > span { color: #d7d7d7; background: #353535; border-color: #585858; }
[data-route="wealthFund"] .sunshine-fund-hero-mark { background: #353535; border-color: #585858; box-shadow: none; }
[data-route="wealthFund"] .sunshine-fund-hero-mark span { color: #cccccc; }
[data-route="wealthFund"] .sunshine-fund-hero-mark strong { color: #fff; }
[data-route="wealthFund"] .sunshine-fund-stats > div,
[data-route="wealthFund"] .sunshine-fund-section,
[data-route="wealthFund"] .sunshine-records { color: #252728; background: #fff; border-color: #dedede; box-shadow: none; }
[data-route="wealthFund"] .sunshine-fund-stats span,
[data-route="wealthFund"] .sunshine-fund-section-title small { color: #51565b; }
[data-route="wealthFund"] .sunshine-fund-stats strong,
[data-route="wealthFund"] .sunshine-fund-section-title h3 { color: #252728; }
[data-route="wealthFund"] .sunshine-fund-section-title > div > span { color: #252728; background: #f5f5f5; }
[data-route="wealthFund"] .sunshine-plan-card { color: #252728; background: #fff; border-color: #dedede; box-shadow: none; }
[data-route="wealthFund"] .sunshine-plan-card.active { background: #f5f5f5; border-color: #252728; box-shadow: none; }
[data-route="wealthFund"] .sunshine-plan-card:disabled { background: #f7f7f7; border-color: #dedede; box-shadow: none; opacity: 1; }
[data-route="wealthFund"] .sunshine-plan-card:hover:not(:disabled) { border-color: #252728; box-shadow: none; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-name,
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-days b,
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-amounts strong,
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-amounts i { color: #252728; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-term-range,
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-return small { color: #51565b; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-return strong { color: #252728; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-status { color: #616161; background: #f0f0f0; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-progress-ring { background: conic-gradient(#252728 calc(var(--sunshine-progress) * 1%), #e9e9e9 0); }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-progress-ring::before { background: #fff; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-progress-ring strong { color: #252728; }
/* A plan is one full-width card, including inside the 480px desktop app shell. */
[data-route="wealthFund"] .sunshine-plan-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
[data-route="wealthFund"] .sunshine-plan-card {
  width: 100%;
  min-width: 0;
  min-height: 0;
  padding: 46px 16px 18px;
  overflow: hidden;
}
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-status { top: 12px; right: 16px; max-width: calc(100% - 32px); white-space: normal; }
[data-route="wealthFund"] .sunshine-plan-main {
  width: 100%;
  min-width: 0;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
}
[data-route="wealthFund"] .sunshine-plan-main > * { min-width: 0; max-width: 100%; box-sizing: border-box; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-progress-ring { grid-row: span 2; width: 52px; height: 52px; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-progress-ring strong { font-size: 14px; }
[data-route="wealthFund"] .sunshine-plan-term-range {
  width: 100%;
  min-width: 0;
  align-content: start;
  justify-content: stretch;
  justify-items: start;
  gap: 8px;
  text-align: left;
}
[data-route="wealthFund"] .sunshine-plan-primary,
[data-route="wealthFund"] .sunshine-plan-amounts { max-width: 100%; min-width: 0; justify-content: flex-start; white-space: normal; }
[data-route="wealthFund"] .sunshine-plan-amounts { flex-wrap: wrap; gap: 3px 5px; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-amounts strong,
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-amounts i { max-width: 100%; font-size: 13px; line-height: 1.5; white-space: normal; overflow-wrap: anywhere; }
[data-route="wealthFund"] .sunshine-plan-days { color: #51565b; font-size: 13px; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-days b { font-size: 18px; }
[data-route="wealthFund"] .sunshine-plan-return {
  grid-column: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 5px 10px;
  width: 100%;
  min-width: 0;
  margin-top: 0;
  padding-top: 12px;
  border-top: 1px solid #dedede;
  text-align: left;
}
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-return strong { max-width: 100%; font-size: 24px; line-height: 1.2; overflow-wrap: anywhere; }
[data-route="wealthFund"] .sunshine-plan-card .sunshine-plan-return small { flex: 1 1 100px; min-width: 0; max-width: 100%; margin: 0; font-size: 12px; line-height: 1.5; white-space: normal; overflow-wrap: anywhere; }
[data-route="wealthFund"] .sunshine-fund-notice,
[data-route="wealthFund"] .sunshine-purchase-rule { color: #616161; background: #f5f5f5; border-color: #dedede; font-size: 12px; }
[data-route="wealthFund"] .sunshine-record-item { color: #454545; background: #f7f7f7; border-color: #dedede; }
[data-route="wealthFund"] .sunshine-record-head strong,
[data-route="wealthFund"] .sunshine-record-grid strong { color: #252728; }
[data-route="wealthFund"] .sunshine-record-head span,
[data-route="wealthFund"] .sunshine-record-grid span,
[data-route="wealthFund"] .sunshine-record-foot { color: #51565b; }
[data-route="wealthFund"] .sunshine-record-head em,
[data-route="wealthFund"] .sunshine-record-head em.is-completed { color: #616161; background: #f0f0f0; }
.sunshine-purchase-dialog .sunshine-purchase-dialog-head span { color: #252728; }
.sunshine-purchase-dialog .sunshine-purchase-dialog-head h3,
.sunshine-purchase-dialog .sunshine-modal-amount b,
.sunshine-purchase-dialog .sunshine-modal-amount input,
.sunshine-purchase-dialog .sunshine-modal-summary strong { color: #252728; }
.sunshine-purchase-dialog .sunshine-modal-amount > span,
.sunshine-purchase-dialog .sunshine-modal-amount small,
.sunshine-purchase-dialog .sunshine-modal-summary span { color: #51565b; }
.sunshine-purchase-dialog .sunshine-modal-amount > div { border-color: #dedede; }
.sunshine-purchase-dialog .sunshine-modal-summary > div { background: #f5f5f5; }
.sunshine-purchase-dialog .sunshine-modal-summary .sunshine-modal-profit { color: #252728; }
.wealth-order-card,
.sunshine-rate-row { color: #454545; background: #fff; border-color: #dedede; }
.wealth-order-card strong { color: #252728; }

/* Games keep their artwork; navigation, status and results use the app palette. */
.games-menu-button { overflow: hidden; color: #252728; background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.games-menu-button__icon { background: #f5f5f5; border: 0; border-radius: 0; box-shadow: none; }
.games-menu--with-demo .games-menu__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.games-menu--with-demo .games-menu-button__icon svg { width: 36px; height: 36px; }
.games-menu-button:not(:disabled):hover { background: #f5f5f5; transform: none; }
.games-menu-button__name { padding: 16px; color: #252728; background: #fff; font-size: 15px; font-weight: 600; }
.lucky-hero { color: #fff; background: #252728; border-color: #454545; border-radius: 0; box-shadow: none; }
.lucky-hero .hero-head strong,
.lucky-hero .balance strong { color: #fff; }
.lucky-hero .hero-head span,
.lucky-hero .balance span { color: #cccccc; }
.lucky-hero .hero-actions button,
.lucky-hero .hero-actions a { color: #fff; background: transparent; border: 1px solid #fff; border-radius: 0; box-shadow: none; }
.lucky-section { padding: 18px 14px; background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.lucky-result,
.lucky-winner-feed { color: #454545; background: #f5f5f5; border-color: #dedede; border-radius: 0; }
.lucky-winner-line span:last-child { color: #252728; }
.lucky-winner-spark { color: #252728; background: #f5f5f5; }
.lucky-section .lucky-wheel-wrap { color: #252728; background: #f5f5f5; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.lucky-section .lucky-wheel-bg,
.lucky-section .lucky-wheel-base-img,
.lucky-section .lucky-wheel-pointer-img,
.lucky-section .lucky-winner-art { filter: grayscale(1); }
.lucky-section .lucky-wheel-backdrop { background: transparent; }
.lucky-section .lucky-wheel-disc { box-shadow: none; }
.lucky-section .lucky-wheel-slot { color: #252728; }
.lucky-section .lucky-wheel-prize-amount { color: #252728; background: #fff; border: 1px solid #909090; border-radius: 2px; box-shadow: none; font-weight: 600; }
.lucky-section .lucky-wheel-prize-currency { color: #454545; font-weight: 600; }
.lucky-section .lucky-wheel-center { color: #fff; background: #252728; border-radius: 50%; }
.lucky-section .lucky-wheel-center-img { filter: grayscale(1) brightness(.55); }
.lucky-section .lucky-wheel-center-label { color: #fff; font-family: inherit; font-weight: 600; text-shadow: none; }
.lucky-section .lucky-wheel-center:focus-visible { outline-color: #727272; }
.lucky-section .lucky-result,
.lucky-section .lucky-winner-feed { color: #252728; background: #f5f5f5; border-color: #dedede; border-radius: 0; box-shadow: none; }
.lucky-section .lucky-winner-line { color: #252728; }
.lucky-notice { color: #51565b; background: #f5f5f5; border-color: #dedede; border-radius: 0; }
.aeei-card-flip { --card-cream: #252728; --card-gold: #252728; padding: 20px 16px; color: #252728; background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.aeei-card-flip .card-flip-heading span,
.aeei-card-flip .card-flip-heading > svg { color: #252728; }
.aeei-card-flip .card-flip-heading h2 { color: #252728; font-size: 24px; }
.aeei-card-flip .card-flip-summary { padding: 14px; background: #f5f5f5; border-color: #dedede; border-radius: 0; box-shadow: none; }
.aeei-card-flip .card-flip-summary small,
.aeei-card-flip .card-flip-balance,
.aeei-card-flip .card-flip-rules,
.aeei-card-flip .card-flip-round-status { color: #51565b; }
.aeei-card-flip .card-flip-summary strong,
.aeei-card-flip .card-flip-balance strong { color: #252728; }
.aeei-card-flip .card-flip-summary a,
.aeei-card-flip .card-flip-summary button,
.aeei-card-flip .card-flip-footer-actions a,
.aeei-card-flip .card-flip-footer-actions button { color: #252728; font-size: 12px; }
.aeei-card-flip .card-flip-stage { background: #252728; border-color: #cecece; border-radius: 0; box-shadow: none; }
.aeei-card-flip .card-flip-stage::before { border-color: #454545; border-radius: 0; background: transparent; }
.aeei-card-flip .card-flip-board,
.aeei-card-flip .card-flip-round-status { border-radius: 0; }
.aeei-card-flip .card-flip-card,
.aeei-card-flip .card-flip-back,
.aeei-card-flip .card-flip-face { border-radius: 2px; box-shadow: none; }
.aeei-card-flip .card-flip-back,
.aeei-card-flip .card-flip-face { border: 1px solid #bcbcbc; }
.aeei-card-flip .card-flip-back { color: #fff; background: #353535; }
.aeei-card-flip .card-flip-back::before,
.aeei-card-flip .card-flip-back::after,
.aeei-card-flip .card-flip-face::before { border-color: #909090; border-radius: 0; }
.aeei-card-flip .card-flip-back > small,
.aeei-card-flip .card-flip-back b { color: #fff; font-weight: 600; }
.aeei-card-flip .card-flip-back img { background: #fff; border-color: #dedede; border-radius: 2px; box-shadow: none; }
.aeei-card-flip .card-flip-face { color: #252728; background: #f5f5f5; }
.aeei-card-flip .card-flip-face strong { color: #252728; font-weight: 600; letter-spacing: 0; }
.aeei-card-flip .card-flip-face small { color: #51565b; font-weight: 500; }
.aeei-card-flip .card-flip-face::after { background: #727272; }
.aeei-card-flip .card-flip-face em { color: #fff; background: #252728; border-radius: 0; font-weight: 600; }
.aeei-card-flip .card-flip-seal { color: #454545; background: #fff; border-color: #dedede; border-radius: 0; box-shadow: none; }
.aeei-card-flip .card-flip-card.is-selected { outline-color: #fff; filter: none; }
.aeei-card-flip .card-flip-card:focus-visible,
.aeei-card-flip .card-flip-start:focus-visible { outline-color: #909090; }
.aeei-card-flip[data-card-phase="choosing"] .card-flip-card.is-guide-target:not(.is-selected) { outline-color: #fff; }
.aeei-card-flip .card-flip-guide-hand { color: #fff; }
.aeei-card-flip .card-flip-guide-ring { border-color: #fff; }
.aeei-card-flip .card-flip-card.is-pending { animation-name: byd-card-pending; }
@keyframes byd-card-pending { to { filter: brightness(1.16); } }
.aeei-card-flip .card-flip-start { color: #fff; background: #252728; border-color: #252728; box-shadow: none; }
.aeei-card-flip .card-flip-start:disabled { color: #51565b; background: #e9e9e9; border-color: #dedede; box-shadow: none; }
.aeei-card-flip .card-flip-result,
.aeei-card-flip .card-flip-result.is-win { color: #252728; background: #f5f5f5; border-color: #dedede; border-radius: 0; box-shadow: none; }
.card-flip-history-pager button { min-height: 48px; color: #454545; background: #fff; border: 1px solid #252728; border-radius: 0; }
.scratch-host { color: #252728; }
.scratch-host--modal { background: rgba(0, 0, 0, .62); backdrop-filter: blur(5px); }
.scratch-host--page,
.scratch-host--page .scratch-screen { background: #f5f5f5; box-shadow: none; }
.scratch-host .scratch-panel,
.scratch-host--page .scratch-panel { padding: 20px; color: #252728; background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.scratch-header span { color: #252728; }
.scratch-header h1 { color: #252728; font-size: 24px; }
.scratch-host .scratch-close { width: 44px; height: 44px; color: #252728; background: #fff; border: 1px solid #dedede; border-radius: 0; }
.scratch-host .scratch-summary { padding: 13px; color: #252728; background: #f5f5f5; border: 1px solid #dedede; border-radius: 0; }
.scratch-host .scratch-chances { color: #51565b; }
.scratch-host .scratch-chances strong { color: #252728; }
.scratch-host .scratch-status,
.scratch-host--page .scratch-status { color: #616161; background: #f5f5f5; border-radius: 0; font-size: 13px; line-height: 1.6; }
.scratch-host .scratch-primary { color: #fff; background: #252728; border-color: #252728; }
.scratch-host .scratch-history-toggle { min-height: 44px; color: #252728; font-size: 12px; }
.scratch-host .scratch-history.is-open,
.scratch-host .scratch-history-list > li { border-color: #dedede; }
.scratch-host .scratch-history-list strong { color: #252728; }
.scratch-host .scratch-history-list span,
.scratch-host .scratch-history-list small { color: #51565b; font-size: 12px; }
.scratch-host .scratch-history-list .scratch-history-badge { color: #252728; background: #f5f5f5; }
.scratch-host .scratch-history-pages button { color: #454545; background: #f5f5f5; border-color: #dedede; border-radius: 0; }
.scratch-host button:focus-visible,
.scratch-host a:focus-visible { outline: 3px solid #727272; outline-offset: 3px; }

/* Customer support and attachments. */
.support-contact-card { padding: 18px; color: #252728; background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.support-contact-card .support-contact-icon { color: #252728; background: #f5f5f5; border-color: #dedede; border-radius: 0; }
.support-contact-card strong { color: #252728; }
.support-contact-card small,
.support-contact-card p { color: #51565b; font-size: 13px; line-height: 1.6; }
.support-activity-feed { color: #616161; background: #f5f5f5; border-color: #dedede; border-radius: 0; }
.support-activity-icon { color: #252728; background: #f5f5f5; }
.floating-inbox-button { width: 56px; height: 56px; min-width: 56px; padding: 0; color: #252728 !important; background: #f5f5f5 !important; border: 2px solid #fff !important; border-radius: 50% !important; box-shadow: 0 2px 12px rgb(0 0 0 / 16%) !important; }
.floating-inbox-button > .floating-inbox-avatar { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: 50%; }
.floating-inbox-button > svg { width: 25px; height: 25px; color: #252728; stroke-width: 1.6; }
.floating-inbox .aeei-chat-panel { right: max(12px, calc((100vw - var(--app-max)) / 2 + 12px)); color: #252728; background: #fff; border-color: #dedede; border-radius: 14px; box-shadow: 0 18px 48px #17202b24; }
.chat-live-announcement { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); white-space:nowrap; border:0; }
.aeei-chat-panel .inbox-panel-head { padding: 18px; color: #fff; background: #252728; border-color: #454545; }
.aeei-chat-panel .inbox-brand > span { color: #fff !important; background: #353535 !important; border-color: #585858 !important; }
.aeei-chat-panel .inbox-brand > .inbox-support-avatar-wrap { flex: 0 0 40px; width: 40px; height: 40px; padding: 0; overflow: hidden; background: #f5f5f5 !important; border-radius: 50%; box-shadow: none; }
.inbox-support-avatar { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; pointer-events: none; }
.aeei-chat-panel .inbox-panel-head button { color: #fff; background: transparent; border: 1px solid #727272; border-radius: 0; }
.aeei-chat-panel .inbox-tabs { padding: 8px 12px; background: #f5f5f5; }
.aeei-chat-panel .inbox-tabs button { min-height: 48px; color: #51565b; border-radius: 0; }
.aeei-chat-panel .inbox-tabs button.active { color: #252728; background: #fff; border-color: #dedede; box-shadow: none; }
.aeei-chat-panel .inbox-support-detail,
.aeei-chat-panel .inbox-support-thread { background: #f5f5f5; }
.aeei-chat-panel .inbox-thread-item.from-admin { color: #454545; background: #fff; border-color: #dedede; }
.aeei-chat-panel .inbox-thread-item.from-user { color: #fff; background: #252728; border-color: #252728; }
.aeei-chat-panel .inbox-compose-form { background: #fff; border-color: #dedede; }
.aeei-chat-panel .inbox-input-box { color: #454545; background: #fff; border-color: #dedede; box-shadow: none; }
.aeei-chat-panel .inbox-reply-form textarea { color: #252728; background: #f7f7f7; border-color: #dedede; }
.aeei-chat-panel .inbox-reply-form textarea:focus { border-color: #252728; box-shadow: none; }
.aeei-chat-panel .inbox-send-button { color: #fff; background: #252728; border-color: #252728; border-radius: 0; box-shadow: none; }
.aeei-chat-panel .inbox-image-button { color: #51565b; background: #f5f5f5; border-color: #dedede; }
.aeei-chat-panel .chat-history-button { color: #616161; background: #fff; border-color: #dedede; }
.aeei-chat-panel .chat-latest-button { color: #fff; background: #252728; border-color: #252728; box-shadow: none; }
.aeei-chat-panel .inbox-notice-card { color: #454545; background: #fff; border-color: #dedede; border-radius: 0; }
.aeei-chat-panel .inbox-notice-card strong { color: #252728; }
.aeei-chat-panel .inbox-notice-card span { color: #51565b; }
.chat-image-open,
.chat-image-open > span,
.chat-image-draft { color: #51565b; background: #f0f0f0; border-color: #dedede; }
.chat-image-draft > span { color: #51565b; }
.chat-image-draft-remove { color: #454545; background: #fff; border-color: #dedede; }
.chat-image-draft-retry { color: #252728; }
.chat-image-viewer { background: rgba(0, 0, 0, .96); }
.chat-image-viewer-close { color: #fff; background: #353535; border-color: #727272; border-radius: 0; }
.chat-image-open:focus-visible,
.chat-image-draft-remove:focus-visible,
.chat-image-draft-retry:focus-visible,
.chat-image-viewer-close:focus-visible { outline-color: #727272; }

/* Shared overlay surfaces, with scoped action colours instead of global buttons. */
.activity-popup-layer,
.first-withdraw-layer,
.recharge-channel-layer,
.bank-picker-layer,
.invite-qr-layer,
.certificate-preview-layer,
.new-member-reward-layer,
.lucky-prize-layer,
.turnover-exchange-layer,
.sunshine-purchase-modal,
.flash-drop-layer,
.vip-purchase-confirm-layer,
.treasure-pot-reward-layer,
.app-download-layer { background: rgba(0, 0, 0, .56); backdrop-filter: blur(5px); }
.certificate-preview-layer,
.first-withdraw-layer,
.recharge-channel-layer,
.bank-picker-layer,
.invite-qr-layer,
.turnover-exchange-layer,
.flash-drop-layer,
.app-download-layer,
.sunshine-purchase-modal { background: transparent; }
.certificate-preview-backdrop,
.first-withdraw-backdrop,
.withdraw-confirm-backdrop,
.recharge-channel-backdrop,
.bank-picker-backdrop,
.invite-qr-backdrop,
.flash-drop-backdrop,
.app-download-backdrop,
.turnover-exchange-backdrop,
.sunshine-purchase-backdrop { background: rgba(0, 0, 0, .56); }
.activity-config-card,
.activity-popup-card,
.first-withdraw-card,
.recharge-channel-card,
.withdraw-confirm-card,
.bank-picker-card,
.invite-qr-card,
.invite-qr-panel,
.certificate-preview-panel,
.new-member-reward-card,
.lucky-prize-dialog,
.sunshine-purchase-dialog,
.flash-drop-card,
.app-download-card,
.turnover-exchange-card {
  min-width: 0;
  color: #252728;
  background: #fff;
  border: 1px solid #dedede;
  border-radius: 0;
  box-shadow: none;
}
.vip-purchase-confirm-card,
.treasure-pot-reward-dialog {
  color: #252728;
  background: #fff;
  border: 1px solid #dedede;
  border-radius: 0;
  box-shadow: none;
}
.vip-purchase-confirm-card { padding: 24px; gap: 20px; border-radius: 14px; }
.vip-purchase-confirm-mark,
.treasure-pot-reward-icon { color: #252728; background: #f5f5f5; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.vip-purchase-confirm-eyebrow,
.treasure-pot-reward-eyebrow { color: #51565b; font-size: 12px; font-weight: 500; letter-spacing: .1em; }
.vip-purchase-confirm-card h2,
.treasure-pot-reward-dialog h2 { color: #252728; font-size: 24px; font-weight: 500; line-height: 1.3; text-shadow: none; }
.vip-purchase-quote { background: #fff; border: 1px solid #dedede; border-radius: 0; }
.vip-purchase-quote > div { padding: 14px 12px; border-color: #dedede; }
.vip-purchase-quote > div span { color: #51565b; font-size: 12px; }
.vip-purchase-quote > div strong { color: #252728; font-size: 15px; font-weight: 600; }
.vip-purchase-quote .is-purchase,
.vip-purchase-quote .is-credit,
.vip-purchase-quote .is-net { background: #f5f5f5; }
.vip-purchase-policy { color: #51565b; background: #f5f5f5; border: 1px solid #dedede; border-radius: 0; font-size: 12px; line-height: 1.7; }
.vip-purchase-confirm-actions { padding-top: 16px; background: #fff; border-color: #dedede; }
.vip-purchase-confirm-cancel,
.treasure-pot-modal-later,
.recharge-payment-return-btn { color: #252728; background: #fff; border: 1px solid #252728; box-shadow: none; }
.vip-purchase-confirm-submit,
.treasure-pot-modal-share,
.first-withdraw-support-btn { color: #fff; background: #d71920; border: 1px solid #d71920; border-radius: 8px; box-shadow: none; }
.first-withdraw-support-btn:hover:not(:disabled) { color: #fff; background: #454545; border-color: #454545; }
.recharge-payment-return-btn:active { background: #f5f5f5; transform: none; }
.treasure-pot-modal-later { width: 100%; margin-top: 12px; }
.treasure-pot-reward-dialog p,
.treasure-pot-reward-dialog small { color: #51565b; font-size: 12px; line-height: 1.6; }
.vip-purchase-confirm-close,
.treasure-pot-modal-close { width: 44px; height: 44px; color: #252728; background: #fff; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.activity-config-card { box-shadow: none; }
.activity-config-card h2,
.activity-popup-card h2,
.first-withdraw-card h2,
.withdraw-confirm-card h2,
.flash-drop-card h2,
.app-download-card h2,
.new-member-reward-card h2,
.invite-qr-panel h2 { color: #252728; letter-spacing: 0; }
.activity-config-card p,
.activity-popup-card p,
.first-withdraw-card p,
.withdraw-confirm-card p,
.flash-drop-card p,
.app-download-card p,
.new-member-reward-card p,
.invite-qr-panel p { color: #51565b; font-size: 14px; line-height: 1.75; }
.activity-config-card > span { color: #51565b; }
.activity-popup-card > span { color: #51565b; font-weight: 600; }
.activity-popup-card .activity-popup-image,
.activity-config-card > img { background: #f5f5f5; border-color: #dedede; }
.bank-picker-head,
.certificate-preview-top,
.sunshine-purchase-dialog-head { color: #252728; background: #f5f5f5; border-color: #dedede; }
.bank-picker-close,
.certificate-preview-close,
.invite-qr-close,
.flash-drop-close,
.app-download-close,
.first-withdraw-close,
.recharge-channel-close,
.withdraw-confirm-close,
.activity-popup-close,
.new-member-reward-close,
.turnover-exchange-close,
.sunshine-purchase-dialog-head button { color: #51565b; background: #f5f5f5; border: 1px solid #dedede; border-radius: 0; box-shadow: none; }
.activity-popup-card .activity-popup-primary,
.activity-page-actions button:last-child,
.flash-drop-form button,
.new-member-reward-card .new-member-reward-claim,
.lucky-prize-dialog .lucky-prize-confirm,
.sunshine-purchase-dialog .sunshine-modal-submit { color: #fff; background: #252728; border-color: #252728; box-shadow: none; }
.activity-popup-card .activity-popup-secondary,
.activity-page-actions button:first-child { color: #616161; background: #f5f5f5; border-color: #dedede; box-shadow: none; }
.new-member-reward-kicker { color: #51565b; }
.new-member-reward-amount,
.lucky-prize-dialog .lucky-prize-amount,
.withdraw-confirm-amount { color: #252728; font-variant-numeric: tabular-nums; }
.new-member-reward-card small { color: #51565b; }
.lucky-prize-dialog .lucky-prize-message { color: #51565b; font-size: 16px; font-weight: 600; text-shadow: none; }
.lucky-prize-dialog .lucky-prize-amount { color: #252728; background: #f5f5f5; border-color: #dedede; box-shadow: none; text-shadow: none; }
.lucky-prize-dialog .lucky-prize-amount span { color: #51565b; font-size: 13px; font-weight: 500; letter-spacing: 0; }
.lucky-prize-dialog .lucky-prize-amount strong { color: #252728; font-weight: 600; }
.lucky-prize-dialog .lucky-prize-confirm:focus-visible { outline-color: #727272; }
.new-member-reward-card .new-member-reward-image { background: #f7f7f7; border-color: #dedede; border-radius: 0; box-shadow: none; }
.flash-drop-mark,
.withdraw-confirm-mark,
.first-withdraw-mark { color: #252728; background: #f5f5f5; border-color: #dedede; }
.flash-drop-form input { color: #252728; background: #f7f7f7; border-color: #cecece; border-radius: 0; }
.flash-drop-form input:focus-visible { outline-color: #252728; }
.app-download-option { color: #252728; background: #f7f7f7; border-color: #dedede; border-radius: 0; box-shadow: none; }
.app-download-card .app-download-option.is-unavailable { color: #51565b; background: #f5f5f5; border-color: #dedede; }
.app-download-option span { color: #252728; }
.invite-qr-code { background: #fff; border-color: #dedede; }
.invite-qr-code-text { color: #252728; background: #f5f5f5; }
.invite-qr-code,
.invite-qr-code b { border-color: #dedede; box-shadow: none; }
.invite-qr-benefits { color: #616161; border-color: #dedede; }
.invite-qr-actions button:first-child { color: #454545; background: #f5f5f5; border-color: #dedede; }
.withdraw-confirm-fees,
.sunshine-purchase-summary { color: #51565b; background: #f7f7f7; border-color: #dedede; border-radius: 0; }
.turnover-exchange-card .turnover-exchange-heading > span,
.turnover-exchange-card .turnover-exchange-option-icon,
.turnover-exchange-card .turnover-exchange-selected > div > span { color: #252728; background: #f5f5f5; border-color: #dedede; }
.turnover-exchange-card .turnover-exchange-vip-badge { color: #252728; background: #f5f5f5; border: 1px solid #dedede; border-radius: 0; font-weight: 600; }
.turnover-exchange-card .turnover-exchange-heading small,
.turnover-exchange-card .turnover-exchange-option-state,
.turnover-exchange-card .turnover-exchange-option-copy em { color: #252728; }
.turnover-exchange-card .turnover-exchange-summary > div,
.turnover-exchange-card .turnover-exchange-option,
.turnover-exchange-card .turnover-exchange-option.is-insufficient,
.turnover-exchange-card .turnover-exchange-selected > div,
.turnover-exchange-card .turnover-exchange-rate,
.turnover-exchange-card .turnover-exchange-preview span { color: #51565b; background: #f7f7f7; border-color: #dedede; box-shadow: none; }
.turnover-exchange-card .turnover-exchange-summary strong,
.turnover-exchange-card .turnover-exchange-option-copy strong,
.turnover-exchange-card .turnover-exchange-preview strong { color: #252728; }
.turnover-exchange-card .turnover-exchange-option-copy strong { font-size: 14px; }
.turnover-exchange-card .turnover-exchange-option-copy small,
.turnover-exchange-card .turnover-exchange-option-copy em,
.turnover-exchange-card .turnover-exchange-rate small,
.turnover-exchange-card .turnover-exchange-summary span { color: #51565b; font-size: 12px; line-height: 1.6; }
.turnover-exchange-card .turnover-exchange-option-state { font-size: 12px; line-height: 1.5; }
.turnover-exchange-card .turnover-exchange-progress span { font-size: 12px; }
.turnover-exchange-card .turnover-exchange-preview span { font-size: 12px; }
.turnover-exchange-card .turnover-exchange-preview strong { font-size: 14px; }
.turnover-exchange-card .turnover-exchange-count > span { font-size: 13px; }
.turnover-exchange-card .turnover-exchange-progress span.active,
.turnover-exchange-card .turnover-exchange-progress span.done { color: #252728; }
.turnover-exchange-card .turnover-exchange-progress span.active b,
.turnover-exchange-card .turnover-exchange-progress span.done b { color: #fff; background: #252728; }
.turnover-exchange-card .turnover-exchange-progress > i { background: #dedede; }
.turnover-exchange-card .turnover-exchange-count button,
.turnover-exchange-card .turnover-exchange-count input { color: #252728; background: #fff; border-color: #dedede; }

/* Disabled purchases, unavailable payment channels and game actions retain
   their functional state while using the same quiet visual treatment. */
.vip-purchase-confirm-actions button:disabled,
.treasure-pot-modal-share:disabled,
.first-withdraw-support-btn:disabled,
.recharge-channel-option:disabled,
.recharge-channel-option.is-disabled,
.scratch-host .scratch-primary:disabled,
.aeei-card-flip .card-flip-start:disabled,
.sunshine-purchase-dialog .sunshine-modal-submit:disabled,
.record-pagination button:disabled,
.team-pagination button:disabled,
.card-flip-history-pager button:disabled,
.scratch-history-pages button:disabled {
  color: #62666b;
  background: #f5f5f5;
  border-color: #dedede;
  box-shadow: none;
  opacity: 1;
  cursor: not-allowed;
}

@media (max-width: 380px) {
  .task.get-task-card .task-card-body { padding: 17px; }
  .task.get-task-card h3 { max-width: 100%; font-size: 18px; }
  .task.get-task-card .task-card-summary { gap: 8px; }
  .task.get-task-card .task-card-summary span { flex-basis: 130px; }
  .task.get-task-card .task-card-summary strong { font-size: 18px; }
  .help-detail,
  .company-certificate-gallery { padding: 18px; }
  .company-certificate-head { gap: 10px; }
  .company-certificate-head > span { flex-basis: 34px; width: 34px; height: 34px; }
  .team-milestone-section,
  .team-milestone-card { padding: 14px; }
  .team-milestone-card-head,
  .team-milestone-card-foot { gap: 8px; flex-wrap: wrap; }
  .team-milestone-action-wrap { max-width: 100%; }
  .team-milestone-card .team-milestone-reward { margin-left: auto; }
  .team-level-tabs button { padding-inline: 5px; }
  .withdraw-simple-card .withdraw-amount-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .scratch-host .scratch-panel { padding: 16px; }
  .aeei-card-flip { padding: 17px 12px; }
  .aeei-chat-panel .inbox-input-box { gap: 5px; }
}
@media (max-width: 600px) {
  .floating-inbox.is-open .aeei-chat-panel,
  .floating-inbox.is-drag-positioned .aeei-chat-panel { border-radius: 0; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
  .aeei-card-flip .card-flip-card.is-pending { animation: none; }
  .team-milestone-progress i,
  .team-milestone-card.is-claimable { transition: none; }
}
/* This standalone scratch screen uses 16px gutters outside the app shell. */
.scratch-host--page .scratch-topbar {
  margin: -18px -16px 16px;
  width: auto;
}

.trial-support-layer { position:fixed; inset:0; z-index:76; display:grid; place-items:center; padding:max(20px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom)); background:rgba(16,20,27,.6); backdrop-filter:blur(4px); }
.trial-support-backdrop { position:absolute; inset:0; border:0; background:transparent; }
.trial-support-card { position:relative; width:min(100%,390px); max-height:calc(100dvh - 48px); overflow-y:auto; padding:34px 24px 22px; border:1px solid #dfe2e7; border-radius:16px; color:#252728; background:#fff; box-shadow:0 24px 64px #17202b33; text-align:center; }
.trial-support-close { position:absolute; top:10px; right:10px; display:grid; place-items:center; width:44px; height:44px; border:0; border-radius:8px; background:#f4f5f7; color:#51565b; }
.trial-support-close svg { width:18px; height:18px; }
.trial-support-mark { display:grid; place-items:center; width:64px; height:64px; margin:8px auto 20px; border:1px solid #f0c8cc; border-radius:12px; color:#b8151b; background:#fff2f3; }
.trial-support-mark svg { width:31px; height:31px; }
.trial-support-eyebrow { color:#656b73; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.trial-support-card h2 { margin:11px 0 14px; color:#252728; font-size:26px; font-weight:600; line-height:1.2; }
.trial-support-card p { margin:0 0 24px; color:#5d646e; font-size:15px; line-height:1.65; }
.trial-support-contact { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; min-height:50px; padding:12px 18px; border:1px solid #d71920; border-radius:8px; background:#d71920; color:#fff; font-size:14px; font-weight:600; }
.trial-support-contact + .trial-support-contact { margin-top:10px; color:#30353b; background:#fff; border-color:#cbd0d7; }
.trial-support-contact svg { width:19px; height:19px; }
.trial-support-later { min-height:44px; margin-top:9px; padding:8px 18px; border:0; background:transparent; color:#51565b; font-size:13px; }

/* Refund information shares the same surface and accent as the vehicle cards. */
.vip-deposit-notice { display:grid; gap:13px; min-width:0; margin:0 0 18px; padding:18px; border:1px solid #e7d3d6; border-left:4px solid #d71920; border-radius:12px; color:#454b52; background:linear-gradient(120deg,#fff5f5,#fff); }
.vip-deposit-notice-head { display:flex; align-items:center; gap:13px; min-width:0; }
.vip-deposit-term { display:grid; flex:0 0 72px; gap:4px; align-content:center; justify-items:center; min-height:72px; padding:8px 5px; border-radius:10px; color:#fff; background:#b8151b; }
.vip-deposit-term strong { color:inherit; font-size:31px; font-weight:700; line-height:1; }
.vip-deposit-term small { color:#fff; font-size:10px; font-weight:600; line-height:1.3; text-transform:uppercase; white-space:nowrap; }
.vip-deposit-notice .vip-deposit-eyebrow { display:block; margin-bottom:5px; color:#a31b24; font-size:11px; font-weight:600; line-height:1.4; letter-spacing:.04em; text-transform:uppercase; }
.vip-deposit-notice h2 { margin:0; color:#252728; font-size:19px; font-weight:600; line-height:1.3; }
.vip-deposit-notice p { margin:0; color:#51565b; font-size:13px; line-height:1.65; }
.vip-deposit-notice p b { color:#30353b; font-weight:600; }
.vip-deposit-notice-foot { display:grid; gap:11px; padding-top:11px; border-top:1px solid #e7d3d6; }
.vip-deposit-notice-foot > span { color:#656b73; font-size:12px; line-height:1.6; }
.vip-deposit-notice-foot button { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:44px; width:100%; padding:10px 13px; border:1px solid #d71920; border-radius:8px; color:#fff; background:#d71920; font-size:13px; font-weight:600; text-align:left; }
.vip-deposit-notice-foot button svg { width:17px; height:17px; flex:0 0 auto; }
.vip-deposit-notice-foot button:focus-visible { outline:3px solid var(--focus-ring); outline-offset:3px; }
.vip-deposit-notice--confirmation { margin:0; padding:14px; gap:11px; }
.vip-deposit-notice--confirmation .vip-deposit-term { flex-basis:64px; min-height:64px; }
.vip-deposit-notice--confirmation h2 { font-size:17px; }
.vip-deposit-notice--home, .vip-deposit-notice--overview { padding:16px; gap:11px; }
.vip-deposit-notice--home h2, .vip-deposit-notice--overview h2 { font-size:18px; }
.vip-deposit-notice--home .vip-deposit-notice-foot, .vip-deposit-notice--overview .vip-deposit-notice-foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
.vip-deposit-notice--home .vip-deposit-notice-foot button, .vip-deposit-notice--overview .vip-deposit-notice-foot button { width:auto; min-height:44px; padding:8px; border:0; color:#b8151b; background:transparent; }
.vip-deposit-terms { min-width:0; color:#51565b; font-size:12px; line-height:1.6; }
.vip-deposit-terms summary { min-height:44px; padding:10px 0; cursor:pointer; font-weight:600; }
.vip-deposit-terms[open] { flex-basis:100%; }
.vip-deposit-terms > span { display:block; padding:3px 0 7px; }
.vip-deposit-card-note { position:relative; display:grid; gap:5px; margin:10px 0; padding:10px 12px; border:1px solid #e1e3e7; border-radius:8px; color:#51565b; background:#f7f8fa; text-align:left; }
.vip-deposit-card-note b { display:block; color:#30353b; font-size:13px; font-weight:600; line-height:1.4; }
.vip-deposit-card-note > span { display:block; color:inherit; font-size:12px; font-weight:400; line-height:1.5; opacity:1; }
.get-home-vip-card--summary .vip-deposit-card-note { z-index:1; margin:0; color:#51565b; border-color:#e1e3e7; background:#f7f8fa; }
.vip-level-card .vip-deposit-card-note { margin:7px 0 0; padding:8px; }
.vip-level-card .vip-deposit-card-note b, .vip-level-card .vip-deposit-card-note > span { font-size:11px; line-height:1.5; }
.vip-deposit-card-note.is-observation, .vip-deposit-card-note.is-previous, .vip-deposit-card-note.is-review, .vip-deposit-card-note.is-free { color:#51565b; background:#f4f5f7; border-color:#dfe2e7; }
@media (max-width:360px) { .vip-deposit-notice { padding:15px 13px; gap:11px; } .vip-deposit-notice-head { gap:10px; } .vip-deposit-term { flex-basis:66px; min-height:66px; } .vip-deposit-notice h2 { font-size:17px; } }
.trial-support-card button:focus-visible { outline:3px solid var(--focus-ring); outline-offset:3px; }

.vip-holdings-summary { margin:0 0 16px; padding:16px; border:1px solid #e0e3e8; background:#f7f8fa; border-radius:12px; }
.vip-holdings-summary > strong { display:block; margin-bottom:12px; color:#30353b; font-size:14px; }
.vip-holdings-summary > div { display:grid; grid-template-columns:repeat(auto-fit,minmax(125px,1fr)); gap:9px; }
.vip-holdings-summary a { display:grid; gap:5px; min-height:56px; padding:11px; color:#30353b; border:1px solid #e0e3e8; border-radius:8px; background:#fff; text-decoration:none; }
.vip-holdings-summary a b { font-size:14px; }
.vip-holdings-summary a span, .vip-holdings-summary p { margin:0; font-size:12px; line-height:1.5; }
.multi-vip-task-tabs { display:flex; gap:8px; margin-bottom:16px; overflow-x:auto; max-width:100%; }
.multi-vip-task-summary { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
.multi-vip-task-summary .stat { min-width:0; padding:12px 9px; border-radius:10px; }
.multi-vip-task-summary .stat span { font-size:11px; }
.multi-vip-task-summary .stat strong { font-size:20px; overflow-wrap:anywhere; }
.multi-vip-task-tabs a, .multi-vip-task-tabs button { display:inline-flex; flex:0 0 auto; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:9px 13px; border:1px solid #dfe2e7; border-radius:8px; background:#fff; color:#454b52; font-size:12px; font-weight:600; text-decoration:none; }
.multi-vip-task-tabs [aria-current="page"] { color:#b8151b; background:#fff2f3; border-color:#e4b2b8; }
.multi-vip-task-tabs svg { width:14px; height:14px; }
.multi-vip-task-group .section-title h2 { margin-bottom:4px; }
.multi-vip-task-group .section-title span { color:#656b73; font-size:12px; }
.multi-vip-task-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:14px; }
.multi-vip-task-metrics > span { display:grid; gap:5px; min-width:0; padding:11px 8px; background:#f7f8fa; border-radius:8px; color:#656b73; font-size:11px; }
.multi-vip-task-metrics b { color:#30353b; font-size:13px; overflow-wrap:anywhere; }
.multi-vip-referral-guide { margin:0; padding:22px 17px; color:#454b52; border:1px solid #e0e3e8; border-radius:12px; background:#f8f9fb; }
.multi-vip-referral-guide > span { color:#b8151b; font-size:11px; letter-spacing:.07em; }
.multi-vip-referral-guide h2 { margin:10px 0; color:#252728; font-size:22px; line-height:1.3; font-weight:600; }
.multi-vip-referral-rate { display:block; margin:18px 0; color:#b8151b; font-size:30px; }
.multi-vip-referral-table > div { display:grid; grid-template-columns:34px repeat(3,minmax(0,1fr)); gap:4px; padding:13px 0; border-top:1px solid #e0e3e8; font-size:11px; font-variant-numeric:tabular-nums; }
.multi-vip-referral-table span, .multi-vip-referral-table b { min-width:0; overflow-wrap:anywhere; }
.multi-vip-referral-guide p { margin-top:16px; color:#626a75; font-size:12px; line-height:1.7; }
.multi-vip-referral-guide a { display:block; min-height:44px; padding:12px 0; color:#b8151b; font-size:13px; font-weight:600; text-decoration:underline; text-underline-offset:4px; }

/* Thirty-day BYD deposits, exact NGN figures and expiry gift history. */
.vip-income-poster { display:block; margin:16px 0 20px; color:#b71822; text-decoration:none; border:1px solid #e3e5e9; border-radius:10px; overflow:hidden; background:#f5f6f8; }
.vip-income-poster img { display:block; width:100%; height:auto; max-height:520px; object-fit:contain; background:#f5f6f8; }
.vip-income-poster > span { display:flex; align-items:center; justify-content:center; gap:8px; padding:12px; font-size:12px; font-weight:600; background:#fff; }
.vip-income-poster svg { width:15px; height:15px; }
.vip-income-metric-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:14px 0 20px; }
.vip-income-metric-grid > div { display:grid; gap:7px; min-width:0; padding:13px 10px; background:#f8f9fb; border:1px solid #e4e6eb; border-radius:8px; }
.vip-income-metric-grid small { color:#515761; font-size:12px; font-weight:600; }
.vip-income-metric-grid strong { color:#c71820; font-size:clamp(11px,3.5vw,17px); line-height:1.35; font-variant-numeric:tabular-nums; white-space:nowrap; }
.vip-income-metric-grid span { color:#69717b; font-size:10px; }
.vip-deposit-history { margin:18px 0; padding:17px; background:#fff; border:1px solid #e4e6eb; border-radius:10px; }
.vip-deposit-history > header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:13px; }
.vip-deposit-history > header span { font-size:10px; color:#b71921; letter-spacing:.04em; text-transform:uppercase; }
.vip-deposit-history h2 { margin:4px 0 0; color:#252728; font-size:17px; }
.vip-deposit-history > header button { min-height:38px; padding:8px 11px; border:1px solid #dedfe4; border-radius:6px; color:#4e5661; background:#fff; font-size:11px; }
.vip-deposit-history p { color:#606873; font-size:12px; line-height:1.6; }
.vip-deposit-history-list { display:grid; gap:10px; }
.vip-deposit-history-list article { padding:13px; border:1px solid #e7e9ed; background:#fbfcfd; border-radius:7px; }
.vip-deposit-history-title { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; margin-bottom:10px; }
.vip-deposit-history-title strong { color:#252728; font-size:14px; }
.vip-deposit-history-title span { color:#5f6771; font-size:10px; text-align:right; }
.vip-deposit-history-list article > b { display:block; font-size:clamp(14px,5vw,20px); color:#252728; font-variant-numeric:tabular-nums; }
.vip-deposit-gift { display:grid; gap:5px; margin-top:10px; padding:11px; border-left:3px solid #d71920; background:#fff3f4; }
.vip-deposit-gift strong { font-size:13px; color:#a71923; }
.vip-deposit-gift span,.vip-deposit-gift small { font-size:11px; color:#616771; }
.vip-deposit-gift p { margin:2px 0; }
.vip-deposit-notice-foot > a { display:flex; align-items:center; gap:7px; min-height:44px; padding:8px 0; color:#b8151b; font-size:13px; font-weight:600; text-decoration:none; }
.vip-deposit-notice-foot > a svg { width:16px; height:16px; }
#app .get-home-vip-card--summary .home-vip-summary-metric { container-type:inline-size; }
#app .get-home-vip-card--summary .home-vip-summary-metric strong { font-size:clamp(10px,10cqw,20px); }
.vip-purchase-quote strong { overflow-wrap:anywhere; font-size:clamp(17px,5vw,27px); font-variant-numeric:tabular-nums; }
.vip-purchase-confirm-submit { white-space:normal; overflow-wrap:anywhere; }
@media(max-width:360px) { .vip-deposit-history { padding:13px; } .vip-income-metric-grid { gap:7px; } .vip-income-metric-grid > div { padding:11px 8px; } }

/* Daily income is the primary metric; expiry gifts have a dedicated showcase. */
.vip-income-metric-grid > div { container-type:inline-size; padding:16px 12px; background:#fff8f8; border-color:#f0d8db; }
.vip-income-metric-grid strong { font-size:18px; font-size:clamp(12px,11.5cqw,24px); font-weight:700; }
.vip-income-metric-grid > div.has-expiry-gift { border-color:#e7a6ad; background:linear-gradient(145deg,#fff,#fff0f1); }
.vip-income-gift-label { display:block; color:#a91721; font-size:11px; line-height:1.5; }
.vip-expiry-gift { display:grid; grid-template-columns:minmax(105px,.9fr) minmax(0,1.1fr); align-items:center; gap:15px; margin:16px 0; padding:15px; border:1px solid #ebbac0; border-radius:12px; background:linear-gradient(135deg,#fff,#fff2f3); color:#252728; text-align:left; }
.vip-expiry-gift-visual { display:grid; place-items:center; overflow:hidden; min-width:0; height:176px; background:#fff; border-radius:8px; }
.vip-expiry-gift-visual img { display:block; width:100%; height:100%; max-width:100%; object-fit:contain; transform:none; position:static; }
.vip-expiry-gift.is-phone .vip-expiry-gift-visual { background:#06111f; }
.vip-expiry-gift-copy { display:grid; gap:8px; min-width:0; }
.vip-expiry-gift-badge { justify-self:start; padding:4px 8px; color:#fff; background:#d71920; border-radius:4px; font-size:10px; font-weight:700; letter-spacing:.05em; }
.vip-expiry-gift-copy strong { color:#a91721; font-size:20px; font-weight:700; line-height:1.2; overflow-wrap:anywhere; }
.vip-expiry-gift-copy b { color:#252728; font-size:13px; }
.vip-expiry-gift-copy small { color:#69717b; font-size:10px; line-height:1.5; }
@media(max-width:360px) { .vip-expiry-gift { gap:10px; padding:11px; } .vip-expiry-gift-visual { height:148px; } .vip-expiry-gift-copy strong { font-size:17px; } }

/* Clear values and date captions remain available for all seven chart days. */
.chart.income-trend-chart { display:grid; grid-template-columns:repeat(7,minmax(98px,1fr)); align-items:stretch; gap:12px; min-width:0; max-width:100%; height:auto; padding:18px 4px 8px; overflow-x:auto; overscroll-behavior-x:contain; }
.chart.income-trend-chart .income-trend-day { display:grid; grid-template-rows:auto 132px auto; align-items:end; justify-items:center; gap:10px; min-width:0; width:auto; height:auto; margin:0; padding:4px; background:transparent; }
.chart.income-trend-chart .income-trend-amount { display:block; position:static; inset:auto; max-width:none; color:#30353b; font-size:13px; font-weight:600; line-height:1.4; text-align:center; white-space:nowrap; transform:none; font-variant-numeric:tabular-nums; }
.chart.income-trend-chart .income-trend-day > i { display:block; align-self:end; width:52%; max-width:42px; min-height:0; margin:0 auto; background:#d71920; border-radius:5px 5px 0 0; box-shadow:none; }
.chart.income-trend-chart figcaption { color:#626a75; font-size:11px; line-height:1.5; text-align:center; }
.chart.income-trend-chart .income-trend-day:focus-visible { outline:2px solid var(--focus-ring); outline-offset:-2px; border-radius:8px; }

/* The game lobby shares the app chrome; game stages keep their own artwork. */
#app[data-route="games"] .games-menu { display:block; padding:0; background:transparent; border:0; box-shadow:none; }
#app[data-route="games"] .games-menu__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
#app[data-route="games"] .games-menu-button { display:grid; align-content:start; justify-items:start; min-width:0; min-height:166px; padding:21px; gap:12px; color:#252728; background:#fff; border:1px solid #e0e3e8; border-radius:14px; box-shadow:none; text-align:left; }
#app[data-route="games"] .games-menu-button::before, #app[data-route="games"] .games-menu-button::after { display:none; }
#app[data-route="games"] .games-menu-button__icon { display:grid; place-items:center; width:50px; height:50px; margin:0; color:#b8151b; background:#fff2f3; border:0; border-radius:10px; box-shadow:none; }
#app[data-route="games"] .games-menu-button__icon svg { width:27px; height:27px; }
#app[data-route="games"] .games-menu-button strong, #app[data-route="games"] .games-menu-button__name { color:#252728; font-size:16px; font-weight:600; line-height:1.4; }
#app[data-route="games"] .games-menu-button small, #app[data-route="games"] .games-menu-button p { color:#626a75; font-size:13px; line-height:1.6; }
#app[data-route="games"] .games-menu-button:hover:not(:disabled) { background:#fff8f8; border-color:#e3b7bc; transform:none; }
#app[data-route="games"] .games-menu-button:disabled { color:#626a75; background:#f7f8fa; border-color:#e0e3e8; opacity:1; }
@media (min-width:960px) { #app[data-route="games"] .games-menu__grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:359px) { #app[data-route="games"] .games-menu__grid { gap:10px; } #app[data-route="games"] .games-menu-button { padding:16px 12px; } }