:root {
  --xj-ocean-light:url('/assets/subscription/storefront/xiaojing-glass-20261111/ocean-vector.svg');
  --xj-ocean-dark:url('/assets/brand/xiaojing-ocean-dark.svg?v=20261109-theme-1');
}

/* Shared customer theme. Existing page layouts and controls retain their own sizes. */
body.xiaojing-theme {
  --xj-bg:#f4f7fc;
  --xj-paper:#fff;
  --xj-panel-surface:rgba(255,255,255,.93);
  --xj-soft:#eef4ff;
  --xj-line:#dce6f4;
  --xj-ink:#15233d;
  --xj-muted:#4c607a;
  --xj-blue:#194bc8;
  --xj-on-blue:#fff;
  --md-primary:var(--xj-blue);
  --md-primary-rgb:25,75,200;
  --md-primary-hover:#143da7;
  --md-primary-container:var(--xj-soft);
  --md-on-primary:var(--xj-on-blue);
  --md-bg:var(--xj-bg);
  --md-surface:var(--xj-paper);
  --md-surface-2:var(--xj-soft);
  --md-on-surface:var(--xj-ink);
  --md-on-surface-med:var(--xj-muted);
  --md-on-surface-dis:var(--xj-muted);
  --md-outline:var(--xj-line);
  --md-divider:var(--xj-line);
  --md-focus-ring:rgba(25,75,200,.18);
  --md-nav-fg:var(--xj-muted);
  --md-nav-active-fg:var(--xj-blue);
  --md-nav-section:var(--xj-muted);
  --bs-body-color:var(--xj-ink);
  --bs-body-bg:var(--xj-bg);
  --bs-border-color:var(--xj-line);
  --bs-primary:var(--xj-blue);
  --bs-primary-rgb:25,75,200;
  --bs-link-color:var(--xj-blue);
  --bs-link-hover-color:#143da7;
  --uc-ink:var(--xj-ink);
  --uc-ink-med:var(--xj-muted);
  --uc-ink-dis:var(--xj-muted);
  --uc-primary-deep:var(--xj-blue);
  --uc-focus:var(--xj-blue);
  --uc-focus-rgb:25,75,200;
  --uc-field-bg:var(--xj-soft);
  --glass-bg:var(--xj-paper);
  --glass-bg-strong:var(--xj-paper);
  --glass-bg-soft:var(--xj-soft);
  --glass-border:var(--xj-line);
  --glass-border-soft:var(--xj-line);
  --glass-hi:none;
  --glass-filter:none;
  --glass-filter-strong:none;
  --glass-shadow:0 8px 26px rgba(24,55,107,.055);
  --glass-shadow-lg:0 14px 38px rgba(24,55,107,.12);
  --blue:var(--xj-blue);
  --blue-dark:#143da7;
  --ink:var(--xj-ink);
  --muted:var(--xj-muted);
  --line:var(--xj-line);
  --pale:var(--xj-soft);
  min-height:100vh;
  color:var(--xj-ink);
  background-color:var(--xj-bg);
  background-image:var(--xj-ocean-light);
  background-position:center top;
  background-repeat:no-repeat;
  background-size:100% 100%;
  background-attachment:fixed;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
}
:root[data-theme="dark"] body.xiaojing-theme {
  --xj-bg:#101929;
  --xj-paper:#17243a;
  --xj-panel-surface:var(--xj-paper);
  --xj-soft:#20324e;
  --xj-line:#334662;
  --xj-ink:#edf4ff;
  --xj-muted:#bdcce0;
  --xj-blue:#a6c4ff;
  --xj-on-blue:#0e2145;
  --md-primary-rgb:166,196,255;
  --md-primary-hover:#bdd4ff;
  --md-focus-ring:rgba(166,196,255,.22);
  --uc-focus-rgb:166,196,255;
  --bs-primary-rgb:166,196,255;
  --bs-link-hover-color:#bdd4ff;
  --blue-dark:#bdd4ff;
  --glass-shadow:0 8px 26px rgba(0,0,0,.16);
  --glass-shadow-lg:0 14px 38px rgba(0,0,0,.25);
  color-scheme:dark;
  background-image:var(--xj-ocean-dark);
  background-size:cover;
}
:root[data-theme] body.xiaojing-theme .bg-content.uc-bg {background:transparent!important;}
:root[data-theme] body.xiaojing-theme .uc-nav,
:root[data-theme] body.xiaojing-theme .uc-card {border-color:var(--xj-line);}
:root[data-theme] body.xiaojing-theme.xj-member .uc-card {background-color:var(--xj-panel-surface);}
:root[data-theme] body.xiaojing-theme .uc-submenu {background:var(--xj-paper);border-color:var(--xj-line);}
:root[data-theme] body.xiaojing-theme .uc-user__btn {background:var(--xj-soft);border-color:var(--xj-line);}
:root[data-theme] body.xiaojing-theme .uc-user__btn:hover {background:var(--xj-paper);}
:root[data-theme] body.xiaojing-theme .uc-nav__item.active,
:root[data-theme] body.xiaojing-theme .uc-nav__item.active:hover {background:var(--xj-blue);color:var(--xj-on-blue);box-shadow:none;}
body.xiaojing-theme :is(a,button,input,textarea,select,summary):focus-visible {outline-color:var(--xj-blue);}
:root[data-theme] body.xiaojing-theme :is(.uc-ticket-empty,.uc-ticket-error) p {width:100%;max-width:410px;white-space:normal;overflow-wrap:anywhere;}

