:root {
  --acc-bg:var(--primary-bg, #f6f7f9);
  --acc-bg-weak:var(--secondary-bg, #ebedef);
  --acc-ink:var(--text-main,
  #26292c);
  --acc-ink-soft:var(--text-muted,
  #57595b);
  --acc-accent:var(--accent,
  #383838);
  --acc-contrast:var(--accent-contrast,
  #979797);
  --acc-gold:var(--gold,
  #f5c950);
  --acc-blue:var(--accent-blue,
  #2483d6);
  --acc-success:var(--success,
  #3b6b3d);
  --acc-danger:var(--danger,
  #c23a2b);
  --acc-border:var(--border-light,
  #d3d4d6);
  --acc-shadow:var(--box-shadow,
  0 6px 24px rgba(50, 50, 50, .08),
  0 1.5px 8px rgba(30, 30, 30, .07));
  --acc-radius:var(--box-radius,
  13px);
  --acc-radius-sm:10px;
  --acc-radius-pill:999px;
  --acc-container-max:1240px;
  --acc-container-dash:1180px;
  --acc-section-pad-x:18px;
  --acc-section-pad-y:18px;
  --acc-section-gap:16px;
  --acc-btn-width:280px;
  --acc-btn-height:48px;
  --acc-panel-sm:680px;
  --acc-panel-md:1040px;
  --acc-panel-lg:1160px
}
.account-main,
.account-main.container,
.container.account-main,
main.account-main {
  width:100%!important;
  max-width:var(--acc-container-max)!important;
  margin:0 auto 28px!important;
  padding:clamp(18px,
  2.8vw,
  34px) clamp(12px, 2.2vw, 18px)!important
}
.account-main *,
.account-main ::after,
.account-main ::before {
  box-sizing:border-box
}
.account-section {
  width:100%!important;
  max-width:var(--acc-container-dash)!important;
  margin:0 auto!important;
  background:var(--acc-bg);
  border:1.5px solid var(--acc-border);
  border-radius:var(--acc-radius);
  box-shadow:var(--acc-shadow);
  padding:var(--acc-section-pad-y) var(--acc-section-pad-x) calc(var(--acc-section-pad-y) + 4px);
  position:relative;
  background-image:linear-gradient(180deg,
  #f7f8fb 0,
  #fff 150px);
  display:flex;
  flex-direction:column;
  gap:var(--acc-section-gap)
}
.container.account-main.is-dashboard,
.container.account-main[data-page=dashboard] {
  max-width:var(--acc-container-max)!important
}
.account-main .account-breadcrumb {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.35rem;
  margin:0!important;
  padding:0!important;
  font-size:.98rem;
  line-height:1.35
}
.account-main .account-breadcrumb a.crumb,
.account-main .account-breadcrumb span.crumb {
  padding:0!important;
  margin:0!important;
  background:0 0!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  display:inline!important;
  line-height:inherit!important;
  font-weight:500;
  color:var(--acc-accent)
}
.account-main .account-breadcrumb a.crumb {
  cursor:pointer
}
.account-main .account-breadcrumb a.crumb:hover {
  color:#a20707
}
.account-main .account-breadcrumb .crumb[aria-current=page] {
  color:#a20707;
  text-decoration:none;
  cursor:default
}
.account-main .account-breadcrumb .crumb+.crumb::before {
  content:"›";
  color:var(--acc-contrast);
  margin:0 .28rem 0 .1rem;
  font-weight:700
}
.account-main .account-titlebar {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
  border-radius:14px;
  background:rgba(255, 255, 255, .92);
  border:1px solid rgba(0, 0, 0, .08);
  box-shadow:0 2px 10px rgba(30,
  30,
  30, .06)
}
.account-main .account-title {
  margin:0;
  font-size:1.55rem;
  font-weight:950;
  letter-spacing:.01em;
  color:#111
}
.account-main .account-subtitle {
  margin:.35rem 0 0;
  color:var(--acc-ink-soft);
  font-weight:650;
  line-height:1.35;
  max-width:70ch
}
.account-main .account-titlebar__right {
  padding-top:2px
}
.account-main .status-pill {
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.38rem .7rem;
  border-radius:999px;
  font-weight:900;
  border:1px solid rgba(0, 0, 0, .1);
  background:#fff;
  color:#111;
  white-space:nowrap
}
.account-main .status-pill .dot {
  width:9px;
  height:9px;
  border-radius:50%;
  background:#999;
  display:inline-block
}
.account-main .status-label.online .dot,
.account-main .status-pill--online .dot {
  background:#27ae60
}
.account-main .status-label.offline .dot,
.account-main .status-pill--offline .dot {
  background:#c0392b
}
@media (max-width:760px) {
  .account-main .account-titlebar {
    flex-direction:column
  }
  .account-main .account-titlebar__right {
    padding-top:0
  }
}
.account-main .realm-banner {
  width:100%;
  max-width:var(--acc-panel-md);
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:12px
}
.account-main .server-note {
  display:flex;
  align-items:center;
  gap:.6rem;
  margin:0;
  padding:.55rem .8rem;
  background:linear-gradient(90deg, rgba(255, 212, 111, .18) 0, rgba(255, 180, 0, .1) 100%);
  border:1px solid var(--acc-border);
  border-left:4px solid #ffb400;
  border-radius:10px;
  font-weight:500;
  color:#2a2f38
}
.account-main .server-note .dot {
  width:10px;
  height:10px;
  border-radius:50%;
  background:linear-gradient(180deg, #ffd46f 0, #ffb400 100%);
  display:inline-block
}
.account-main .realm-desc {
  margin:0;
  background:#fffef2;
  border:1px dashed #f2de9c;
  color:#4c3d14;
  border-radius:10px;
  padding:12px;
  font-weight:600;
  line-height:1.35
}
.account-main .account-action-panel,
.account-main .account-action-stack,
.account-main .account-chars-box,
.account-main .account-info-box,
.account-main .card,
.account-main .glass-card,
.account-main .panel {
  background:var(--acc-bg);
  border:1.5px solid var(--acc-border);
  border-radius:var(--acc-radius);
  box-shadow:var(--acc-shadow);
  padding:18px;
  color:var(--acc-ink);
  width:100%;
  margin:0
}
.account-main .panel--sm {
  max-width:var(--acc-panel-sm);
  margin-inline:auto
}
.account-main .panel--md {
  max-width:var(--acc-panel-md);
  margin-inline:auto
}
.account-main .panel--lg {
  max-width:var(--acc-panel-lg);
  margin-inline:auto
}
.account-section .account-panel-flex {
  display:grid;
  align-items:start;
  gap:22px;
  grid-template-columns:minmax(620px, 2fr) minmax(340px, 1fr)
}
@media (max-width:1100px) {
  .account-section .account-panel-flex {
    grid-template-columns:minmax(520px,
    1.6fr) minmax(300px, 1fr)
  }
}
.account-main .account-action-col,
.account-main .account-info-col {
  display:flex;
  flex-direction:column;
  gap:16px;
  min-width:0
}
.account-main .info-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:0 0 10px;
  padding-bottom:8px;
  border-bottom:1px solid var(--acc-border)
}
.account-main .info-header h1 {
  margin:0;
  font-size:1.6rem;
  font-weight:900;
  color:var(--acc-accent)
}
.account-main .info-header h2 {
  margin:0;
  font-size:1.25rem;
  font-weight:900;
  color:var(--acc-accent)
}
.account-main .realm-switcher {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.7rem .8rem
}
.account-main .realm-switcher-title {
  margin-right:.25rem;
  font-weight:500;
  font-size:1.05rem;
  color:#0e2a47
}
.account-main .realm-chip {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.62rem 1.08rem;
  border:2px solid rgba(0, 0, 0, .12);
  border-radius:var(--acc-radius-pill);
  font-weight:500;
  font-size:1.02rem;
  text-decoration:none;
  background:#fff;
  color:#111;
  box-shadow:0 2px 6px rgba(0, 0, 0, .06);
  transition:transform .12s,
  box-shadow .12s,
  border-color .12s,
  background .12s;
  outline:0
}
.account-main .realm-chip:hover {
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(0, 0, 0, .1);
  border-color:rgba(0, 0, 0, .22)
}
.account-main .realm-chip.active {
  background:linear-gradient(180deg,
  var(--acc-gold, #f5c950) 0, #ffb400 100%);
  color:#111;
  border-color:transparent;
  box-shadow:0 10px 24px rgba(255,
  180, 0, .28);
  transform:translateY(-1px) scale(1.03)
}
@media (max-width:600px) {
  .account-main .realm-chip {
    font-size:1rem;
    padding:.56rem 1rem
  }
}
.account-main .account-points-modern {
  display:flex;
  gap:1.1em;
  align-items:stretch;
  margin:0
}
.account-main .points-card {
  flex:1 1 0%;
  display:flex;
  align-items:flex-start;
  gap:.9em;
  min-width:0;
  border-radius:1.05em;
  padding:.9em 1em;
  border:1.7px solid #ffeaa0;
  background:rgb(255 248 221 / .97);
  box-shadow:0 4px 16px #f5c9501b
}
.account-main .points-card.wcoin {
  border-color:#a2cdf9;
  background:#e9f4ff
}
.account-main .points-card.webgp {
  border-color:#d1ddff;
  background:#f3f6ff
}
.account-main .point-icon {
  width:30px;
  height:30px;
  flex-shrink:0
}
.account-main .point-body {
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  padding-top:1px
}
.account-main .point-label {
  color:#977e10;
  font-weight:700;
  line-height:1.15
}
.account-main .points-card.wcoin .point-label {
  color:#2184d8
}
.account-main .points-card.webgp .point-label,
.account-main .points-card.webgp .point-value {
  color:#243557
}
.account-main .point-value {
  font-size:1.2em;
  font-weight:900;
  color:#ae880c;
  line-height:1.1
}
.account-main .points-card.wcoin .point-value {
  color:#2470a6
}
.account-main .point-link {
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  width:max-content;
  margin-top:.45rem;
  padding:.35rem .65rem;
  border-radius:999px;
  border:1px solid rgba(36, 53, 87, .22);
  background:#fff;
  color:#243557;
  text-decoration:none;
  font-weight:850;
  font-size:.93rem;
  box-shadow:0 2px 10px rgba(0, 0, 0, .06);
  transition:transform .12s,
  box-shadow .12s,
  border-color .12s,
  color .12s
}
.account-main .point-link:hover {
  transform:translateY(-1px);
  border-color:rgba(162, 7, 7, .25);
  color:#a20707;
  box-shadow:0 10px 18px rgba(0, 0, 0, .1)
}
.account-main .account-info-box ul {
  padding:0;
  margin:0;
  list-style:none
}
.account-main .account-info-box ul li {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:.46em 0;
  border-bottom:1px solid #f0ecd9;
  font-size:1.05em
}
.account-main .account-char-table tr:last-child td,
.account-main .account-info-box ul li:last-child,
.account-main .buygp-table tr:last-child td,
.account-main .sub-table tr:last-child td,
.account-main[data-page=grand-reset] .account-info-list li:last-child,
.account-main[data-page=grand-reset] table.gr-table tbody tr:last-child td {
  border-bottom:none
}
.account-main .account-info-box ul li span:first-child {
  min-width:112px;
  color:#715c32;
  font-weight:600;
  margin-right:.7em;
  flex-shrink:0
}
.account-main .account-info-box ul li .value {
  text-align:right;
  overflow-wrap:anywhere;
  word-break:break-word;
  max-width:70%
}
.account-main .account-info-box .change-pass-btn--inline {
  font-size:1.01rem;
  padding:.44rem 1.2rem;
  border-radius:1.4rem;
  background:linear-gradient(90deg, #fffbe8 0, #ffe073 100%);
  color:#a07a00;
  border:1.2px solid #ffe58b;
  box-shadow:0 2px 10px #ffe0731a
}
.account-main .account-info-box .change-pass-btn--inline:hover {
  filter:brightness(.98);
  transform:translateY(-1px)
}
.account-main .account-action-panel {
  text-align:center;
  padding-top:16px
}
.account-main .account-action-panel h2 {
  margin:.35rem 0 .55rem;
  font-size:1.08rem;
  color:#2b3442
}
.account-main .account-action-list {
  list-style:none;
  padding:0;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:.55rem;
  width:100%;
  max-width:var(--acc-btn-width)
}
.account-main .action-btn,
.account-main .buy-gp-btn {
  gap:.6em;
  max-width:var(--acc-btn-width);
  min-height:var(--acc-btn-height);
  font-weight:500;
  display:inline-flex;
  width:100%;
  text-decoration:none
}
.account-main .account-action-list li {
  width:100%;
  display:flex;
  justify-content:center
}
.account-main .buy-gp-btn {
  --btn-red-1:var(--brand-1);
  --btn-red-2:var(--brand-2);
  --btn-dark-1:#5a5a5a;
  --btn-dark-2:#232323;
  cursor:pointer;
  align-items:center;
  justify-content:center;
  font-size:1.06em;
  color:#fff!important;
  background:linear-gradient(90deg, var(--btn-red-1) 0, var(--btn-red-2) 100%);
  box-shadow:0 10px 28px rgba(162,
  7,
  7,
  .26),
  inset 0 1px 0 rgba(255,
  255, 255, .08);
  border:1.6px solid rgba(255,
  255,
  255, .09);
  border-radius:14px;
  padding:.62em 1.2em;
  margin:0;
  box-shadow:0 3px 18px 0 rgb(40 40 40 / .18),
  0 2px 6px rgb(162 7 7 / .09)
}
.account-main .buy-gp-btn:focus,
.account-main .buy-gp-btn:hover {
  background:linear-gradient(90deg, #a20707 0, #c02c2c 100%);
  transform:translateY(-1px);
  outline:rgba(245,
  201,
  80,
  .25) solid 3px;
  outline-offset:2px
}
.account-main .action-btn {
  align-items:center;
  justify-content:center;
  font-size:1.02em;
  color:var(--acc-ink);
  background:linear-gradient(90deg, #f6f7f9 0, #ebedef 100%);
  border:1.3px solid var(--acc-border);
  border-radius:12px;
  padding:.62em 1.05em;
  box-shadow:0 2px 8px rgb(40 40 40 / .05)
}
.account-main .action-btn:hover {
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgb(40 40 40 / .09);
  border-color:var(--acc-contrast);
  color:#a20707
}
.account-main .action-btn:focus {
  outline:rgba(245,
  201,
  80, .28) solid 3px;
  outline-offset:2px
}
.account-main .action-btn i {
  opacity:.95;
  transform:translateY(.5px)
}
.account-main .title-banner {
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  font-size:1.14rem;
  font-weight:900;
  color:#2a2f38;
  margin:0;
  background:linear-gradient(90deg, #fff9e4 0, #fff3c2 100%);
  border:1px solid #ffe18a;
  border-left:4px solid var(--acc-gold);
  padding:.55rem .9rem;
  border-radius:12px;
  box-shadow:0 2px 8px rgb(245 201 80 / .15)
}
.account-main .buygp-payments-list {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.6rem
}
.account-main .buygp-paybtn {
  display:flex;
  align-items:center;
  gap:.65rem;
  background:var(--acc-bg-weak);
  border:1.6px solid var(--acc-border);
  border-radius:12px;
  padding:.78rem 1rem;
  font-weight:500;
  color:#2f2f2f;
  text-decoration:none
}
.account-main .buygp-paybtn img {
  height:22px;
  width:auto;
  background:#fff;
  border-radius:6px;
  box-shadow:0 1px 6px rgba(0, 0, 0, .06);
  padding:2px
}
.account-main .buygp-paybtn:hover {
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(0, 0, 0, .07);
  border-color:#c9ccd3;
  background:#fff
}
.account-main .char-table-wrap {
  overflow:auto;
  border-radius:var(--acc-radius-sm);
  margin:0;
  -webkit-overflow-scrolling:touch
}
.account-main .account-char-table,
.account-main .buygp-table,
.account-main .sub-table {
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
  border:1.3px solid var(--acc-border);
  border-radius:12px;
  box-shadow:0 2px 8px rgb(30 30 30 / .06);
  overflow:hidden;
  table-layout:fixed
}
.account-main .account-char-table th,
.account-main .buygp-table thead th,
.account-main .sub-table th {
  background:#b5b5b5;
  color:#fff;
  font-weight:700;
  padding:.66rem .9rem;
  border-bottom:1px solid var(--acc-border);
  text-align:left;
  letter-spacing:.01em;
  white-space:nowrap
}
.account-main .account-char-table td,
.account-main .buygp-table td,
.account-main .sub-table td {
  background:#f7f7f7;
  color:var(--acc-ink);
  padding:.58rem .85rem;
  border-bottom:1px solid var(--acc-border);
  vertical-align:top;
  word-break:break-word;
  overflow-wrap:anywhere;
  text-align:left
}
.account-main .account-char-table tr:nth-child(2n) td,
.account-main .sub-table tr:nth-child(2n) td,
.account-main[data-page=grand-reset] table.gr-table tbody tr:nth-child(2n) td {
  background:#ededed
}
.account-main .sub-table td:nth-child(2),
.account-main .sub-table td:nth-child(3),
.account-main .sub-table td:nth-child(4),
.account-main .sub-table td:nth-child(5) {
  text-align:right
}
.account-main .sub-table td:nth-child(10),
.account-main .sub-table td:nth-child(9) {
  font-size:.93em;
  word-break:break-all;
  overflow-wrap:anywhere
}
.account-main .subtable-filters {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  margin:0
}
.account-main .subtable-filters select {
  appearance:none;
  background:#fff;
  border:1px solid var(--acc-border);
  border-radius:10px;
  padding:.45rem .8rem .45rem .7rem;
  box-shadow:0 1px 2px rgba(0, 0, 0, .03)
}
.account-main .subtable-filters input[type=checkbox] {
  width:16px;
  height:16px
}
.account-main .pagination-wrap {
  display:flex;
  gap:.4rem;
  justify-content:center;
  margin-top:10px
}
.account-main .pagination-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.45rem .85rem;
  border:1px solid var(--acc-border);
  border-radius:9px;
  background:#fff;
  color:#333;
  text-decoration:none
}
.account-main .pagination-btn:hover {
  box-shadow:0 4px 12px rgba(0, 0, 0, .07);
  transform:translateY(-1px)
}
.account-main .pagination-btn.active {
  background:#ffeaa6;
  border-color:#f2d377;
  font-weight:900
}
.account-main .back-row {
  text-align:center;
  margin:0
}
.account-main .back-btn {
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.6rem 1.1rem;
  border:2px solid #cfcfd6;
  border-radius:var(--acc-radius-pill);
  background:#fff;
  color:#2f2f2f;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 3px 10px rgba(0, 0, 0, .05)
}
.account-main .back-btn:hover {
  transform:translateY(-1px);
  border-color:#b9bdc3;
  box-shadow:0 10px 20px rgba(0, 0, 0, .07);
  color:#a20707
}
.account-main .status-label {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-weight:500;
  padding:.18rem .5rem;
  border-radius:10px;
  background:#eef0f2;
  color:#333;
  border:1px solid #e0e3e7
}
.account-main .status-label .dot {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#999;
  display:inline-block
}
.account-main .form-alert.success,
.account-main .status-label.success,
.account-main[data-page=grand-reset] .gr-status--ok {
  background:#e9f6ee;
  border-color:#cfe9d9;
  color:#287a3c
}
.account-main .status-label.info {
  background:#eaf3ff;
  border-color:#cfe0f4;
  color:#215c9d
}
.account-main .form-alert.error,
.account-main .status-label.danger {
  background:#fff1f1;
  border-color:#f2d4d4;
  color:#9f2e2e
}
.account-main .vip-badge {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.18rem .5rem;
  border-radius:10px;
  background:#fff8e1;
  border:1px solid #ffe39a;
  color:#8b6a00;
  font-weight:900
}
.account-main .vip-badge.vip-none {
  background:#f7f8fa;
  color:#7b7e82;
  border-color:#e3e5e8
}
.account-main .form-kv {
  display:grid;
  grid-template-columns:180px minmax(0, 1fr);
  align-items:center;
  gap:6px 14px;
  margin:0
}
.account-main .change-pass-form label,
.account-main .form-kv .kv-label {
  font-weight:700;
  color:var(--acc-accent);
  text-align:right
}
.account-main .change-pass-form .input-row {
  display:grid;
  grid-template-columns:180px minmax(0, 1fr);
  align-items:center;
  gap:8px 14px;
  margin:0
}
.account-main .change-pass-form input[type=email],
.account-main .change-pass-form input[type=number],
.account-main .change-pass-form input[type=password],
.account-main .change-pass-form input[type=text] {
  width:100%;
  height:44px;
  padding:.55rem .8rem;
  border:1.4px solid var(--acc-border);
  border-radius:10px;
  background:#fff;
  box-shadow:inset 0 1px 2px rgba(0,
  0, 0, .04);
  transition:border-color .16s,
  box-shadow .16s,
  background-color .16s
}
.account-main .change-pass-form input:focus {
  border-color:#a20707;
  box-shadow:0 0 0 3px rgba(162, 7, 7, .1),
  inset 0 1px 2px rgba(0, 0, 0, .04);
  outline:0
}
.account-main .change-pass-form .action-btn {
  justify-self:start;
  max-width:240px;
  margin-top:.25rem
}
.account-main .flash,
.account-main[data-page=buy-gp] .title-banner {
  margin:0
}
.account-main .flash-error,
.account-main .flash-success {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.4rem .7rem;
  border-radius:10px;
  font-size:.9rem
}
.account-main .flash-success {
  border:1px solid #cfe9d9;
  background:#e9f6ee;
  color:#287a3c;
  font-weight:600
}
.account-main .flash-error {
  border:1px solid #f2d4d4;
  background:#fff1f1;
  color:#9f2e2e;
  font-weight:600
}
.account-main .flash i {
  opacity:.9
}
.account-main .form-alert {
  margin:0;
  padding:.7rem .9rem;
  border-radius:12px;
  border:1px solid rgba(0, 0, 0, .1);
  background:#f7f8fa;
  font-weight:650;
  line-height:1.35;
  display:flex;
  align-items:flex-start;
  gap:.55rem
}
.account-main .form-alert i {
  margin-top:.1rem;
  opacity:.9
}
.account-main .form-alert.warning {
  background:#fff8e1;
  border-color:#ffe39a;
  color:#6b5300
}
dialog.modal {
  width:min(520px, calc(100% - 2rem));
  max-height:calc(100dvh - 2rem);
  overflow:auto;
  inset:0;
  margin:auto;
  border:0;
  border-radius:12px;
  padding:1rem 1.25rem;
  box-shadow:0 10px 40px rgba(0, 0, 0, .3)
}
dialog.modal::backdrop {
  background:rgba(0, 0, 0, .6);
  backdrop-filter:blur(2px)
}
.modal-head {
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-bottom:.25rem
}
.account-section.exg-wrap .activity-body h3,
.modal-head h2 {
  margin:0;
  font-size:1.1rem
}
.modal-body {
  margin:.5rem 0 1rem
}
.modal-body .note {
  margin-top:.5rem;
  opacity:.8;
  font-size:.9rem
}
.modal-actions {
  display:flex;
  justify-content:flex-end;
  gap:.5rem
}
.modal-actions .btn {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.55rem .9rem;
  border-radius:8px;
  border:1px solid transparent;
  cursor:pointer;
  font:inherit
}
.modal-actions .btn-secondary {
  border-color:rgba(0, 0, 0, .15);
  background:#fff
}
.modal-actions .btn-primary {
  background:#0d6efd;
  color:#fff
}
@media (prefers-reduced-motion:no-preference) {
  dialog.modal[open] {
    animation:.14s ease-out modalIn
  }
  @keyframes modalIn {
    from {
      opacity:0
    }
    to {
      opacity:1
    }
  }
  .account-main[data-page=grand-reset] .gr-modal__dialog {
    animation:.14s ease-out grModalIn
  }
  @keyframes grModalIn {
    from {
      transform:translateY(6px);
      opacity:.96
    }
    to {
      transform:translateY(0);
      opacity:1
    }
  }
}
body.modal-open {
  overflow:hidden
}
@supports not (inset:0) {
  dialog.modal {
    top:50%;
    left:50%;
    margin:0;
    transform:translate(-50%,
    -50%)
  }
  @media (prefers-reduced-motion:no-preference) {
    dialog.modal[open] {
      animation:none
    }
  }
}
.account-section.realm-skin {
  --realm-accent:#f5c950;
  --realm-accent-soft:rgba(245, 201, 80, .08);
  --realm-accent-strong:#b28416
}
.account-section.realm-skin.realm-skin-muonline-ai {
  --realm-accent:#f5c950;
  --realm-accent-soft:rgba(245, 201, 80, .12);
  --realm-accent-strong:#b28416
}
.account-section.realm-skin.realm-skin-silvermu {
  --realm-accent:#9ea8c4;
  --realm-accent-soft:rgba(158, 168, 196, .18);
  --realm-accent-strong:#5c6784
}
.account-section.realm-skin.realm-skin-voltmu {
  --realm-accent:#46c97a;
  --realm-accent-soft:rgba(70, 201, 122, .18);
  --realm-accent-strong:#22804a
}
.account-section.realm-skin.realm-skin-furymu {
  --realm-accent:#f27a4b;
  --realm-accent-soft:rgba(242, 122, 75, .20);
  --realm-accent-strong:#b6431c
}
.account-section.realm-skin.realm-skin-richmu {
  --realm-accent:#a472f2;
  --realm-accent-soft:rgba(164, 114, 242, .20);
  --realm-accent-strong:#6b3bc0
}
.account-section.realm-skin .payments-card {
  position:relative;
  padding:18px 18px 22px;
  margin:0;
  border-radius:var(--acc-radius, 13px);
  border:1.5px solid var(--acc-border, #d3d4d6);
  box-shadow:var(--acc-shadow,
  0 6px 24px rgba(50, 50, 50, .08));
  background:radial-gradient(circle at top left,
  var(--realm-accent-soft) 0,
  transparent 55%),
  linear-gradient(180deg,
  #fffdf8 0,
  #fff 100%)
}
.account-section.realm-skin .server-note {
  border-left-color:var(--realm-accent);
  background:linear-gradient(90deg, var(--realm-accent-soft) 0, rgba(255, 255, 255, .85) 100%)
}
.account-section.realm-skin .realm-chip.active {
  background:linear-gradient(180deg, var(--realm-accent) 0, color-mix(in srgb, var(--realm-accent) 70%, #fff 30%) 100%)
}
.account-section.realm-skin .buygp-confirm-hint {
  margin:0;
  border-color:color-mix(in srgb, var(--realm-accent) 40%, #fff 60%);
  background:linear-gradient(135deg,
  #f5f7ff 0,
  #edf4ff 50%,
  color-mix(in srgb, var(--realm-accent-soft) 80%, #fff 20%) 100%)
}
.account-section.realm-skin .buygp-confirm-hint__icon {
  background:var(--realm-accent-strong)
}
.account-main .xp-chip {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.32rem .7rem;
  border-radius:999px;
  background:#f3f6ff;
  border:1px solid #d1ddff;
  font-size:.86rem;
  color:#243557;
  font-weight:600
}
.account-main .gp-balance-card .gp-balance-value,
.account-main .xp-chip .strong {
  font-weight:500
}
.account-section.realm-skin .buygp-payments-list {
  margin-top:4px;
  display:grid;
  gap:.7rem
}
.account-section.realm-skin .buygp-paybtn {
  position:relative;
  display:flex;
  align-items:center;
  gap:.65rem;
  padding:.82rem 1.05rem;
  border-radius:12px;
  border:1.5px solid color-mix(in srgb, var(--realm-accent) 35%, #d3d4d6 65%);
  background:linear-gradient(90deg,
  #fff 0,
  #fff 40%,
  var(--realm-accent-soft) 100%);
  font-weight:500;
  color:#252525;
  text-decoration:none;
  box-shadow:0 3px 10px rgba(0, 0, 0, .06);
  transition:transform .12s,
  box-shadow .12s,
  border-color .12s,
  background .12s,
  color .12s
}
.account-section.realm-skin .buygp-paybtn::after {
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  opacity:0;
  background:radial-gradient(circle at top right, rgba(255, 255, 255, .9) 0, transparent 50%);
  transition:opacity .18s;
  pointer-events:none
}
.account-section.realm-skin .buygp-paybtn:focus-visible,
.account-section.realm-skin .buygp-paybtn:hover {
  transform:translateY(-1px);
  border-color:var(--realm-accent-strong);
  box-shadow:0 8px 18px rgba(0, 0,
  0, .1);
  background:linear-gradient(90deg,
  var(--realm-accent-soft) 0, #fff 40%,
  var(--realm-accent-soft) 100%);
  outline:0
}
.account-section.realm-skin .buygp-paybtn:focus-visible::after,
.account-section.realm-skin .buygp-paybtn:hover::after {
  opacity:1
}
.account-main[data-page=buy-gp] .buygp-paybtn {
  --pay-accent:#a20707;
  --pay-accent-2:#a20707;
  --pay-soft:rgba(162, 7, 7, .10);
  --pay-focus:rgba(162, 7, 7, .22)
}
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paypal {
  --pay-accent:#0070BA;
  --pay-accent-2:#003087;
  --pay-soft:rgba(0, 112, 186, .10);
  --pay-focus:rgba(0, 112, 186, .22)
}
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-stripe {
  --pay-accent:#635BFF;
  --pay-accent-2:#4B3BFF;
  --pay-soft:rgba(99, 91, 255, .10);
  --pay-focus:rgba(99, 91, 255, .22)
}
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-coinbase {
  --pay-accent:#0052FF;
  --pay-accent-2:#0039B3;
  --pay-soft:rgba(0, 82, 255, .10);
  --pay-focus:rgba(0, 82, 255, .22)
}
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paymentwall {
  --pay-accent:#F5A623;
  --pay-accent-2:#C97B00;
  --pay-soft:rgba(245, 166, 35, .12);
  --pay-focus:rgba(245, 166, 35, .22)
}
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-coinbase,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paymentwall,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paypal,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-stripe {
  background:linear-gradient(90deg, #fff 0, #fff 55%, var(--pay-soft) 100%);
  border-color:color-mix(in srgb,
  var(--pay-accent) 26%,
  var(--acc-border, #d3d4d6) 74%);
  box-shadow:0 3px 10px rgba(0,
  0,
  0,
  .06),
  inset 4px 0 0 var(--pay-accent)
}
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-coinbase:hover,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paymentwall:hover,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paypal:hover,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-stripe:hover {
  border-color:var(--pay-accent);
  background:linear-gradient(90deg, var(--pay-soft) 0, #fff 40%, var(--pay-soft) 100%);
  box-shadow:0 10px 18px rgba(0,
  0,
  0,
  .1),
  inset 4px 0 0 var(--pay-accent)
}
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-coinbase:focus-visible,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paymentwall:focus-visible,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paypal:focus-visible,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-stripe:focus-visible {
  outline:3px solid var(--pay-focus);
  outline-offset:2px
}
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-coinbase img,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paymentwall img,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-paypal img,
.account-main[data-page=buy-gp] .buygp-paybtn.buygp-stripe img {
  border:1px solid color-mix(in srgb, var(--pay-accent) 22%, rgba(0, 0, 0, .08) 78%);
  background:#fff
}
@supports not (color-mix(in srgb, #000 50%,
#fff 50%)) {
  .account-section.realm-skin .buygp-paybtn {
    border-color:#d3d4d6;
    background:#fff
  }
  .account-main[data-page=buy-gp] .buygp-paybtn.buygp-coinbase,
  .account-main[data-page=buy-gp] .buygp-paybtn.buygp-paymentwall,
  .account-main[data-page=buy-gp] .buygp-paybtn.buygp-paypal,
  .account-main[data-page=buy-gp] .buygp-paybtn.buygp-stripe {
    border-color:var(--acc-border, #d3d4d6)
  }
  .account-main[data-page=buy-gp] .buygp-paybtn.buygp-coinbase img,
  .account-main[data-page=buy-gp] .buygp-paybtn.buygp-paymentwall img,
  .account-main[data-page=buy-gp] .buygp-paybtn.buygp-paypal img,
  .account-main[data-page=buy-gp] .buygp-paybtn.buygp-stripe img {
    border-color:rgba(0, 0, 0, .1)
  }
}
.account-section.realm-skin .bonus-box {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem;
  margin:0;
  padding:.7rem .9rem;
  border-radius:11px;
  border:1px solid color-mix(in srgb, var(--realm-accent) 60%, #fff 40%);
  background:linear-gradient(90deg, #fffbe7 0,
  color-mix(in srgb, var(--realm-accent-soft) 90%, #fff 10%) 100%);
  box-shadow:0 2px 10px rgba(0,
  0,
  0,
  .08);
  font-size:.96rem
}
.account-section.realm-skin .bonus-box .bonus-amount {
  font-size:1.35rem;
  font-weight:900;
  color:var(--realm-accent-strong);
  margin-left:.25rem
}
.account-section.realm-skin .bonus-box .strong-sub {
  font-size:.9rem;
  font-weight:700;
  color:#5a4b24
}
.account-section.realm-skin .vipbox {
  border-radius:11px;
  border:1px solid #d5ddf2;
  background:linear-gradient(135deg, #f3f6ff 0, #eef3ff 100%);
  padding:.85rem .9rem .8rem;
  font-size:.94rem
}
.account-section.realm-skin .vipbox .viprow {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.5rem .9rem;
  margin-bottom:.65rem
}
.account-section.realm-skin .vipbox .viprow span {
  color:#5b6478
}
.account-section.realm-skin .vipbox .viprow strong {
  font-weight:500;
  color:#28395c
}
.account-section.realm-skin .vipbox .progress {
  position:relative;
  width:100%;
  height:9px;
  border-radius:999px;
  background:#e3e5ee;
  overflow:hidden;
  margin:.2rem 0 .55rem
}
.account-section.realm-skin .vipbox .progress::before {
  content:"";
  position:absolute;
  inset:0;
  width:calc(var(--progress, 0) * 1%);
  max-width:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,
  var(--realm-accent) 0, #a20707 100%);
  box-shadow:0 0 0 1px rgba(255, 255,
  255,
  .35),
  0 4px 10px rgba(162,
  7,
  7, .35);
  transition:width .24s ease-out
}
.account-section.realm-skin .vipbox .progress strong {
  position:absolute;
  right:0;
  top:-1.45rem;
  font-size:.8rem;
  color:#1f6fd1;
  font-weight:500
}
.account-section.realm-skin .vipbox .max-info,
.account-section.realm-skin .vipbox .next-info {
  font-size:.88rem;
  color:#4b5675
}
.account-section.realm-skin .vipbox .max-info {
  color:#287a3c;
  font-weight:700
}
.account-main .buygp-table tr.active td {
  background:#fff7dd;
  font-weight:700;
  color:#513c10
}
#gateway-confirm {
  --realm-accent:#f5c950;
  --realm-accent-soft:rgba(245, 201, 80, .16);
  --realm-accent-strong:#a20707
}
#gateway-confirm .modal-head {
  padding-bottom:.3rem;
  border-bottom:1px solid rgba(0, 0, 0, .06);
  margin-bottom:.3rem
}
#gateway-confirm .modal-realm-chip {
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  margin:.35rem 0 .75rem;
  padding:.32rem .7rem;
  border-radius:999px;
  background:var(--realm-accent-soft);
  border:1px solid rgba(0, 0, 0, .04)
}
#gateway-confirm .modal-realm-chip .chip-label {
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#6d7280;
  font-weight:700
}
#gateway-confirm .modal-realm-chip .chip-value {
  font-size:.9rem;
  font-weight:500;
  color:var(--realm-accent-strong)
}
#gateway-confirm .modal-emph--realm {
  color:var(--realm-accent-strong);
  font-weight:700
}
#gateway-confirm .modal-emph--gateway {
  font-weight:700
}
.account-main .gp-exchange-wrap {
  max-width:var(--acc-panel-md);
  margin:0 auto
}
.account-main .gp-exchange-grid {
  display:grid;
  grid-template-columns:minmax(0, 1.35fr) minmax(0, 1fr);
  gap:18px;
  align-items:flex-start;
  margin-top:0
}
@media (max-width:900px) {
  .account-main .gp-exchange-grid {
    grid-template-columns:1fr
  }
}
.account-main .gp-balance-card {
  background:#fff;
  border:1.4px solid var(--acc-border);
  border-radius:12px;
  padding:12px 14px;
  box-shadow:0 2px 8px rgba(0,
  0,
  0, .05)
}
.account-main .gp-balance-card h3 {
  margin:0 0 6px;
  font-size:1.05rem;
  font-weight:500;
  color:var(--acc-accent)
}
.account-main .gp-balance-card .gp-balance-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:4px 0;
  font-size:.97rem
}
.account-main .gp-balance-card .gp-balance-label {
  color:var(--acc-ink-soft)
}
.account-main .gp-exchange-form-block {
  background:#fff;
  border:1.4px solid var(--acc-border);
  border-radius:12px;
  padding:14px 16px 16px;
  box-shadow:0 2px 8px rgba(0,
  0, 0, .05)
}
.account-main .acc-card,
.account-section.exg-wrap .exg-card {
  box-shadow:0 6px 24px rgba(50, 50, 50, .08),
  0 1.5px 8px rgba(30, 30, 30, .07)
}
.account-main .gp-exchange-form-block .field-row {
  margin-bottom:10px;
  display:flex;
  flex-direction:column;
  gap:4px
}
.account-main .gp-exchange-form-block label {
  font-weight:700;
  color:var(--acc-accent)
}
.account-main .gp-exchange-form-block input[type=number] {
  height:44px;
  border-radius:10px;
  border:1.4px solid var(--acc-border);
  padding:.5rem .7rem;
  background:#fff;
  box-shadow:inset 0 1px 2px rgba(0,
  0, 0, .03)
}
.account-main .gp-exchange-form-block input[type=number]:focus {
  border-color:#a20707;
  outline:0;
  box-shadow:0 0 0 3px rgba(162, 7, 7, .12)
}
.account-main .gp-exchange-form-block .hint {
  font-size:.86rem;
  color:var(--acc-ink-soft)
}
.account-main .gp-exchange-form-block .submit-row {
  margin-top:6px
}
.account-main .gp-exchange-form-block .submit-row .action-btn {
  width:100%;
  max-width:100%;
  justify-content:center
}
.account-section.exg-wrap .muted {
  opacity:.85
}
.account-section.exg-wrap .exg-grid {
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:start
}
@media (max-width:920px) {
  .account-section.exg-wrap .exg-grid {
    grid-template-columns:1fr
  }
}
.account-section.exg-wrap .exg-card {
  background:#fff;
  border:1.5px solid var(--acc-border);
  border-radius:13px;
  padding:16px
}
.account-section.exg-wrap .activity-block {
  display:flex;
  gap:12px;
  align-items:flex-start
}
.account-section.exg-wrap .activity-icon {
  width:44px;
  height:44px;
  border-radius:12px;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, #fff3c2 0, #ffd46f 100%);
  border:1px solid rgba(0, 0, 0, .06)
}
.account-section.exg-wrap .choice-row {
  display:flex;
  gap:10px;
  flex-wrap:wrap
}
.account-section.exg-wrap .pill-choice {
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(0, 0, 0, .12);
  padding:.55rem .75rem;
  border-radius:999px;
  cursor:pointer;
  user-select:none;
  background:#fff;
  font-weight:500;
  transition:transform .12s,
  box-shadow .12s,
  border-color .12s
}
.account-section.exg-wrap .pill-choice input {
  accent-color:#a20707
}
.account-section.exg-wrap .pill-choice:hover {
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(0, 0, 0, .08);
  border-color:rgba(0, 0, 0, .2)
}
.account-section.exg-wrap .pill-choice.active {
  border-color:#a20707;
  box-shadow:0 10px 20px rgba(162, 7, 7, .12);
  background:linear-gradient(180deg, #fff 0, #fff3f3 120%)
}
.account-section.exg-wrap .exg-row {
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between
}
.account-section.exg-wrap .exg-row strong {
  font-weight:900
}
.account-section.exg-wrap .exg-input {
  width:100%;
  height:44px;
  padding:.55rem .8rem;
  border:1.4px solid var(--acc-border);
  border-radius:10px;
  background:#fff
}
.account-section.exg-wrap .exg-input:focus {
  outline:0;
  border-color:#a20707;
  box-shadow:0 0 0 3px rgba(162, 7, 7, .12)
}
.account-section.exg-wrap .exg-btn {
  display:inline-flex;
  width:100%;
  justify-content:center;
  align-items:center;
  gap:.55rem;
  padding:.7rem 1rem;
  border-radius:14px;
  border:1px solid rgba(0, 0, 0, .1);
  background:linear-gradient(90deg, #232323 0, #393939 100%);
  color:#fff;
  font-weight:900;
  cursor:pointer;
  text-decoration:none;
  box-shadow:0 3px 18px 0 rgba(40, 40, 40, .18);
  transition:transform .12s,
  box-shadow .12s,
  background .12s
}
.account-section.exg-wrap .exg-btn:hover {
  transform:translateY(-1px);
  box-shadow:0 12px 26px rgba(0, 0, 0, .14);
  background:linear-gradient(90deg, #a20707 0, #c02c2c 100%)
}
.account-section.exg-wrap .exg-toast {
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  background:#111;
  color:#fff;
  padding:.75rem 1rem;
  border-radius:999px;
  box-shadow:0 14px 34px rgba(0, 0, 0, .35);
  z-index:9999;
  font-weight:500
}
.account-main[data-page=change-password] .hp-field {
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden
}
.account-main[data-page=change-password] .pw-tools {
  display:flex;
  gap:.6rem;
  align-items:center;
  margin-top:.35rem
}
.account-main[data-page=change-password] .pw-toggle {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.35rem .65rem;
  border-radius:999px;
  border:1px solid rgba(0, 0, 0, .12);
  background:#fff;
  cursor:pointer;
  font-weight:500;
  font-size:.92rem
}
.account-main[data-page=change-password] .pw-toggle:hover {
  transform:translateY(-1px);
  box-shadow:0 8px 16px rgba(0, 0, 0, .08)
}
.account-main[data-page=change-password] .pw-hint {
  font-size:.9rem;
  color:var(--acc-ink-soft);
  font-weight:600
}
.account-main[data-page=grand-reset] {
  --gr-accent:var(--acc-gold, #f5c950);
  --gr-accent-soft:rgba(245, 201, 80, .14);
  --gr-accent-strong:#a20707
}
.account-main[data-page=grand-reset] .account-section[data-realm=muonline-ai] {
  --gr-accent:#f5c950;
  --gr-accent-soft:rgba(245, 201, 80, .14);
  --gr-accent-strong:#b28416
}
.account-main[data-page=grand-reset] .account-section[data-realm=silvermu] {
  --gr-accent:#9ea8c4;
  --gr-accent-soft:rgba(158, 168, 196, .18);
  --gr-accent-strong:#5c6784
}
.account-main[data-page=grand-reset] .account-section[data-realm=voltmu] {
  --gr-accent:#46c97a;
  --gr-accent-soft:rgba(70, 201, 122, .18);
  --gr-accent-strong:#22804a
}
.account-main[data-page=grand-reset] .account-section[data-realm=furymu] {
  --gr-accent:#f27a4b;
  --gr-accent-soft:rgba(242, 122, 75, .20);
  --gr-accent-strong:#b6431c
}
.account-main[data-page=grand-reset] .account-section[data-realm=richmu] {
  --gr-accent:#a472f2;
  --gr-accent-soft:rgba(164, 114, 242, .20);
  --gr-accent-strong:#6b3bc0
}
.account-main .muted {
  color:var(--acc-ink-soft, #57595b)
}
.account-main .acc-card {
  background:#fff;
  border:1.5px solid var(--acc-border, #d3d4d6);
  border-radius:var(--acc-radius, 13px);
  padding:18px;
  color:var(--acc-ink,
  #26292c)
}
.account-main[data-page=grand-reset] .account-layout.gr-layout {
  display:grid;
  grid-template-columns:minmax(0, 1.55fr) minmax(0, .9fr);
  gap:18px;
  align-items:start
}
@media (max-width:980px) {
  .account-main[data-page=grand-reset] .account-layout.gr-layout,
  .account-section .account-panel-flex {
    grid-template-columns:1fr
  }
}
.account-main[data-page=grand-reset] .gr-aside {
  position:relative
}
.account-main[data-page=grand-reset] .gr-hero {
  background:radial-gradient(circle at top left, var(--gr-accent-soft) 0, transparent 60%),
  linear-gradient(180deg,
  #fff 0,
  #fff 100%)
}
.account-main[data-page=grand-reset] .gr-hero__top {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:8px
}
.account-main[data-page=grand-reset] .gr-title {
  margin:0;
  font-size:1.65rem;
  font-weight:950;
  letter-spacing:.01em;
  color:var(--acc-accent, #383838)
}
.account-main[data-page=grand-reset] .gr-subtitle {
  margin:.35rem 0 0;
  color:var(--acc-ink-soft, #57595b);
  line-height:1.35;
  font-weight:600;
  max-width:62ch
}
.account-main[data-page=grand-reset] .gr-cta {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  padding:.72rem 1rem;
  border-radius:14px;
  text-decoration:none;
  font-weight:900;
  color:#1b1b1b;
  border:1px solid rgba(0, 0, 0, .08);
  background:linear-gradient(180deg, #fff 0, #fff 40%, var(--gr-accent-soft) 130%);
  box-shadow:0 3px 12px rgba(0,
  0,
  0,
  .08);
  transition:transform .12s,
  box-shadow .12s,
  border-color .12s;
  white-space:nowrap
}
.account-main[data-page=grand-reset] .gr-cta:focus-visible,
.account-main[data-page=grand-reset] .gr-cta:hover {
  transform:translateY(-1px);
  border-color:rgba(0, 0, 0, .16);
  box-shadow:0 10px 22px rgba(0, 0, 0, .12);
  outline:0
}
.account-main[data-page=grand-reset] .gr-kpis {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
  margin-top:12px
}
@media (max-width:880px) {
  .account-main[data-page=grand-reset] .gr-kpis {
    grid-template-columns:1fr
  }
}
.account-main[data-page=grand-reset] .gr-kpi {
  border:1px solid rgba(0, 0, 0, .1);
  border-radius:14px;
  padding:12px 12px 10px;
  background:radial-gradient(circle at top right, rgba(255, 255, 255, .85) 0, transparent 55%),
  linear-gradient(180deg,
  #fafbff 0,
  #fff 100%)
}
.account-main[data-page=grand-reset] .gr-kpi__label {
  font-size:.85rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--acc-ink-soft, #57595b);
  font-weight:500
}
.account-main[data-page=grand-reset] .gr-kpi__value {
  margin-top:.25rem;
  font-size:1.6rem;
  font-weight:950;
  color:#111
}
.account-main[data-page=grand-reset] .gr-kpi__sub {
  margin-top:.35rem;
  font-size:.93rem;
  color:var(--acc-ink-soft, #57595b);
  font-weight:650
}
.account-main[data-page=grand-reset] .gr-meter {
  margin-top:.55rem;
  height:10px;
  border-radius:999px;
  background:#e6e8ee;
  overflow:hidden;
  border:1px solid rgba(0, 0, 0, .06)
}
.account-main[data-page=grand-reset] .gr-meter__bar {
  height:100%;
  width:0%;
  background:linear-gradient(90deg, var(--gr-accent) 0, #a20707 100%);
  border-radius:inherit;
  box-shadow:0 6px 14px rgba(162,
  7,
  7,
  .22)
}
.account-main[data-page=grand-reset] .gr-rules {
  margin-top:12px;
  border-top:1px solid rgba(0, 0, 0, .08);
  padding-top:10px
}
.account-main[data-page=grand-reset] .gr-rules__title {
  font-weight:900;
  color:#1f2937;
  margin-bottom:6px
}
.account-main[data-page=grand-reset] .gr-rules ul {
  margin:0;
  padding-left:18px;
  color:var(--acc-ink-soft, #57595b);
  font-weight:600
}
.account-main[data-page=grand-reset] .gr-rules li {
  margin:.25rem 0
}
.account-main[data-page=grand-reset] .gr-side__title {
  margin:0 0 10px;
  font-size:1.12rem;
  font-weight:950;
  color:var(--acc-accent, #383838)
}
.account-main[data-page=grand-reset] .account-info-list {
  list-style:none;
  padding:0;
  margin:0 0 12px
}
.account-main[data-page=grand-reset] .account-info-list li {
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:.45rem 0;
  border-bottom:1px solid rgba(0, 0, 0, .06)
}
.account-main[data-page=grand-reset] .account-info-list span {
  color:var(--acc-ink-soft, #57595b);
  font-weight:700
}
.account-main[data-page=grand-reset] .action-list {
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:.55rem
}
.account-main[data-page=grand-reset] .action-list a {
  display:flex;
  align-items:center;
  justify-content:space-between;
  text-decoration:none;
  font-weight:850;
  color:#1f2937;
  padding:.7rem .85rem;
  border-radius:12px;
  border:1px solid rgba(0, 0, 0, .1);
  background:linear-gradient(90deg, #fff 0, #fff 45%, rgba(0, 0, 0, .03) 100%);
  box-shadow:0 2px 10px rgba(0,
  0,
  0,
  .06);
  transition:transform .12s,
  box-shadow .12s,
  border-color .12s
}
.account-main[data-page=grand-reset] .action-list a:focus-visible,
.account-main[data-page=grand-reset] .action-list a:hover {
  transform:translateY(-1px);
  border-color:rgba(0, 0, 0, .18);
  box-shadow:0 10px 18px rgba(0, 0, 0, .1);
  outline:0
}
.account-main[data-page=grand-reset] .gr-wide {
  grid-column:1/-1
}
.account-main[data-page=grand-reset] .gr-cardhead {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-end;
  margin-bottom:10px;
  padding-bottom:8px;
  border-bottom:1px solid rgba(0, 0, 0, .08)
}
.account-main[data-page=grand-reset] .gr-cardtitle {
  margin:0;
  font-size:1.18rem;
  font-weight:950;
  color:var(--acc-accent, #383838)
}
.account-main[data-page=grand-reset] .gr-cardhint {
  color:var(--acc-ink-soft, #57595b);
  font-weight:650
}
.account-main[data-page=grand-reset] .gr-tablewrap {
  overflow:auto;
  border-radius:12px;
  -webkit-overflow-scrolling:touch
}
.account-main[data-page=grand-reset] table.gr-table {
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  table-layout:fixed;
  background:#fff;
  border:1.3px solid rgba(0, 0, 0, .1);
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 2px 10px rgba(0,
  0,
  0,
  .06)
}
.account-main[data-page=grand-reset] table.gr-table thead th {
  background:var(--acc-accent, #383838);
  color:#fff;
  padding:.72rem .85rem;
  font-weight:850;
  letter-spacing:.01em;
  text-align:left;
  white-space:nowrap;
  border-bottom:1px solid rgba(255, 255, 255, .1)
}
.account-main[data-page=grand-reset] table.gr-table tbody td {
  padding:.64rem .85rem;
  border-bottom:1px solid rgba(0, 0, 0, .08);
  background:#f7f7f7;
  vertical-align:top;
  word-break:break-word;
  overflow-wrap:anywhere
}
.account-main[data-page=grand-reset] .td-num,
.account-main[data-page=grand-reset] .th-num {
  text-align:right;
  font-variant-numeric:tabular-nums
}
.account-main[data-page=buy-gp] .buygp-confirm-hint__title,
.account-main[data-page=buy-gp] .next-info .next-row .value,
.account-main[data-page=grand-reset] .td-strong {
  font-weight:950;
  color:#111
}
.account-main[data-page=grand-reset] tr.gr-row--ok td {
  background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(0, 0, 0, 0) 70%, var(--gr-accent-soft) 150%),
  inherit
}
.account-main[data-page=grand-reset] tr.gr-row--bad td {
  background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(0, 0, 0, 0) 70%, rgba(162, 7, 7, .06) 150%),
  inherit
}
.account-main[data-page=grand-reset] .td-action {
  vertical-align:middle
}
.account-main[data-page=grand-reset] .gr-actioncell {
  display:flex;
  flex-direction:column;
  gap:.35rem
}
.account-main[data-page=grand-reset] .gr-status {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  padding:.18rem .55rem;
  border-radius:999px;
  font-size:.85rem;
  font-weight:900;
  border:1px solid rgba(0, 0, 0, .1);
  background:#eef0f2;
  color:#333
}
.account-main[data-page=grand-reset] .gr-status--bad {
  background:#fff1f1;
  border-color:#f2d4d4;
  color:#9f2e2e
}
.account-main[data-page=grand-reset] .gr-reasonline {
  font-size:.92rem;
  color:var(--acc-ink-soft, #57595b);
  font-weight:650
}
.account-main[data-page=grand-reset] details.gr-reasons {
  margin-top:.15rem
}
.account-main[data-page=grand-reset] details.gr-reasons summary {
  cursor:pointer;
  font-weight:850;
  color:#1f2937
}
.account-main[data-page=grand-reset] details.gr-reasons ul {
  margin:.35rem 0 0;
  padding-left:18px;
  color:var(--acc-ink-soft, #57595b);
  font-weight:650
}
.account-main[data-page=grand-reset] details.gr-reasons li {
  margin:.22rem 0
}
.account-main[data-page=grand-reset] .gr-action {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.55rem .85rem;
  border-radius:12px;
  border:1px solid rgba(0, 0, 0, .1);
  cursor:pointer;
  font-weight:950;
  color:#111;
  background:linear-gradient(180deg, #fff 0, #fff 35%, var(--gr-accent-soft) 150%);
  box-shadow:0 2px 10px rgba(0,
  0,
  0,
  .08);
  transition:transform .12s,
  box-shadow .12s,
  border-color .12s
}
.account-main[data-page=grand-reset] .gr-action:focus-visible,
.account-main[data-page=grand-reset] .gr-action:hover {
  transform:translateY(-1px);
  box-shadow:0 10px 18px rgba(0, 0, 0, .12);
  border-color:rgba(0, 0, 0, .18);
  outline:0
}
@media (max-width:840px) {
  .account-main[data-page=grand-reset] table.gr-table,
  .account-main[data-page=grand-reset] table.gr-table tbody,
  .account-main[data-page=grand-reset] table.gr-table td,
  .account-main[data-page=grand-reset] table.gr-table th,
  .account-main[data-page=grand-reset] table.gr-table thead,
  .account-main[data-page=grand-reset] table.gr-table tr {
    display:block;
    width:100%
  }
  .account-main[data-page=grand-reset] table.gr-table thead {
    position:absolute;
    left:-9999px;
    top:-9999px;
    height:1px;
    overflow:hidden
  }
  .account-main[data-page=grand-reset] table.gr-table tbody tr {
    border-bottom:1px solid rgba(0, 0, 0, .08);
    padding:.55rem .6rem
  }
  .account-main[data-page=grand-reset] table.gr-table tbody tr:last-child {
    border-bottom:none
  }
  .account-main[data-page=grand-reset] table.gr-table tbody td {
    border:none;
    background:0 0!important;
    padding:.35rem;
    display:flex;
    justify-content:space-between;
    gap:12px
  }
  .account-main[data-page=grand-reset] table.gr-table tbody td::before {
    content:attr(data-label);
    font-weight:850;
    color:var(--acc-ink-soft, #57595b);
    max-width:48%
  }
  .account-main[data-page=grand-reset] .td-num {
    text-align:right
  }
  .account-main[data-page=grand-reset] .td-action {
    padding-top:.55rem
  }
}
.account-main[data-page=grand-reset] .gr-modal[hidden] {
  display:none!important
}
.account-main[data-page=grand-reset] .gr-modal {
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(0, 0, 0, .6);
  backdrop-filter:blur(2px)
}
.account-main[data-page=grand-reset] .gr-modal__dialog {
  width:min(560px,
  calc(100% - 1rem));
  max-height:calc(100dvh - 2rem);
  overflow:auto;
  background:#fff;
  border-radius:14px;
  border:1px solid rgba(0, 0, 0, .1);
  box-shadow:0 18px 60px rgba(0, 0, 0, .35);
  padding:16px 16px 14px
}
.account-main[data-page=grand-reset] .gr-modal__title {
  margin:0;
  font-size:1.15rem;
  font-weight:950;
  color:#111
}
.account-main[data-page=grand-reset] .gr-modal__text {
  margin:.55rem 0;
  color:#2a2f38;
  font-weight:650
}
.account-main[data-page=grand-reset] .gr-modal__meta {
  font-size:.92rem;
  color:var(--acc-ink-soft, #57595b);
  font-weight:650;
  padding:.55rem .7rem;
  border-radius:12px;
  border:1px dashed rgba(0, 0, 0, .14);
  background:linear-gradient(90deg, var(--gr-accent-soft) 0, rgba(255, 255, 255, .92) 75%);
  margin-bottom:10px
}
.account-main[data-page=grand-reset] .gr-modal__actions {
  display:flex;
  justify-content:flex-end;
  gap:.55rem;
  margin-top:10px
}
.account-main[data-page=grand-reset] .gr-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.6rem .95rem;
  border-radius:12px;
  border:1px solid rgba(0, 0, 0, .12);
  cursor:pointer;
  font-weight:950;
  background:#fff;
  color:#111;
  transition:transform .12s,
  box-shadow .12s,
  border-color .12s,
  opacity .12s
}
.account-main[data-page=grand-reset] .gr-btn:disabled {
  opacity:.55;
  cursor:not-allowed
}
.account-main[data-page=grand-reset] .gr-btn--ghost {
  background:#fff
}
.account-main[data-page=grand-reset] .gr-btn--primary {
  border-color:rgba(0, 0, 0, .1);
  background:linear-gradient(90deg, var(--gr-accent) 0, #ffb400 50%,
  var(--gr-accent) 100%);
  color:#111;
  box-shadow:0 10px 22px rgba(255,
  180,
  0,
  .22)
}
.account-main[data-page=grand-reset] .gr-btn:focus-visible:not(:disabled),
.account-main[data-page=grand-reset] .gr-btn:hover:not(:disabled) {
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(0, 0, 0, .14);
  border-color:rgba(0, 0, 0, .18);
  outline:0
}
.account-main[data-page=grand-reset] .gr-modal__msg {
  margin-top:10px;
  font-size:.92rem;
  color:#6b5300;
  font-weight:750
}
.account-main[data-page=grand-reset] .cf-turnstile {
  margin:10px 0 0
}
.account-main[data-page=grand-reset] .debug-box {
  border-left:4px solid #a20707;
  background:linear-gradient(90deg, rgba(162, 7, 7, .06) 0, #fff 70%)
}
.account-main[data-page=grand-reset] .debug-box ul {
  margin:8px 0 0;
  padding-left:18px
}
@media (prefers-reduced-motion:no-preference) {
  .animate-fadein {
    animation:.18s ease-out both accFadeIn
  }
  .animate-pop {
    animation:.18s ease-out both accPop
  }
  @keyframes accFadeIn {
    from {
      opacity:0;
      transform:translateY(6px)
    }
    to {
      opacity:1;
      transform:translateY(0)
    }
  }
  @keyframes accPop {
    from {
      opacity:0;
      transform:scale(.985)
    }
    to {
      opacity:1;
      transform:scale(1)
    }
  }
}
.account-main[data-page=dashboard] .realm-banner,
.account-main[data-page=grand-reset] .realm-banner {
  max-width:100%;
  margin:0;
  padding:16px;
  border-radius:var(--acc-radius);
  background:#fff;
  border:1.5px solid var(--acc-border);
  box-shadow:var(--acc-shadow)
}
.account-main[data-page=dashboard] .account-panel-flex {
  gap:18px
}
@media (min-width:981px) {
  .account-main[data-page=dashboard] .account-action-panel,
  .account-main[data-page=grand-reset] .gr-aside .gr-side {
    position:sticky;
    top:16px
  }
}
.account-main[data-page=dashboard] .account-action-list {
  max-width:100%;
  margin:0
}
.account-main[data-page=dashboard] .account-action-list li {
  justify-content:stretch
}
.account-main[data-page=dashboard] .action-btn,
.account-main[data-page=dashboard] .buy-gp-btn {
  max-width:100%
}
.account-main[data-page=dashboard] .account-info-box ul li {
  align-items:flex-start
}
.account-main[data-page=buy-gp] .payments-card {
  display:flex;
  flex-direction:column;
  gap:14px
}
.account-main[data-page=buy-gp] .realm-desc small {
  display:block;
  margin-top:6px;
  opacity:.88;
  font-weight:650
}
.account-main[data-page=buy-gp] .payments {
  display:flex;
  flex-direction:column;
  gap:10px
}
.account-main[data-page=buy-gp] .buygp-confirm-hint {
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:12px 14px;
  border-radius:12px;
  border:1.4px solid;
  background:linear-gradient(135deg, #f7f8fa 0, #fff 70%);
  box-shadow:0 2px 10px rgb(0 0 0 / .06)
}
.account-main[data-page=buy-gp] .buygp-confirm-hint__icon {
  width:40px;
  height:40px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  flex:0 0 auto
}
.account-main[data-page=buy-gp] .buygp-confirm-hint__text {
  margin:.35rem 0 0;
  color:var(--acc-ink-soft, #57595b);
  font-weight:650;
  line-height:1.35
}
.account-main[data-page=buy-gp] .buygp-confirm-hint__realm {
  margin:.55rem 0 0;
  display:flex;
  flex-wrap:wrap;
  gap:.4rem .55rem;
  font-weight:850
}
.account-main[data-page=buy-gp] .buygp-confirm-hint__realm .label,
.account-main[data-page=buy-gp] .next-info .next-row .label {
  color:var(--acc-ink-soft, #57595b);
  font-weight:750
}
.account-main[data-page=buy-gp] .buygp-confirm-hint__realm .value {
  color:#111;
  font-weight:950
}
.account-main[data-page=buy-gp] .next-info {
  margin-top:.65rem;
  padding:.65rem .8rem;
  border-radius:12px;
  border:1px solid;
  background:#fff
}
.account-main[data-page=buy-gp] .next-info .next-row {
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:.22rem 0
}
.account-main[data-page=buy-gp] .next-pill {
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.18rem .55rem;
  border-radius:999px;
  border:1px solid;
  background:linear-gradient(90deg, var(--realm-accent-soft, rgba(245, 201, 80, .16)) 0, #fff 85%);
  font-weight:950
}
.account-main[data-page=invite] .invite-link-row {
  display:flex;
  align-items:stretch;
  gap:10px;
  flex-wrap:nowrap
}
.account-main[data-page=invite] .invite-link-input {
  flex:1 1 auto;
  min-width:0;
  height:var(--acc-btn-height, 48px);
  padding:.55rem .85rem;
  border-radius:12px;
  border:1.4px solid var(--acc-border, #d3d4d6);
  background:#fffbe5;
  font-weight:800;
  letter-spacing:.01em;
  box-shadow:inset 0 1px 2px rgba(0, 0, 0, .04)
}
.account-main[data-page=invite] .invite-link-input:focus {
  outline:0;
  border-color:#a20707;
  box-shadow:0 0 0 3px rgba(162, 7, 7, .12),
  inset 0 1px 2px rgba(0, 0, 0, .04)
}
.account-main[data-page=invite] #copy-invite-btn.action-btn,
.account-main[data-page=invite] .invite-copy-btn.action-btn {
  flex:0 0 auto;
  width:auto!important;
  max-width:none!important;
  inline-size:clamp(140px, 14ch, 210px);
  min-height:var(--acc-btn-height, 48px);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-weight:900;
  border-radius:12px;
  border-color:rgba(0, 0, 0, .14);
  background:linear-gradient(90deg, #fff 0, #fff 55%, rgba(245, 201, 80, .22) 100%)
}
.account-main[data-page=invite] #copy-invite-btn:active {
  transform:none!important
}
.account-main[data-page=invite] #copy-invite-btn.is-loading {
  width:auto!important;
  inline-size:clamp(140px, 14ch, 210px)
}
.account-main[data-page=invite] #copy-invite-tooltip {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  margin-top:10px;
  padding:.28rem .62rem;
  border-radius:999px;
  border:1px solid rgba(40, 120, 60, .2);
  background:#e9f6ee;
  color:#287a3c;
  font-weight:950;
  opacity:0;
  transition:opacity .16s,
  transform .16s;
  transform:translateY(2px)
}
.account-main[data-page=invite] #copy-invite-tooltip.is-visible {
  opacity:1;
  transform:translateY(0)
}
@media (max-width:700px) {
  .account-main .account-points-modern {
    flex-direction:column;
    gap:.7em
  }
  .account-main .change-pass-form .input-row,
  .account-main .form-kv {
    grid-template-columns:1fr
  }
  .account-main .change-pass-form label,
  .account-main .form-kv .kv-label {
    text-align:left
  }
  .account-main .change-pass-form .action-btn {
    width:100%;
    max-width:100%
  }
  .account-main[data-page=grand-reset] .gr-cardhead,
  .account-section.realm-skin .bonus-box {
    flex-direction:column;
    align-items:flex-start
  }
  .account-section.realm-skin .vipbox .progress strong {
    top:-1.6rem
  }
  .account-main[data-page=grand-reset] .gr-hero__top {
    flex-direction:column;
    align-items:stretch
  }
  .account-main .account-action-panel,
  .account-main .account-chars-box,
  .account-main .account-info-box,
  .account-main .card,
  .account-main .panel {
    padding:14px
  }
  .account-main .action-btn {
    min-width:160px
  }
  .account-main[data-page=buy-gp] .buygp-confirm-hint {
    flex-direction:column
  }
  .account-main[data-page=buy-gp] .buygp-confirm-hint__icon {
    width:44px;
    height:44px
  }
  .account-main[data-page=invite] .invite-link-row {
    flex-direction:column;
    align-items:stretch;
    flex-wrap:wrap
  }
  .account-main[data-page=invite] #copy-invite-btn.action-btn,
  .account-main[data-page=invite] .invite-copy-btn.action-btn {
    inline-size:100%
  }
}
/* Daily Rewards dashboard highlight */
.account-main[data-page=dashboard] .dashboard-daily-btn {
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  align-items:center;
  gap:12px;
  width:100%;
  margin:10px auto 14px;
  padding:14px 15px;
  border-radius:18px;
  border:1px solid rgba(245, 158, 11, .42);
  background:linear-gradient(135deg, #fff7ed 0%, #ffffff 66%,
  #eff6ff 100%);
  color:#0f172a;
  text-decoration:none!important;
  text-align:left;
  box-shadow:0 14px 30px rgba(15, 23, 42, .10);
  transition:transform .14s ease,
  box-shadow .14s ease,
  border-color .14s ease;
}
.account-main[data-page=dashboard] .dashboard-daily-btn:hover {
  transform:translateY(-2px);
  border-color:rgba(245, 158, 11, .68);
  box-shadow:0 22px 42px rgba(15, 23,
  42, .14);
}
.account-main[data-page=dashboard] .dashboard-daily-btn__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:46px;
  height:46px;
  border-radius:16px;
  background:linear-gradient(135deg, #f59e0b, #f97316);
  color:#111827;
  font-size:20px;
  box-shadow:0 10px 20px rgba(249,
  115,
  22,
  .22);
}
.account-main[data-page=dashboard] .dashboard-daily-btn strong {
  display:block;
  margin:0 0 4px;
  color:#0f172a;
  font-size:16px;
  font-weight:1000;
}
.account-main[data-page=dashboard] .dashboard-daily-btn small {
  display:block;
  color:#475569;
  font-size:12px;
  line-height:1.35;
  font-weight:750;
}
/* 2026 Daily Rewards dashboard CTA — rebased fix */
.account-main[data-page=dashboard] .dashboard-daily-btn {
  position:relative;
  isolation:isolate;
  grid-template-columns:auto minmax(0, 1fr) auto;
  overflow:hidden;
}
.account-main[data-page=dashboard] .dashboard-daily-btn::before {
  content:"";
  position:absolute;
  inset:-40% -18%;
  z-index:-1;
  background:radial-gradient(circle at 14% 20%, rgba(245, 158, 11, .28), transparent 30%),
  radial-gradient(circle at 88% 15%,
  rgba(59,
  130,
  246,
  .18),
  transparent 28%);
  opacity:.9;
  pointer-events:none;
}
.account-main[data-page=dashboard] .dashboard-daily-btn__badge {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:72px;
  padding:.42rem .62rem;
  border-radius:999px;
  border:1px solid rgba(255, 255, 255, .55);
  background:linear-gradient(135deg, #fde68a, #f97316);
  color:#111827;
  box-shadow:0 10px 24px rgba(249, 115,
  22,
  .26);
  font-size:12px;
  font-weight:1000;
  white-space:nowrap;
}
.account-main[data-page=dashboard] .dashboard-daily-btn--hot {
  border-color:rgba(249, 115, 22, .78)!important;
  background:linear-gradient(135deg, #fff7ed 0%, #ffffff 46%,
  #eff6ff 100%);
  box-shadow:0 18px 44px rgba(249,
  115,
  22,
  .18),
  0 10px 32px rgba(15,
  23, 42, .10);
}
.account-main[data-page=dashboard] .dashboard-daily-btn--hot .dashboard-daily-btn__icon {
  animation:topmuDailyIconPulse 1.8s ease-in-out infinite;
}
.account-main[data-page=dashboard] .dashboard-daily-btn--hot strong {
  color:#9a3412;
  text-shadow:0 0 18px rgba(245, 158, 11, .42);
  animation:topmuDailyTextGlow 1.7s ease-in-out infinite;
}
@keyframes topmuDailyIconPulse {
  0%,
  100% {
    transform:scale(1);
    box-shadow:0 10px 20px rgba(249, 115, 22, .22)
  }
  50% {
    transform:scale(1.08);
    box-shadow:0 18px 34px rgba(249,
    115,
    22,
    .36)
  }
}
@keyframes topmuDailyTextGlow {
  0%,
  100% {
    filter:brightness(1)
  }
  50% {
    filter:brightness(1.22)
  }
}
@media (prefers-reduced-motion:reduce) {
  .account-main[data-page=dashboard] .dashboard-daily-btn--hot .dashboard-daily-btn__icon,
  .account-main[data-page=dashboard] .dashboard-daily-btn--hot strong {
    animation:none!important
  }
}
@media (max-width:560px) {
  .account-main[data-page=dashboard] .dashboard-daily-btn {
    grid-template-columns:auto minmax(0, 1fr);
  }
  .account-main[data-page=dashboard] .dashboard-daily-btn__badge {
    grid-column:1 / -1;
    width:max-content;
    margin-left:58px;
  }
}
/* Dashboard: Vote Points System shortcut under Daily Rewards */
.account-main[data-page=dashboard] .dashboard-vp-system-btn {
  margin-top:10px;
  background: radial-gradient(circle at 12% 18%, rgba(255, 255, 255, .28), transparent 28%),
  linear-gradient(135deg,
  #16213e 0%,
  #253f7c 52%,
  #c58b1a 100%)!important;
  border-color:rgba(245,
  201,
  80,
  .42)!important;
  color:#fff!important;
}
.account-main[data-page=dashboard] .dashboard-vp-system-btn .dashboard-daily-btn__icon {
  background:rgba(255, 255, 255, .16)!important;
  color:#ffe8a3!important;
  box-shadow:inset 0 0 0 1px rgba(255,
  255, 255, .18),
  0 14px 28px rgba(0, 0, 0, .18)!important;
}
.account-main[data-page=dashboard] .dashboard-vp-system-btn strong,
.account-main[data-page=dashboard] .dashboard-vp-system-btn small {
  color:#fff!important;
}
.account-main[data-page=dashboard] .dashboard-vp-system-btn small {
  opacity:.88;
}
.account-main[data-page=dashboard] .dashboard-vp-system-btn__badge {
  background:linear-gradient(135deg, #f5c950, #ffb400)!important;
  color:#111827!important;
  border:0!important;
}
.account-main[data-page=dashboard] .dashboard-vp-system-btn:hover {
  transform:translateY(-2px);
  filter:brightness(1.04);
}

/* ========================================================================
   TopMuOnline account UI consolidation — 2026-06-04
   Centralizes Daily Rewards, Vote Points, Vote and Share page styling in
   account.css so private account pages share one visual system.
   ======================================================================== */
.account-main {
  --account-ui-bg: #f8fafc;
  --account-ui-surface: #ffffff;
  --account-ui-soft: #f1f5f9;
  --account-ui-ink: #0f172a;
  --account-ui-muted: #64748b;
  --account-ui-border: rgba(15, 23, 42, .12);
  --account-ui-border-strong: rgba(15, 23, 42, .18);
  --account-ui-gold: #f5c950;
  --account-ui-orange: #f59e0b;
  --account-ui-blue: #2563eb;
  --account-ui-green: #16a34a;
  --account-ui-red: #dc2626;
  --account-ui-radius: 18px;
  --account-ui-radius-lg: 24px;
  --account-ui-shadow: 0 16px 44px rgba(15, 23, 42, .075);
  --account-ui-shadow-soft: 0 8px 24px rgba(15, 23, 42, .055);
}

.account-main[data-page="dashboard"],
.account-main[data-page="daily-rewards"],
.account-main[data-page="vote-points-system"],
.account-main[data-page="vote"],
.account-main[data-page="share"],
.account-main[data-page="invite"],
.account-main[data-page="vip-vote-shop"] {
  width: min(1240px, calc(100% - 24px)) !important;
  max-width: 1240px !important;
  padding: clamp(16px, 2.2vw, 28px) 0 32px !important;
}

.account-main[data-page="dashboard"] .account-section,
.account-main[data-page="daily-rewards"] .account-section,
.account-main[data-page="vote-points-system"] .account-section,
.account-main[data-page="vote"] .account-section,
.account-main[data-page="share"] .account-section,
.account-main[data-page="invite"] .account-section,
.account-main[data-page="vip-vote-shop"] .account-section {
  max-width: 100% !important;
  gap: 16px !important;
  padding: clamp(15px, 2vw, 22px) !important;
  border: 1px solid var(--account-ui-border) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 0 0, rgba(245, 201, 80, .12), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96)) !important;
  box-shadow: 0 24px 72px rgba(15, 23, 42, .10), 0 2px 12px rgba(15, 23, 42, .045) !important;
}

.account-main .card,
.account-main .reward-panel,
.account-main .vp-overview-panel,
.account-main .daily-task-panel,
.account-main .daily-side-panel > article,
.account-main .share-wizard-panel,
.account-main .share-history-panel,
.account-main .share-rules-collapsed,
.account-main .invite-link-card,
.account-main .invite-summary-card,
.account-main .invite-rules-card {
  border: 1px solid var(--account-ui-border) !important;
  border-radius: var(--account-ui-radius-lg) !important;
  background: var(--account-ui-surface) !important;
  box-shadow: var(--account-ui-shadow-soft) !important;
}

.account-main .account-titlebar,
.account-main .account-titlebar--reward,
.account-main .account-titlebar--daily,
.account-main .account-titlebar--vp-system,
.account-main .account-titlebar--vip-shop,
.account-main .account-titlebar--share,
.account-main .account-titlebar--invite,
.account-main .reward-titlebar--share,
.account-main .reward-titlebar--invite,
.account-main .account-titlebar[class*="reward-hero"] {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: clamp(15px, 2vw, 22px) !important;
  border: 1px solid rgba(245, 158, 11, .28) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 8% 0, rgba(245, 201, 80, .20), transparent 28%),
    radial-gradient(circle at 100% 0, rgba(37, 99, 235, .10), transparent 26%),
    linear-gradient(135deg, #fffaf0 0%, #ffffff 58%, #f8fbff 100%) !important;
  color: var(--account-ui-ink) !important;
  text-shadow: none !important;
  box-shadow: 0 12px 34px rgba(15, 23, 42, .07) !important;
  overflow: visible !important;
}

.account-main .account-titlebar .account-title,
.account-main .account-titlebar .account-subtitle,
.account-main .account-titlebar[class*="reward-hero"] .account-title,
.account-main .account-titlebar[class*="reward-hero"] .account-subtitle {
  color: var(--account-ui-ink) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
.account-main .account-titlebar .account-subtitle,
.account-main .account-titlebar[class*="reward-hero"] .account-subtitle {
  color: var(--account-ui-muted) !important;
}
.account-main .account-title { letter-spacing: -.025em; }
.account-main .account-title i { color: #9a3412; }
.account-main .daily-hero-chips,
.account-main .u-titlebar-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}
.account-main .xp-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(15, 23, 42, .10) !important;
  border-radius: 999px;
  background: rgba(255, 255, 255, .82) !important;
  color: var(--account-ui-muted) !important;
  box-shadow: none !important;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
}
.account-main .xp-chip .strong,
.account-main .xp-chip strong {
  color: var(--account-ui-ink) !important;
  font-weight: 1000;
}
.account-main .xp-chip--hot,
.account-main .xp-chip--ready {
  border-color: rgba(245, 158, 11, .28) !important;
  background: rgba(255, 247, 237, .94) !important;
}

.account-main .reward-kicker {
  display: inline-flex;
  align-items: center;
  margin: 0 0 6px;
  color: #92400e;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.account-main .reward-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.account-main .reward-actions--split { justify-content: space-between; }
.account-main .reward-btn,
.account-main .reward-secondary-btn,
.account-main .vote-btn,
.account-main .share-submit-btn,
.account-main .share-copy-main {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: 14px;
  text-decoration: none !important;
  font-weight: 950;
  line-height: 1.1;
  cursor: pointer;
  transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}
.account-main .reward-btn,
.account-main .vote-btn,
.account-main .share-submit-btn,
.account-main .share-copy-main {
  background: linear-gradient(135deg, var(--account-ui-gold), var(--account-ui-orange));
  color: #111827 !important;
  box-shadow: 0 12px 24px rgba(249, 115, 22, .18);
}
.account-main .reward-secondary-btn {
  background: #0f172a;
  color: #fff !important;
  border-color: rgba(15, 23, 42, .18);
  box-shadow: 0 10px 22px rgba(15, 23, 42, .11);
}
.account-main .reward-btn:hover,
.account-main .reward-secondary-btn:hover,
.account-main .vote-btn:hover,
.account-main .share-submit-btn:hover,
.account-main .share-copy-main:hover {
  transform: translateY(-1px);
  filter: brightness(1.03);
}
.account-main button[disabled],
.account-main .is-disabled {
  cursor: not-allowed !important;
  opacity: .64;
  transform: none !important;
  box-shadow: none !important;
}

/* Daily Rewards — current template class names */
.account-main[data-page="daily-rewards"] .daily-dashboard {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  gap: 16px;
  align-items: start;
}
.account-main[data-page="daily-rewards"] .daily-task-panel,
.account-main[data-page="daily-rewards"] .daily-side-panel {
  min-width: 0;
}
.account-main[data-page="daily-rewards"] .daily-task-panel {
  display: grid;
  gap: 14px;
  padding: clamp(15px, 1.8vw, 20px);
}
.account-main[data-page="daily-rewards"] .daily-side-panel {
  display: grid;
  gap: 14px;
}
.account-main[data-page="daily-rewards"] .daily-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(226, 232, 240, .92);
}
.account-main[data-page="daily-rewards"] .daily-panel-head h2,
.account-main[data-page="daily-rewards"] .daily-chest-card h2,
.account-main[data-page="daily-rewards"] .daily-history-card h2,
.account-main[data-page="vote-points-system"] .reward-section-head h2,
.account-main[data-page="vip-vote-shop"] .reward-section-head h2 {
  margin: 0;
  color: var(--account-ui-ink);
  font-size: clamp(20px, 2vw, 26px);
  line-height: 1.12;
  font-weight: 1000;
  letter-spacing: -.025em;
}
.account-main[data-page="daily-rewards"] .daily-panel-head p,
.account-main[data-page="vote-points-system"] .reward-section-head p,
.account-main[data-page="vip-vote-shop"] .reward-section-head p {
  margin: 4px 0 0;
  color: var(--account-ui-muted);
  font-weight: 750;
  line-height: 1.45;
}
.account-main[data-page="daily-rewards"] .daily-summary-line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
}
.account-main[data-page="daily-rewards"] .daily-summary-line dt,
.account-main[data-page="daily-rewards"] .daily-summary-line dd {
  margin: 0;
}
.account-main[data-page="daily-rewards"] .daily-summary-line dt {
  padding: 8px 0 8px 12px;
  color: var(--account-ui-muted);
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.account-main[data-page="daily-rewards"] .daily-summary-line dd {
  margin-left: -8px;
  padding: 8px 12px 8px 8px;
  border-radius: 0 999px 999px 0;
  background: #f8fafc;
  color: var(--account-ui-ink);
  font-size: 12px;
  font-weight: 1000;
}
.account-main[data-page="daily-rewards"] .daily-task-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.account-main[data-page="daily-rewards"] .daily-task-row {
  display: grid;
  grid-template-columns: 42px minmax(160px, 1fr) auto auto minmax(120px, .48fr) minmax(128px, auto);
  grid-template-areas:
    "no title reward state progress action"
    "no hint detail detail progress action";
  align-items: center;
  gap: 6px 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 18px;
  background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
  box-shadow: 0 8px 20px rgba(15, 23, 42, .045);
}
.account-main[data-page="daily-rewards"] .daily-task-row--ready { border-color: rgba(245, 158, 11, .42); background: linear-gradient(135deg, #fff7ed 0%, #fff 82%); }
.account-main[data-page="daily-rewards"] .daily-task-row--claimed { border-color: rgba(22, 163, 74, .28); background: linear-gradient(135deg, #f0fdf4 0%, #fff 82%); }
.account-main[data-page="daily-rewards"] .daily-task-row--next:not(.daily-task-row--claimed) { border-color: rgba(37, 99, 235, .28); }
.account-main[data-page="daily-rewards"] .daily-task-row__no {
  grid-area: no;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 13px;
  background: #e2e8f0;
  color: var(--account-ui-ink);
  font-weight: 1000;
}
.account-main[data-page="daily-rewards"] .daily-task-row--ready .daily-task-row__no { background: linear-gradient(135deg, var(--account-ui-gold), var(--account-ui-orange)); }
.account-main[data-page="daily-rewards"] .daily-task-row--claimed .daily-task-row__no { background: linear-gradient(135deg, #16a34a, #22c55e); color: #fff; }
.account-main[data-page="daily-rewards"] .daily-task-row__title {
  grid-area: title;
  min-width: 0;
  margin: 0;
  color: var(--account-ui-ink);
  font-size: 15px;
  line-height: 1.18;
  font-weight: 1000;
}
.account-main[data-page="daily-rewards"] .daily-task-row__hint {
  grid-area: hint;
  min-width: 0;
  margin: 0;
  color: var(--account-ui-muted);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 750;
}
.account-main[data-page="daily-rewards"] .daily-task-row__reward {
  grid-area: reward;
  justify-self: start;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(245, 158, 11, .13);
  color: #9a3412;
  font-size: 11px;
  font-weight: 1000;
  white-space: nowrap;
}
.account-main[data-page="daily-rewards"] .daily-task-row__state {
  grid-area: state;
  justify-self: start;
  padding: 5px 9px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 11px;
  font-weight: 1000;
  white-space: nowrap;
}
.account-main[data-page="daily-rewards"] .daily-task-row__state--done { background: rgba(34,197,94,.14); color: #166534; }
.account-main[data-page="daily-rewards"] .daily-task-row__state--ready { background: rgba(245,158,11,.17); color: #92400e; }
.account-main[data-page="daily-rewards"] .daily-task-row__state--locked { background: #f1f5f9; color: #64748b; }
.account-main[data-page="daily-rewards"] .daily-task-row__state--fast { background: rgba(20,184,166,.12); color: #0f766e; }
.account-main[data-page="daily-rewards"] .daily-task-row__detail {
  grid-area: detail;
  color: #475569;
  font-size: 12px;
  font-weight: 780;
}
.account-main[data-page="daily-rewards"] .daily-task-row__progress {
  grid-area: progress;
  width: 100%;
  min-width: 110px;
}
.account-main[data-page="daily-rewards"] .daily-task-row__action {
  grid-area: action;
  justify-self: end;
  margin: 0 !important;
}
.account-main[data-page="daily-rewards"] .daily-task-row__action .daily-claim-btn,
.account-main[data-page="daily-rewards"] .daily-task-row__action.daily-claim-btn,
.account-main[data-page="daily-rewards"] .daily-claim-btn.daily-task-row__action {
  min-width: 122px;
  width: 100%;
}
.account-main .daily-progress {
  display: block;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e2e8f0;
}
.account-main .daily-progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #14b8a6, var(--account-ui-orange));
}
.account-main .daily-progress--p0 > span { width: 0%; }
.account-main .daily-progress--p10 > span { width: 10%; }
.account-main .daily-progress--p20 > span { width: 20%; }
.account-main .daily-progress--p30 > span { width: 30%; }
.account-main .daily-progress--p40 > span { width: 40%; }
.account-main .daily-progress--p50 > span { width: 50%; }
.account-main .daily-progress--p60 > span { width: 60%; }
.account-main .daily-progress--p70 > span { width: 70%; }
.account-main .daily-progress--p80 > span { width: 80%; }
.account-main .daily-progress--p90 > span { width: 90%; }
.account-main .daily-progress--p100 > span { width: 100%; }
.account-main .daily-claim-btn,
.account-main .daily-chest-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  padding: 9px 13px;
  border: 0;
  border-radius: 13px;
  background: linear-gradient(135deg, var(--account-ui-gold), var(--account-ui-orange));
  color: #111827;
  font-size: 12px;
  font-weight: 1000;
  text-decoration: none !important;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(249, 115, 22, .18);
}
.account-main .daily-claim-btn--ghost { background: rgba(20,184,166,.11); color: #0f766e; box-shadow: none; }
.account-main .daily-claim-btn--locked,
.account-main .daily-claim-btn--claimed,
.account-main .daily-chest-btn--locked,
.account-main .daily-chest-btn--claimed { background: #f1f5f9; color: #64748b; box-shadow: none; cursor: default; }
.account-main .daily-claim-btn--claimed,
.account-main .daily-chest-btn--claimed { background: rgba(34,197,94,.13); color: #166534; }
.account-main[data-page="daily-rewards"] .daily-chest-card {
  display: grid;
  gap: 10px;
  padding: 18px;
  text-align: left;
}
.account-main[data-page="daily-rewards"] .daily-chest-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: 0;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--account-ui-gold), var(--account-ui-orange));
  color: #111827;
  font-size: 22px;
  box-shadow: 0 12px 26px rgba(249, 115, 22, .20);
}
.account-main[data-page="daily-rewards"] .daily-chest-card p { margin: 0; color: var(--account-ui-muted); font-weight: 750; line-height: 1.45; }
.account-main[data-page="daily-rewards"] .daily-chest-meter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-weight: 950;
}
.account-main[data-page="daily-rewards"] .daily-bonus-chip {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(249, 115, 22, .12);
  color: #9a3412;
  font-size: 12px;
  font-weight: 1000;
}
.account-main[data-page="daily-rewards"] .daily-bonus-chip--muted { background: rgba(148,163,184,.13); color: #475569; }
.account-main[data-page="daily-rewards"] .daily-history-card { padding: 16px; }
.account-main[data-page="daily-rewards"] .daily-history-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.account-main[data-page="daily-rewards"] .daily-history-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 4px 10px;
  padding: 10px;
  border: 1px solid rgba(148,163,184,.18);
  border-radius: 14px;
  background: #f8fafc;
}
.account-main[data-page="daily-rewards"] .daily-history-row span { color: var(--account-ui-ink); font-weight: 900; text-transform: capitalize; }
.account-main[data-page="daily-rewards"] .daily-history-row strong { color: #0f766e; font-weight: 1000; }
.account-main[data-page="daily-rewards"] .daily-history-row small { grid-column: 1 / -1; color: var(--account-ui-muted); font-weight: 750; }
.account-main[data-page="daily-rewards"] .daily-bottom-actions { margin-top: 0; }

/* Vote Points System + VIP shop */
.account-main .daily-command-grid,
.account-main .reward-grid--wallet {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.account-main .daily-stat-card,
.account-main .reward-card {
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(148,163,184,.22);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .045);
}
.account-main .daily-stat-card span,
.account-main .reward-card .reward-kicker {
  display: block;
  margin-bottom: 8px;
  color: var(--account-ui-muted);
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.account-main .daily-stat-card strong,
.account-main .reward-card strong,
.account-main .reward-balance {
  display: block;
  color: var(--account-ui-ink);
  font-size: clamp(22px, 2.6vw, 32px);
  line-height: 1;
  font-weight: 1000;
}
.account-main .daily-stat-card small,
.account-main .reward-card p { display: block; margin-top: 9px; color: var(--account-ui-muted); font-weight: 760; line-height: 1.4; }
.account-main .vp-action-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}
.account-main .vp-action-card {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 132px;
  padding: 16px;
  border: 1px solid rgba(148,163,184,.24);
  border-radius: 20px;
  background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
  color: var(--account-ui-ink);
  text-decoration: none !important;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .055);
  overflow: hidden;
}
.account-main .vp-action-card:hover { transform: translateY(-2px); border-color: rgba(245,158,11,.42); box-shadow: 0 18px 38px rgba(15,23,42,.10); }
.account-main .vp-action-card__icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 17px;
  background: rgba(245,158,11,.15);
  color: #9a3412;
  font-size: 20px;
}
.account-main .vp-action-card__body { display: grid; gap: 6px; min-width: 0; }
.account-main .vp-action-card__body strong { color: var(--account-ui-ink); font-size: 17px; line-height: 1.15; font-weight: 1000; }
.account-main .vp-action-card__body small { color: #475569; font-size: 12px; line-height: 1.38; font-weight: 760; }
.account-main .vp-action-card__body em { width: max-content; max-width: 100%; padding: 5px 8px; border-radius: 999px; background: rgba(245,158,11,.13); color: #9a3412; font-size: 11px; font-style: normal; font-weight: 1000; text-transform: uppercase; }
.account-main .vp-action-card__arrow { color: #94a3b8; font-size: 28px; font-weight: 1000; }
.account-main .vp-overview-panel { padding: 18px; }
.account-main .vp-flow-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}
.account-main .vp-flow-list li { padding: 12px; border: 1px solid rgba(148,163,184,.22); border-radius: 16px; background: #f8fafc; }
.account-main .vp-flow-list strong { display:block; color: var(--account-ui-ink); font-size: 22px; line-height: 1; font-weight: 1000; }
.account-main .vp-flow-list span { display:block; margin-top: 5px; color: var(--account-ui-muted); font-size: 12px; line-height: 1.35; font-weight: 850; }
.account-main .vp-ledger-table,
.account-main .share-history-table,
.account-main .vote-status-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid rgba(148,163,184,.22);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}
.account-main .vp-ledger-table th,
.account-main .vp-ledger-table td,
.account-main .share-history-table th,
.account-main .share-history-table td,
.account-main .vote-status-table th,
.account-main .vote-status-table td {
  padding: 11px 12px;
  border-bottom: 1px solid rgba(226,232,240,.9);
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}
.account-main .vp-ledger-table th,
.account-main .share-history-table th,
.account-main .vote-status-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.account-main .vp-ledger-table td,
.account-main .share-history-table td,
.account-main .vote-status-table td { color: #334155; font-size: 13px; font-weight: 760; line-height: 1.4; }
.account-main .vp-ledger-table tr:last-child td,
.account-main .share-history-table tr:last-child td,
.account-main .vote-status-table tr:last-child td { border-bottom: 0; }
.account-main .reward-vip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
}
.account-main .reward-vip-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(148,163,184,.22);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(15,23,42,.045);
}
.account-main .reward-vip-card__top { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.account-main .reward-vip-card__top h3 { margin:0; color:var(--account-ui-ink); font-weight:1000; }
.account-main .reward-alert,
.account-main .reward-pill { display:inline-flex; align-items:center; gap:8px; padding:9px 12px; border-radius:14px; background:#fff7ed; color:#92400e; border:1px solid rgba(245,158,11,.20); font-weight:850; }

/* Vote page */
.account-main[data-page="vote"] .vote-wrap {
  display: grid;
  gap: 18px;
  padding: clamp(22px, 2.7vw, 32px);
}
.account-main[data-page="vote"] .vote-sites-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.account-main[data-page="vote"] .vote-card {
  position: relative;
  display: grid;
  grid-template-columns: 154px minmax(0, 1fr);
  grid-template-areas: "media body";
  align-items: stretch;
  gap: 18px;
  min-height: 196px;
  padding: clamp(18px, 2vw, 24px);
  border: 1px solid rgba(15,23,42,.11);
  border-radius: 22px;
  background:
    radial-gradient(circle at 0 0, rgba(245,201,80,.14), transparent 34%),
    linear-gradient(135deg, #ffffff 0%, #fffaf0 100%);
  box-shadow: 0 12px 30px rgba(15,23,42,.065);
  overflow: hidden;
}
.account-main[data-page="vote"] .vote-card__badges {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
}
.account-main[data-page="vote"] .vote-card__media {
  grid-area: media;
  display: grid;
  place-items: center;
  align-self: stretch;
  min-height: 124px;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  background: rgba(248,250,252,.92);
}
.account-main[data-page="vote"] .vote-card__media img { max-width: 116px; max-height: 82px; object-fit: contain; }
.account-main[data-page="vote"] .vote-card__body { grid-area: body; display: grid; gap: 13px; align-content: center; min-width: 0; padding-right: 118px; }
.account-main[data-page="vote"] .vote-card__title { margin: 0; font-size: clamp(28px, 3vw, 38px); line-height: 1.08; font-weight: 1000; letter-spacing: -.025em; }
.account-main[data-page="vote"] .vote-card__title a { color: var(--account-ui-ink); text-decoration: none; }
.account-main[data-page="vote"] .vote-card__reward { margin: 0; color: #475569; font-size: 14px; font-weight: 850; }
.account-main[data-page="vote"] .vote-card__actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.account-main[data-page="vote"] .vote-card__actions .vote-btn { min-height: 60px; min-width: 236px; padding: 16px 30px; font-size: 17px; border-radius: 16px; }
.account-main[data-page="vote"] .vote-card__actions .reward-secondary-btn { min-height: 54px; min-width: 168px; padding: 14px 20px; font-size: 14px; border-radius: 16px; }

.account-main[data-page="vote"] .vote-card__account-hint,
.account-main[data-page="vote"] .vote-card__hint { display:flex; align-items:flex-start; gap:8px; width:max-content; max-width:100%; margin:0; padding:8px 10px; border:1px solid rgba(15,23,42,.08); border-radius:12px; background:#fff; color:#64748b; font-size:13px; font-weight:760; line-height:1.4; }
.account-main[data-page="vote"] .vote-card__account-hint strong { color:#151b29; }
.account-main[data-page="vote"] .vote-card__account-hint small { color:#94a3b8; font-weight:700; }

.account-main[data-page="vote"] .vote-badge { display:inline-flex; align-items:center; gap:6px; padding:7px 10px; border-radius:999px; background:#f0fdf4; color:#166534; font-size:11px; font-weight:1000; box-shadow:0 6px 14px rgba(22,163,74,.10); }
.account-main[data-page="vote"] .vote-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(37,99,235,.20);
  border-radius: 16px;
  background: #eff6ff;
  color: #1e3a8a;
  font-weight: 780;
}
.account-main[data-page="vote"] .vote-notice[hidden] { display: none !important; }
.account-main[data-page="vote"] .vote-notice--success { border-color: rgba(22,163,74,.22); background: #f0fdf4; color: #166534; }
.account-main[data-page="vote"] .vote-notice--error { border-color: rgba(220,38,38,.24); background: #fff5f5; color: #991b1b; }
.account-main[data-page="vote"] .vote-notice__close { margin-left: auto; border: 0; background: transparent; cursor: pointer; font-size: 20px; line-height: 1; }
.account-main[data-page="vote"] .vote-status-header { display: grid; gap: 4px; }
.account-main[data-page="vote"] .vote-status-help { margin: 0 0 4px; color: var(--account-ui-muted); font-size: 13px; font-weight: 750; }
.account-main[data-page="vote"] .vote-status-table-wrap {
  width: 100%;
  overflow-x: auto;
  border-radius: 16px;
  -webkit-overflow-scrolling: touch;
}
.account-main[data-page="vote"] .vote-status-table { min-width: 840px; }
.account-main[data-page="vote"] .vote-status-row--success td:first-child { box-shadow: inset 4px 0 0 #16a34a; }
.account-main[data-page="vote"] .vote-status-row--info td:first-child { box-shadow: inset 4px 0 0 #2563eb; }
.account-main[data-page="vote"] .vote-status-row--warn td:first-child { box-shadow: inset 4px 0 0 #f59e0b; }
.account-main[data-page="vote"] .vote-status-row--error td:first-child { box-shadow: inset 4px 0 0 #dc2626; }
.account-main .vote-status-pill,
.account-main .reward-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  padding: 5px 9px;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 999px;
  background: #f1f5f9;
  color: #334155;
  font-size: 11px;
  font-weight: 1000;
  line-height: 1.2;
}
.account-main .vote-status-pill--success,
.account-main .reward-status--approved { background: rgba(22,163,74,.12); border-color: rgba(22,163,74,.24); color: #166534; }
.account-main .vote-status-pill--info,
.account-main .reward-status--pending { background: rgba(37,99,235,.10); border-color: rgba(37,99,235,.22); color: #1d4ed8; }
.account-main .vote-status-pill--warn { background: rgba(245,158,11,.14); border-color: rgba(245,158,11,.28); color: #92400e; }
.account-main .vote-status-pill--error,
.account-main .reward-status--rejected { background: rgba(220,38,38,.10); border-color: rgba(220,38,38,.22); color: #991b1b; }
.account-main .vote-status-detail { color: #475569; }

/* Community Share */
.account-main[data-page="share"] .share-template-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; clip-path:inset(50%); }
.account-main[data-page="share"] .account-alert { display:flex; align-items:flex-start; gap:9px; margin:0; padding:12px 14px; border-radius:14px; font-weight:850; line-height:1.45; }
.account-main[data-page="share"] .account-alert--success { border:1px solid rgba(22,163,74,.22); background:#f0fdf4; color:#166534; }
.account-main[data-page="share"] .account-alert--error { border:1px solid rgba(220,38,38,.24); background:#fff5f5; color:#991b1b; }
.account-main[data-page="share"] .share-wizard { display: grid; gap: 14px; }
.account-main[data-page="share"] .share-wizard-progress {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.account-main[data-page="share"] .share-wizard-dot {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 10px;
  border: 1px solid rgba(148,163,184,.22);
  border-radius: 15px;
  background: #fff;
  color: var(--account-ui-ink);
  text-align: left;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(15,23,42,.04);
}
.account-main[data-page="share"] .share-wizard-dot span { display:grid; place-items:center; width:30px; height:30px; border-radius:11px; background:#f1f5f9; color:#64748b; font-weight:1000; }
.account-main[data-page="share"] .share-wizard-dot strong { min-width:0; color:var(--account-ui-ink); font-size:12px; line-height:1.2; font-weight:1000; }
.account-main[data-page="share"] .share-wizard-dot.is-active { border-color: rgba(245,158,11,.46); background: linear-gradient(135deg, #fff7ed, #fff); }
.account-main[data-page="share"] .share-wizard-dot.is-active span { background: linear-gradient(135deg, var(--account-ui-gold), var(--account-ui-orange)); color:#111827; }
.account-main[data-page="share"] .share-wizard-dot.is-complete span { background: #dcfce7; color:#166534; }
.account-main[data-page="share"] .share-wizard-dot[disabled] { opacity:.56; cursor:not-allowed; }
.account-main[data-page="share"] .share-wizard-panel { display: none; gap: 12px; padding: clamp(16px, 2vw, 24px); }
.account-main[data-page="share"] .share-wizard-panel.is-active { display: grid; }
.account-main[data-page="share"] .share-wizard-panel h2 { margin:0; color:var(--account-ui-ink); font-size:clamp(22px,2.4vw,32px); line-height:1.08; font-weight:1000; letter-spacing:-.03em; }
.account-main[data-page="share"] .share-wizard-panel p { margin:0; color:#334155; font-weight:760; line-height:1.5; }
.account-main[data-page="share"] .share-field-label { display:block; margin:4px 0 6px; color:#1e293b; font-size:13px; font-weight:950; }
.account-main[data-page="share"] .share-input { width:100%; min-height:44px; padding:10px 12px; border:1px solid rgba(148,163,184,.34); border-radius:14px; background:#fff; color:var(--account-ui-ink); font-weight:800; outline:0; }
.account-main[data-page="share"] .share-input:focus { border-color:rgba(245,158,11,.62); box-shadow:0 0 0 4px rgba(245,158,11,.13); }
.account-main[data-page="share"] .share-input--textarea { min-height:142px; resize:vertical; line-height:1.5; }
.account-main[data-page="share"] .share-input--small { min-height:82px; }
.account-main[data-page="share"] .share-input--url { font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size:13px; }
.account-main[data-page="share"] .share-final-text { min-height:170px; border-color:rgba(245,158,11,.35); background:linear-gradient(180deg,#fff,#fffdf8); }
.account-main[data-page="share"] .share-example-box,
.account-main[data-page="share"] .share-step-warning,
.account-main[data-page="share"] .share-copy-callout,
.account-main[data-page="share"] .share-proof-example,
.account-main[data-page="share"] .share-selected-platform,
.account-main[data-page="share"] .share-quick-completed,
.account-main[data-page="share"] .share-facebook-completed,
.account-main[data-page="share"] .share-proof-queue,
.account-main[data-page="share"] .share-empty-state {
  padding: 13px 15px;
  border: 1px solid rgba(148,163,184,.20);
  border-radius: 16px;
  background: #fff;
  color: #334155;
  box-shadow: 0 6px 18px rgba(15,23,42,.035);
}
.account-main[data-page="share"] .share-step-warning { border-color: rgba(245,158,11,.26); background:#fff7ed; color:#92400e; }
.account-main[data-page="share"] .share-platform-grid,
.account-main[data-page="share"] .share-fb-groups-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:10px; }
.account-main[data-page="share"] .share-platform-btn,
.account-main[data-page="share"] .share-fb-group-card {
  display:grid;
  gap:5px;
  padding:13px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:16px;
  background:#fff;
  color:var(--account-ui-ink);
  text-decoration:none !important;
  text-align:left;
  box-shadow:0 6px 18px rgba(15,23,42,.04);
}
.account-main[data-page="share"] .share-platform-btn.is-active,
.account-main[data-page="share"] .share-fb-group-card.is-active { border-color:rgba(245,158,11,.48); background:#fff7ed; }
.account-main[data-page="share"] .share-action-row,
.account-main[data-page="share"] .share-proof-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.account-main[data-page="share"] .share-action-row--between { justify-content:space-between; }
.account-main[data-page="share"] .share-action-row--end { justify-content:flex-end; }
.account-main[data-page="share"] .share-proof-rows { display:grid; gap:8px; }
.account-main[data-page="share"] .share-proof-entry { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:start; }
.account-main[data-page="share"] .share-status-strip { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:10px; }
.account-main[data-page="share"] .share-status-strip article { padding:13px; border:1px solid rgba(148,163,184,.22); border-radius:16px; background:#fff; box-shadow:0 6px 18px rgba(15,23,42,.035); }
.account-main[data-page="share"] .share-status-strip span { display:block; color:var(--account-ui-muted); font-size:11px; font-weight:1000; text-transform:uppercase; letter-spacing:.055em; }
.account-main[data-page="share"] .share-status-strip strong { display:block; margin-top:6px; color:var(--account-ui-ink); font-size:20px; line-height:1; font-weight:1000; }
.account-main[data-page="share"] .share-history-panel { padding:18px; }
.account-main[data-page="share"] .share-history-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:12px; }
.account-main[data-page="share"] .share-history-head h2 { margin:0; color:var(--account-ui-ink); font-size:clamp(20px,2vw,26px); line-height:1.12; font-weight:1000; }
.account-main[data-page="share"] .share-history-head p { margin:4px 0 0; color:var(--account-ui-muted); font-weight:750; }
.account-main[data-page="share"] .share-history-count { padding:6px 10px; border-radius:999px; background:#f8fafc; color:#475569; font-size:12px; font-weight:1000; white-space:nowrap; }
.account-main[data-page="share"] .share-history-table-wrap { overflow-x:auto; border-radius:16px; }
.account-main[data-page="share"] .share-history-table { min-width:900px; }
.account-main[data-page="share"] .share-history-url { color:#1d4ed8; font-weight:850; }
.account-main[data-page="share"] .share-history-text summary { cursor:pointer; color:#1d4ed8; font-weight:900; }
.account-main[data-page="share"] .share-history-reward { font-weight:1000; }
.account-main[data-page="share"] .share-history-reward.is-paid { color:#166534; }
.account-main[data-page="share"] .share-history-reward.is-rejected { color:#991b1b; }
.account-main[data-page="share"] .share-rules-collapsed { padding:14px 16px; }
.account-main[data-page="share"] .share-rules-collapsed summary { cursor:pointer; font-weight:1000; color:var(--account-ui-ink); }

/* Invite page: align older reward blocks with the unified account look. */
.account-main[data-page="invite"] .invite-stat-grid,
.account-main[data-page="invite"] .reward-milestone-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:12px; }
.account-main[data-page="invite"] .invite-stat,
.account-main[data-page="invite"] .reward-milestone { padding:16px; border:1px solid rgba(148,163,184,.22); border-radius:18px; background:#fff; box-shadow:0 8px 20px rgba(15,23,42,.045); }
.account-main[data-page="invite"] .invite-link-row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.account-main[data-page="invite"] .invite-link-input { flex:1 1 320px; min-height:42px; padding:10px 12px; border:1px solid rgba(148,163,184,.34); border-radius:14px; background:#fff; }
.account-main[data-page="invite"] .invite-social-share { display:grid; gap:10px; padding:14px; border:1px solid rgba(37,99,235,.22); border-radius:18px; background:linear-gradient(135deg,#eff6ff,#ffffff 72%); }
.account-main[data-page="invite"] .invite-social-share__buttons { display:flex; flex-wrap:wrap; gap:10px; }
.account-main[data-page="invite"] .invite-social-btn { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:9px 12px; border-radius:999px; background:#0f172a; color:#fff!important; text-decoration:none!important; font-size:13px; font-weight:950; }

@media (max-width: 1180px) {
  .account-main[data-page="daily-rewards"] .daily-dashboard,
  .account-main .vp-action-board,
  .account-main .daily-command-grid,
  .account-main .reward-grid--wallet,
  .account-main .vp-flow-list,
  .account-main[data-page="share"] .share-status-strip,
  .account-main[data-page="invite"] .invite-stat-grid,
  .account-main[data-page="invite"] .reward-milestone-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .account-main[data-page="daily-rewards"] .daily-dashboard { grid-template-columns: 1fr; }
  .account-main[data-page="share"] .share-wizard-progress { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .account-main[data-page="daily-rewards"] .daily-task-row {
    grid-template-columns: 40px minmax(0,1fr) auto auto;
    grid-template-areas:
      "no title reward state"
      "no hint hint hint"
      "progress progress detail action";
  }
}
@media (max-width: 760px) {
  .account-main[data-page="dashboard"],
  .account-main[data-page="daily-rewards"],
  .account-main[data-page="vote-points-system"],
  .account-main[data-page="vote"],
  .account-main[data-page="share"],
  .account-main[data-page="invite"],
  .account-main[data-page="vip-vote-shop"] {
    width: min(100% - 16px, 1240px) !important;
    padding-top: 12px !important;
  }
  .account-main .account-titlebar,
  .account-main .account-titlebar--reward,
  .account-main .account-titlebar--daily,
  .account-main .account-titlebar--vp-system,
  .account-main .account-titlebar--vip-shop,
  .account-main .account-titlebar--share,
  .account-main .account-titlebar--invite { flex-direction: column !important; }
  .account-main .daily-hero-chips,
  .account-main .u-titlebar-actions { justify-content:flex-start !important; }
  .account-main .reward-actions--split { justify-content: stretch; }
  .account-main .reward-actions--split > *,
  .account-main .reward-btn,
  .account-main .reward-secondary-btn,
  .account-main .vote-btn,
  .account-main .share-submit-btn { width: 100%; }
  .account-main[data-page="daily-rewards"] .daily-task-row {
    grid-template-columns: 36px minmax(0, 1fr);
    grid-template-areas:
      "no title"
      "hint hint"
      "reward state"
      "detail detail"
      "progress progress"
      "action action";
    align-items: start;
  }
  .account-main[data-page="daily-rewards"] .daily-task-row__action { justify-self: stretch; }
  .account-main[data-page="daily-rewards"] .daily-task-row__action .daily-claim-btn,
  .account-main[data-page="daily-rewards"] .daily-task-row__action.daily-claim-btn,
  .account-main[data-page="daily-rewards"] .daily-claim-btn.daily-task-row__action { width: 100%; }
  .account-main .vp-action-board,
  .account-main .daily-command-grid,
  .account-main .reward-grid--wallet,
  .account-main .vp-flow-list,
  .account-main[data-page="share"] .share-wizard-progress,
  .account-main[data-page="share"] .share-status-strip,
  .account-main[data-page="invite"] .invite-stat-grid,
  .account-main[data-page="invite"] .reward-milestone-grid { grid-template-columns: 1fr; }
  .account-main[data-page="vote"] .vote-sites-list { grid-template-columns: 1fr; }
  .account-main[data-page="vote"] .vote-card { grid-template-columns: 1fr; grid-template-areas: "media" "body"; }
  .account-main[data-page="vote"] .vote-card__body { padding-right: 0; }
  .account-main[data-page="vote"] .vote-card__badges { position: static; grid-row: 1; justify-content: flex-start; }
  .account-main[data-page="vote"] .vote-card__media { min-height: 84px; }
  .account-main[data-page="share"] .share-proof-entry { grid-template-columns: 1fr; }
  .account-main[data-page="share"] .share-history-head { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  .account-main *,
  .account-main *::before,
  .account-main *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}

/* Account auth page alignment ------------------------------------------------ */
.account-main.account-auth-main {
  width: min(760px, calc(100% - 24px)) !important;
  max-width: 760px !important;
  padding: clamp(18px, 3vw, 34px) 0 42px !important;
}
.account-main.account-auth-main .account-auth-card {
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: clamp(20px, 3vw, 34px) !important;
  border: 1px solid var(--account-ui-border) !important;
  border-radius: var(--account-ui-radius-lg) !important;
  background:
    radial-gradient(circle at 0 0, rgba(245, 201, 80, .14), transparent 32%),
    linear-gradient(180deg, #fff, #f8fafc) !important;
  box-shadow: var(--account-ui-shadow) !important;
}
.account-main.account-auth-main .account-auth-card h1 {
  margin: 0 0 10px !important;
  color: var(--account-ui-ink) !important;
  font-size: clamp(1.7rem, 3vw, 2.25rem) !important;
  letter-spacing: -.035em;
}
.account-main.account-auth-main .account-auth-intro {
  margin: 0 0 1.5rem;
  color: var(--account-ui-muted);
  font-size: 1.05rem;
  line-height: 1.65;
  text-align: center;
}
.account-main.account-auth-main .form-layout input:not([type="checkbox"]):not([type="radio"]) {
  min-height: 44px;
  border-color: var(--account-ui-border) !important;
  border-radius: 12px !important;
  background: #fff !important;
}
.account-main.account-auth-main .form-layout input:focus {
  border-color: rgba(245, 158, 11, .55) !important;
  box-shadow: 0 0 0 4px rgba(245, 158, 11, .14) !important;
}
.account-main.account-auth-main .form-layout .button {
  min-height: 46px;
  border-radius: 14px !important;
  background: linear-gradient(135deg, var(--account-ui-gold), var(--account-ui-orange)) !important;
  color: #111827 !important;
  box-shadow: 0 12px 24px rgba(249, 115, 22, .16) !important;
}
.account-main.account-auth-main .form-links {
  color: var(--account-ui-muted);
}
@media (max-width: 640px) {
  .account-main.account-auth-main .account-auth-card {
    border-radius: 18px !important;
  }
}

/* Current template state/modifier coverage after removing legacy split CSS. */
.account-main .account-titlebar__left{display:grid;gap:6px;min-width:0;}
.account-main .account-titlebar--ready{border-color:rgba(22,163,74,.26)!important;}
.account-main .reward-btn--wide,.account-main .share-submit-btn{width:100%;}
.account-main .reward-actions--hero{justify-content:flex-end;}
.account-main .reward-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin:0;}
.account-main .reward-section-head--center{text-align:center;justify-content:center;}
.account-main .reward-section-head--compact{margin-bottom:10px;}
.account-main .reward-section-head--shop{align-items:center;}
.account-main .reward-alert--warn{background:#fff7ed!important;color:#92400e!important;border-color:rgba(245,158,11,.26)!important;}
.account-main .reward-card--primary,.account-main .reward-panel--vp-shop{border-color:rgba(245,158,11,.30)!important;background:linear-gradient(135deg,#fff7ed,#fff 72%)!important;}
.account-main .reward-vip-grid--shop{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.account-main .reward-milestone-grid--compact{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));}
.account-main .reward-status-list{display:grid;gap:8px;margin:0;padding:0;list-style:none;}
.account-main .is-locked{opacity:.66;filter:grayscale(.1);}
.account-main[data-page="daily-rewards"] .daily-task-row--fast{border-color:rgba(20,184,166,.28);}
.account-main[data-page="daily-rewards"] .daily-progress--chest{height:10px;margin:10px 0;}
.account-main[data-page="daily-rewards"] .daily-chest-card--ready{border-color:rgba(245,158,11,.38)!important;background:linear-gradient(135deg,#fff7ed,#fff 70%)!important;}
.account-main[data-page="daily-rewards"] .daily-chest-card--claimed{border-color:rgba(22,163,74,.24)!important;background:linear-gradient(135deg,#f0fdf4,#fff 70%)!important;}
.account-main .daily-stat-card--balance{border-color:rgba(245,158,11,.28)!important;background:linear-gradient(135deg,#fff7ed,#fff 72%)!important;}
.account-main .daily-stat-card--streak{border-color:rgba(37,99,235,.24)!important;background:linear-gradient(135deg,#eff6ff,#fff 72%)!important;}
.account-main[data-page="vote"] .vote-section-title{display:flex;align-items:center;gap:8px;margin:0;color:var(--account-ui-ink);font-size:clamp(20px,2vw,26px);font-weight:1000;}
.account-main[data-page="vote"] .vote-status-card{padding:clamp(15px,1.8vw,20px);}
.account-main[data-page="vote"] .vote-status-empty{margin:0;padding:14px;border:1px dashed rgba(148,163,184,.35);border-radius:14px;background:#f8fafc;}
.account-main[data-page="vote"] .vote-card__badges{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.account-main[data-page="vote"] .vote-card__actions--inline{align-items:center;}
.account-main[data-page="vote"] .vote-card__reward-pill{display:inline-flex;align-items:center;gap:6px;width:max-content;max-width:100%;padding:6px 10px;border-radius:999px;background:rgba(16,185,129,.12);color:#065f46;font-weight:950;}
.account-main[data-page="vote"] .vote-badge--auto,.account-main[data-page="vote"] .vote-notice--info{background:#eff6ff;color:#1d4ed8;border-color:rgba(37,99,235,.22);}
.account-main[data-page="vote"] .vote-notice__icon{flex:0 0 auto;margin-top:2px;}
.account-main[data-page="vote"] .vote-notice__content{display:grid;gap:2px;min-width:0;}
.account-main[data-page="vote"] .vote-notice__title{font-weight:1000;color:inherit;}
.account-main[data-page="vote"] .vote-notice__text{margin:0;color:inherit;opacity:.88;}
.account-main[data-page="share"] .share-wizard--facebook-flow .share-wizard-progress{grid-template-columns:repeat(5,minmax(0,1fr));}
.account-main[data-page="share"] .share-wizard-progress--five{grid-template-columns:repeat(5,minmax(0,1fr));}
.account-main[data-page="share"] .share-wizard-panel--platform,.account-main[data-page="share"] .share-wizard-panel--copy,.account-main[data-page="share"] .share-wizard-panel--groups,.account-main[data-page="share"] .share-wizard-panel--claim,.account-main[data-page="share"] .share-wizard-panel--note{min-height:0;}
.account-main[data-page="share"] .share-platform-grid--quick,.account-main[data-page="share"] .share-platform-grid--wizard{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));}
.account-main[data-page="share"] .share-platform-btn--facebook{border-color:rgba(37,99,235,.25);}.account-main[data-page="share"] .share-platform-btn--twitter{border-color:rgba(15,23,42,.20);}.account-main[data-page="share"] .share-platform-btn--reddit{border-color:rgba(249,115,22,.24);}.account-main[data-page="share"] .share-platform-btn--discord{border-color:rgba(99,102,241,.24);}.account-main[data-page="share"] .share-platform-btn--telegram{border-color:rgba(14,165,233,.24);}.account-main[data-page="share"] .share-platform-btn--whatsapp{border-color:rgba(34,197,94,.24);}
.account-main[data-page="share"] .share-action-row--wrap{flex-wrap:wrap;}.account-main[data-page="share"] .share-submit-note,.account-main[data-page="share"] .share-copy-status{color:var(--account-ui-muted);font-size:12px;font-weight:800;}.account-main[data-page="share"] .share-copy-status--inline{display:inline-flex;align-items:center;gap:6px;}
.account-main[data-page="share"] .share-final-text--readonly{cursor:copy;}.account-main[data-page="share"] .share-selected-platform--quick,.account-main[data-page="share"] .share-empty-state--compact{padding:10px 12px;}.account-main[data-page="share"] .share-step-warning--urgent,.account-main[data-page="share"] .share-step-warning--facebook{border-color:rgba(245,158,11,.34);}.account-main[data-page="share"] .share-step-warning__body{display:grid;gap:4px;}
.account-main[data-page="share"] .share-proof-field{display:grid;gap:6px;}.account-main[data-page="share"] .share-proof-queue__head{display:flex;align-items:center;justify-content:space-between;gap:10px;}.account-main[data-page="share"] .share-hidden-inputs{display:none!important;}
.account-main[data-page="share"] .share-fb-group-card__badge{display:inline-flex;width:max-content;padding:4px 7px;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:11px;font-weight:1000;}.account-main[data-page="share"] .share-fb-group-card__hint{color:var(--account-ui-muted);font-size:12px;font-weight:750;}
.account-main[data-page="share"] .share-history-panel--clear{background:transparent!important;box-shadow:none!important;}.account-main[data-page="share"] .share-history-panel--table{padding:0!important;overflow:hidden;}.account-main[data-page="share"] .share-history-row{vertical-align:top;}.account-main[data-page="share"] .share-history-date,.account-main[data-page="share"] .share-history-platform{font-weight:900;color:var(--account-ui-ink);}.account-main[data-page="share"] .share-history-reject{color:#991b1b;font-weight:900;}
.account-main[data-page="share"] .share-col-date{width:150px;}.account-main[data-page="share"] .share-col-platform{width:130px;}.account-main[data-page="share"] .share-col-status,.account-main[data-page="share"] .share-col-reward{width:120px;}.account-main[data-page="share"] .share-col-url{width:210px;}.account-main[data-page="share"] .share-col-text{min-width:260px;}
.account-main[data-page="invite"] .invite-reward-hero,.account-main[data-page="invite"] .invite-milestone-card{border-color:rgba(245,158,11,.25)!important;background:linear-gradient(135deg,#fff7ed,#fff 74%)!important;}.account-main[data-page="invite"] .invite-stat--primary{border-color:rgba(245,158,11,.30);background:#fff7ed;}.account-main[data-page="invite"] .invite-hint,.account-main[data-page="invite"] .invite-social-reward-note{color:var(--account-ui-muted);font-size:13px;font-weight:750;}.account-main[data-page="invite"] .invite-copy-feedback,.account-main[data-page="invite"] .invite-copied{color:#166534;font-weight:900;}
.account-main[data-page="vip-vote-shop"] .vip-shop-summary,.account-main .vp-system-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;}
.account-main .vp-overview-panel--ledger{overflow:hidden;}
@media (max-width:760px){.account-main .reward-section-head{flex-direction:column;}.account-main[data-page="share"] .share-wizard-progress--five,.account-main[data-page="share"] .share-wizard--facebook-flow .share-wizard-progress{grid-template-columns:1fr;}.account-main[data-page="vote"] .vote-status-table{min-width:760px;}}

/* 2026-06-05 vote page final desktop cleanup
   Keeps /account/vote visually aligned with the other account pages and
   prevents the primary vote CTA from being rendered as a tiny secondary pill. */
.account-main[data-page="vote"] .vote-wrap {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: grid !important;
  gap: 18px !important;
  padding: clamp(20px, 2.1vw, 28px) !important;
  border-radius: var(--account-card-radius, 22px) !important;
  border: 1px solid rgba(20, 28, 45, .08) !important;
  background: #fff !important;
  box-shadow: 0 12px 30px rgba(20, 28, 45, .06) !important;
}

.account-main[data-page="vote"] .vote-sites-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
  width: 100% !important;
}

.account-main[data-page="vote"] .vote-card {
  position: relative !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-columns: 132px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: clamp(18px, 2vw, 26px) !important;
  min-height: 172px !important;
  padding: clamp(22px, 2.2vw, 30px) !important;
  border-radius: 22px !important;
  border: 1px solid rgba(20, 28, 45, .08) !important;
  background: linear-gradient(135deg, #ffffff 0%, #ffffff 58%, #fff8eb 100%) !important;
  box-shadow: 0 10px 24px rgba(20, 28, 45, .055) !important;
}

.account-main[data-page="vote"] .vote-card__badges {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 2 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  align-items: center !important;
  pointer-events: none !important;
}

.account-main[data-page="vote"] .vote-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 28px !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(37, 99, 235, .20) !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
}

.account-main[data-page="vote"] .vote-card__media {
  min-height: 124px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(20, 28, 45, .08) !important;
  background: linear-gradient(135deg, #f8fafc, #fff) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9) !important;
}

.account-main[data-page="vote"] .vote-card__media img {
  width: auto !important;
  height: auto !important;
  max-width: 112px !important;
  max-height: 76px !important;
  object-fit: contain !important;
}

.account-main[data-page="vote"] .vote-card__body {
  display: grid !important;
  gap: 14px !important;
  min-width: 0 !important;
  padding-right: 108px !important;
}

.account-main[data-page="vote"] .vote-card__title {
  margin: 0 !important;
  font-size: clamp(24px, 2.1vw, 32px) !important;
  line-height: 1.08 !important;
  font-weight: 1000 !important;
  letter-spacing: -.03em !important;
}

.account-main[data-page="vote"] .vote-card__title a {
  color: #171d2b !important;
  text-decoration: none !important;
}

.account-main[data-page="vote"] .vote-card__reward-pill {
  width: max-content !important;
  max-width: 100% !important;
  min-height: 34px !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(16, 185, 129, .20) !important;
  background: rgba(16, 185, 129, .10) !important;
  color: #065f46 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

.account-main[data-page="vote"] .vote-card__actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 2px !important;
}

.account-main[data-page="vote"] .vote-card__actions .vote-btn,
.account-main[data-page="vote"] .vote-card__actions .reward-secondary-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  min-height: 52px !important;
  padding: 14px 22px !important;
  border-radius: 16px !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.account-main[data-page="vote"] .vote-card__actions .vote-btn {
  min-width: 220px !important;
  background: linear-gradient(135deg, #d2a648, #9a6b16) !important;
  border: 1px solid rgba(154, 107, 22, .22) !important;
  color: #fff !important;
  box-shadow: 0 12px 20px rgba(154, 107, 22, .22) !important;
}

.account-main[data-page="vote"] .vote-card__actions .vote-btn:not(:disabled):hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 16px 26px rgba(154, 107, 22, .26) !important;
}

.account-main[data-page="vote"] .vote-card__actions .reward-secondary-btn {
  min-width: 172px !important;
  border: 1px solid rgba(20, 28, 45, .10) !important;
  background: #f8fafc !important;
  color: #273141 !important;
  box-shadow: 0 8px 16px rgba(20, 28, 45, .045) !important;
}

.account-main[data-page="vote"] .vote-btn__icon,
.account-main[data-page="vote"] .vote-btn__label,
.account-main[data-page="vote"] .countdown-txt {
  display: inline-flex !important;
  align-items: center !important;
}

.account-main[data-page="vote"] .vote-status-card {
  padding: clamp(20px, 2.1vw, 28px) !important;
}

.account-main[data-page="vote"] .vote-status-table-wrap {
  border: 1px solid rgba(20, 28, 45, .08) !important;
  border-radius: 18px !important;
  background: #fff !important;
}

.account-main[data-page="vote"] .vote-status-table {
  min-width: 0 !important;
  width: 100% !important;
}

@media (max-width: 980px) {
  .account-main[data-page="vote"] .vote-card {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
  }
  .account-main[data-page="vote"] .vote-card__body {
    padding-right: 0 !important;
  }
  .account-main[data-page="vote"] .vote-card__badges {
    position: static !important;
    justify-content: flex-start !important;
    order: -2 !important;
  }
  .account-main[data-page="vote"] .vote-card__media {
    min-height: 96px !important;
  }
  .account-main[data-page="vote"] .vote-card__actions .vote-btn,
  .account-main[data-page="vote"] .vote-card__actions .reward-secondary-btn {
    width: 100% !important;
    min-width: 0 !important;
  }
}

@media (max-width: 1180px) and (min-width: 981px) {
  .account-main[data-page="vote"] .vote-card__body {
    padding-right: 72px !important;
  }
}