/* Paid card delivery actions in the member center. */
:root[data-theme] body.xj-member .md-secret__bar--redeem {flex-wrap:wrap;align-items:center;justify-content:flex-start;}
:root[data-theme] body.xj-member .md-secret__redeem {
  margin-inline-start:auto;
  min-height:42px;
  padding:8px 16px;
  justify-content:center;
  gap:8px;
  border-radius:9px;
  border-color:#087256;
  background:#087256;
  color:#fff;
  font-weight:700;
}
:root[data-theme] body.xj-member .md-secret__redeem:hover {background:#065a45;border-color:#065a45;color:#fff;}
:root[data-theme] body.xj-member .md-secret__redeem:focus-visible {outline:2px solid var(--xj-blue);outline-offset:3px;}
:root[data-theme="dark"] body.xj-member .md-secret__redeem {background:#87e5bb;border-color:#87e5bb;color:#0d3526;}
:root[data-theme="dark"] body.xj-member .md-secret__redeem:hover {background:#a9f1d1;border-color:#a9f1d1;}
@media (max-width:479px) {
  :root[data-theme] body.xj-member .md-secret__redeem {flex-basis:100%;margin-inline-start:0;}
}

/* Authentication shares the background and readable form surfaces. */
.xj-auth .auth-wrapper {background:transparent;}
.xj-auth .auth-card {color:var(--xj-ink);background:var(--xj-panel-surface);border-color:var(--xj-line);box-shadow:var(--glass-shadow-lg);backdrop-filter:none;}
.xj-auth :is(.auth-title,.brand-title) {color:var(--xj-ink);}
.xj-auth .auth-subtitle,.xj-auth .form-floating > label {color:var(--xj-muted);}
.xj-auth .form-check label {color:var(--xj-muted);}
.xj-auth :is(.form-control,.form-floating > .form-control) {color:var(--xj-ink);background-color:var(--xj-soft);border-color:var(--xj-line);}
.xj-auth .form-control:focus {color:var(--xj-ink);background-color:var(--xj-paper);border-color:var(--xj-blue);box-shadow:0 0 0 .2rem var(--md-focus-ring);}
.xj-auth .form-floating > label::after {background-color:transparent!important;}
.xj-auth .btn-gradient {background:var(--xj-blue);color:var(--xj-on-blue);box-shadow:0 6px 18px var(--md-focus-ring);}
.xj-auth .text-link {color:var(--xj-blue);}

/* Standalone order, support and legacy redemption pages. */
.xiaojing-theme.xj-portal .uc-card,
.xiaojing-theme .redeem-shell,
.xiaojing-theme .payment-card {color:var(--xj-ink);background:var(--xj-panel-surface);border-color:var(--xj-line);box-shadow:var(--glass-shadow);}
.xiaojing-theme .redeem-mark {background:var(--xj-blue);color:var(--xj-on-blue);}
.xiaojing-theme.redeem-body :is(input,textarea,.redeem-secondary,.redeem-steps span) {color:var(--xj-ink);background:var(--xj-paper);border-color:var(--xj-line);}
.xiaojing-theme .redeem-primary {background:var(--xj-blue);color:var(--xj-on-blue);}
.xiaojing-theme .redeem-summary,.xiaojing-theme .redeem-notice:not(.is-maintenance) {color:var(--xj-muted);background:var(--xj-soft);border-color:var(--xj-line);}
.xiaojing-theme.xj-portal :is(input,select,textarea) {color:var(--xj-ink);background:var(--xj-soft);border-color:var(--xj-line);}
.xiaojing-theme.xj-portal button {background:var(--xj-blue);color:var(--xj-on-blue);}
.xiaojing-theme.xj-portal :is(p,td,th) {color:var(--xj-muted);}
.xiaojing-theme.xj-cashier .brand > a,
.xiaojing-theme.xj-portal a,
.xiaojing-theme.xj-cashier .text-button {color:var(--xj-blue);}
.xiaojing-theme.xj-cashier a {color:var(--xj-blue);}
.xiaojing-theme.xj-cashier :is(.instructions p,.muted,.field-label,.qr-caption,.network-badge,.footer-note,.payment-more,.payment-more summary,.order-details dt,.status-panel p,.brand div > span) {color:var(--xj-muted);}
.xiaojing-theme.xj-cashier .instructions p {border-color:var(--xj-line);}
.xiaojing-theme.xj-cashier .instructions b {color:var(--xj-blue);}
.xiaojing-theme.xj-cashier :is(.card-heading h1,.transfer-title) {color:var(--xj-blue);}
.xiaojing-theme.xj-cashier :is(.qr-panel,.order-info,.payment-help) {background:var(--xj-paper);border-color:var(--xj-line);}
.xiaojing-theme.xj-cashier .address {color:var(--xj-ink);background:var(--xj-soft);border-color:var(--xj-line);}
.xiaojing-theme.xj-cashier :is(.copy-button,#copy-amount) {background:var(--xj-soft);color:var(--xj-blue);border-color:var(--xj-line);}
.xiaojing-theme.xj-cashier .hash-row button {background:var(--xj-blue);color:var(--xj-on-blue);}
.xiaojing-theme.xj-cashier .hash-row input {color:var(--xj-ink);background:var(--xj-paper);border-color:var(--xj-line);}
.xiaojing-theme.xj-cashier [data-state="Paid"] .card-heading h1 {color:#18794e;}
body.xiaojing-theme.xj-submit {display:grid;place-items:center;margin:0;}
.xj-submit > p {padding:22px 28px;border:1px solid var(--xj-line);border-radius:14px;background:var(--xj-paper);box-shadow:var(--glass-shadow);}
.xj-closed {display:grid;place-items:center;margin:0;padding:24px;box-sizing:border-box;}
.xj-closed .closed-card {max-width:560px;padding:40px 32px;text-align:center;color:var(--xj-ink);background:var(--xj-paper);border:1px solid var(--xj-line);border-radius:20px;box-shadow:var(--glass-shadow-lg);overflow-wrap:anywhere;}
.xj-closed .closed-card img {width:64px;height:64px;margin-bottom:16px;}
.xj-closed .closed-card h1 {font-size:clamp(20px,4vw,28px);line-height:1.6;margin:0;}
.xj-closed .closed-card p {font-size:14px;color:var(--xj-muted);}
:root[data-theme="dark"] .xiaojing-theme.xj-cashier :is(.payment-success,.success-dialog) {color:#d1f4df;background:#17392f;border-color:#396a55;}
:root[data-theme="dark"] .xiaojing-theme.xj-cashier :is(.success-amount,.payment-success h2,.success-dialog h2) {color:#b8efd0;}
/* The shop's default admin wallpaper follows the same theme. */
html[data-theme] body#kt_body.xj-admin-ocean {
  background:var(--xj-ocean-light) center top/100% 100% no-repeat fixed var(--md-bg)!important;
}
html[data-theme="dark"] body#kt_body.xj-admin-ocean {
  background-image:var(--xj-ocean-dark)!important;
  background-size:cover!important;
}
.lk.lk--xiaojing .lk-wall {
  --lk-wall:var(--xj-ocean-light);
}
html[data-theme="dark"] .lk.lk--xiaojing .lk-wall {
  --lk-wall:var(--xj-ocean-dark);
}
html:not([data-theme="dark"]) .lk.lk--xiaojing {
  --lk-ink:#15233d;
  --lk-ink-soft:#4c607a;
  --lk-ink-hi:var(--lk-ink);
  --lk-ink-lo:var(--lk-ink-soft);
  --lk-wall-base:#eef4ff;
  --lk-ink-shadow:none;
  --lk-ink-glow:none;
  --lk-shade:none;
}
html:not([data-theme="dark"]) .lk--xiaojing :is(.lk-wall__img,.lk-wall__blur) {
  background-size:100% 100%;
}
@media (max-width:767px), (hover:none) and (pointer:coarse) {
  body.xiaojing-theme {background-attachment:scroll;}
  html[data-theme] body#kt_body.xj-admin-ocean {background-attachment:scroll!important;}
}