html{box-sizing:border-box;-webkit-text-size-adjust:100%}*,*::before,*::after{box-sizing:inherit}body{margin:0}button,input{font:inherit}
/* MUI(CssBaseline + theme)负责重置与配色;这里只补全局字体平滑与满高。 */
html,
body {
  height: 100%;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: var(--ds-bg);
}

::selection {
  color: var(--xm-on-accent);
  background: var(--xm-accent-fill);
}

* {
  scrollbar-color: var(--xm-scrollbar) transparent;
  scrollbar-width: thin;
}

/* App 手感:整页不做橡皮筋/下拉刷新,滚动只发生在 AppShell 内部容器。 */
html,
body {
  overscroll-behavior: none;
}

/* 去掉双击缩放延迟(捏合缩放保留);交互元素统一走 manipulation。 */
a,
button,
input,
select,
textarea,
summary,
label,
[role='button'],
[role='tab'],
[role='menuitem'] {
  touch-action: manipulation;
}

/* 操作类外壳不可选中、不弹系统长按菜单;正文(订单号、账号等)仍可选中复制。 */
button,
[role='button'],
[role='tab'],
nav a,
.xme-topbar,
.xme-nav {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

img {
  -webkit-user-drag: none;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (max-width: 1023.95px) {
  input, select, textarea { font-size: 16px; }
  /* Component font shorthands must not restore sub-16px text on focusable controls.
     Keep user/pinch zoom enabled and preserve larger inherited text. */
  input:not([type='checkbox']):not([type='radio']):not([type='range']):not([type='color']):not([type='button']):not([type='submit']):not([type='reset']):not([type='image']):not([type='hidden']),
  select,
  textarea {
    font-size: max(16px, 1em) !important;
  }
  button, a, [role="button"] { -webkit-tap-highlight-color: transparent; }
  #main-content { scroll-padding-top: 16px; }
}

:root,
:root[data-color-mode='light'][data-accent='plum'] {
  color-scheme: light;
  --ds-bg: #f5f6f8;
  --ds-panel: #ffffff;
  --ds-panelSoft: #f8f9fb;
  --ds-border: #e2e5ea;
  --ds-borderSoft: #edf0f3;
  --ds-divider: #d4d9e1;
  --ds-textXL: #191a1d;
  --ds-text: #191a1d;
  --ds-textMid: #586174;
  --ds-textDim: #667085;
  --ds-textFaint: #697386;
  --ds-brand: #672d3d;
  --ds-brandLight: #672d3d;
  --ds-brandDark: #672d3d;
  --ds-brandWash: color-mix(in srgb, #672d3d 8%, white);
  --ds-copper: #b96d3e;
  --ds-copperWash: rgba(185, 109, 62, 0.1);
  --ds-plum: #672d3d;
  --ds-plumLight: #672d3d;
  --ds-plumDark: #672d3d;
  --ds-plumWash: color-mix(in srgb, #672d3d 8%, white);
  --ds-okBg: rgba(35, 112, 68, 0.1);
  --ds-okText: #237044;
  --ds-okDot: #237044;
  --ds-warnBg: rgba(138, 71, 13, 0.1);
  --ds-warnText: #8a470d;
  --ds-warnDot: #8a470d;
  --ds-badBg: rgba(181, 47, 38, 0.08);
  --ds-badText: #b52f26;
  --ds-badDot: #b52f26;
  --ds-offBg: rgba(0, 0, 0, 0.05);
  --ds-offText: #706b64;
  --ds-offDot: #706b64;
  --ds-infoBg: rgba(40, 92, 199, 0.09);
  --ds-infoText: #285cc7;
  --ds-infoDot: #285cc7;
  --ds-pipeBg: rgba(11, 100, 125, 0.08);
  --ds-pipeText: #0b647d;
  --ds-pipeDot: #0b647d;
  --ds-shadowSm: 0 1px 2px rgba(41, 28, 24, 0.06);
  --ds-shadowMd: 0 12px 32px -16px rgba(50, 31, 25, 0.24), 0 2px 8px rgba(41, 28, 24, 0.05);
  --ds-shadowLg: 0 28px 64px -24px rgba(50, 31, 25, 0.32);
  --xm-accent: #672d3d;
  --xm-accent-fill: #672d3d;
  --xm-on-accent: #ffffff;
  --xm-surface: #ffffff;
  --xm-canvas: #fafaf9;
  --xm-text: #20252c;
  --xm-muted: #626b76;
  --xm-border: #e1e3e6;
  --xm-soft: #f8f9fb;
  --xm-line-soft: #eceef0;
  --xm-input-border: #cdd2d9;
  --xm-success: #256b48;
  --xm-success-bg: #edf6f0;
  --xm-warning: #8a470d;
  --xm-warning-bg: #fff4e2;
  --xm-danger: #a52831;
  --xm-danger-bg: #fcecef;
  --xm-info: #245f96;
  --xm-info-bg: #edf4fc;
  --xm-neutral-bg: #f0f1f3;
  --xm-toggle-track: #7e8895;
  --xm-toggle-thumb: #fff;
  --xm-overlay: #20252c55;
  --xm-placeholder: #727a84;
  --xm-scrollbar: #8b96a6;
}
:root[data-color-mode='light'][data-accent='blue'] {
  color-scheme: light;
  --ds-bg: #f5f6f8;
  --ds-panel: #ffffff;
  --ds-panelSoft: #f8f9fb;
  --ds-border: #e2e5ea;
  --ds-borderSoft: #edf0f3;
  --ds-divider: #d4d9e1;
  --ds-textXL: #191a1d;
  --ds-text: #191a1d;
  --ds-textMid: #586174;
  --ds-textDim: #667085;
  --ds-textFaint: #697386;
  --ds-brand: #2458a6;
  --ds-brandLight: #2458a6;
  --ds-brandDark: #2458a6;
  --ds-brandWash: color-mix(in srgb, #2458a6 8%, white);
  --ds-copper: #b96d3e;
  --ds-copperWash: rgba(185, 109, 62, 0.1);
  --ds-plum: #2458a6;
  --ds-plumLight: #2458a6;
  --ds-plumDark: #2458a6;
  --ds-plumWash: color-mix(in srgb, #2458a6 8%, white);
  --ds-okBg: rgba(35, 112, 68, 0.1);
  --ds-okText: #237044;
  --ds-okDot: #237044;
  --ds-warnBg: rgba(138, 71, 13, 0.1);
  --ds-warnText: #8a470d;
  --ds-warnDot: #8a470d;
  --ds-badBg: rgba(181, 47, 38, 0.08);
  --ds-badText: #b52f26;
  --ds-badDot: #b52f26;
  --ds-offBg: rgba(0, 0, 0, 0.05);
  --ds-offText: #706b64;
  --ds-offDot: #706b64;
  --ds-infoBg: rgba(40, 92, 199, 0.09);
  --ds-infoText: #285cc7;
  --ds-infoDot: #285cc7;
  --ds-pipeBg: rgba(11, 100, 125, 0.08);
  --ds-pipeText: #0b647d;
  --ds-pipeDot: #0b647d;
  --ds-shadowSm: 0 1px 2px rgba(41, 28, 24, 0.06);
  --ds-shadowMd: 0 12px 32px -16px rgba(50, 31, 25, 0.24), 0 2px 8px rgba(41, 28, 24, 0.05);
  --ds-shadowLg: 0 28px 64px -24px rgba(50, 31, 25, 0.32);
  --xm-accent: #2458a6;
  --xm-accent-fill: #2458a6;
  --xm-on-accent: #ffffff;
  --xm-surface: #ffffff;
  --xm-canvas: #fafaf9;
  --xm-text: #20252c;
  --xm-muted: #626b76;
  --xm-border: #e1e3e6;
  --xm-soft: #f8f9fb;
  --xm-line-soft: #eceef0;
  --xm-input-border: #cdd2d9;
  --xm-success: #256b48;
  --xm-success-bg: #edf6f0;
  --xm-warning: #8a470d;
  --xm-warning-bg: #fff4e2;
  --xm-danger: #a52831;
  --xm-danger-bg: #fcecef;
  --xm-info: #245f96;
  --xm-info-bg: #edf4fc;
  --xm-neutral-bg: #f0f1f3;
  --xm-toggle-track: #7e8895;
  --xm-toggle-thumb: #fff;
  --xm-overlay: #20252c55;
  --xm-placeholder: #727a84;
  --xm-scrollbar: #8b96a6;
}
:root[data-color-mode='light'][data-accent='green'] {
  color-scheme: light;
  --ds-bg: #f5f6f8;
  --ds-panel: #ffffff;
  --ds-panelSoft: #f8f9fb;
  --ds-border: #e2e5ea;
  --ds-borderSoft: #edf0f3;
  --ds-divider: #d4d9e1;
  --ds-textXL: #191a1d;
  --ds-text: #191a1d;
  --ds-textMid: #586174;
  --ds-textDim: #667085;
  --ds-textFaint: #697386;
  --ds-brand: #17675c;
  --ds-brandLight: #17675c;
  --ds-brandDark: #17675c;
  --ds-brandWash: color-mix(in srgb, #17675c 8%, white);
  --ds-copper: #b96d3e;
  --ds-copperWash: rgba(185, 109, 62, 0.1);
  --ds-plum: #17675c;
  --ds-plumLight: #17675c;
  --ds-plumDark: #17675c;
  --ds-plumWash: color-mix(in srgb, #17675c 8%, white);
  --ds-okBg: rgba(35, 112, 68, 0.1);
  --ds-okText: #237044;
  --ds-okDot: #237044;
  --ds-warnBg: rgba(138, 71, 13, 0.1);
  --ds-warnText: #8a470d;
  --ds-warnDot: #8a470d;
  --ds-badBg: rgba(181, 47, 38, 0.08);
  --ds-badText: #b52f26;
  --ds-badDot: #b52f26;
  --ds-offBg: rgba(0, 0, 0, 0.05);
  --ds-offText: #706b64;
  --ds-offDot: #706b64;
  --ds-infoBg: rgba(40, 92, 199, 0.09);
  --ds-infoText: #285cc7;
  --ds-infoDot: #285cc7;
  --ds-pipeBg: rgba(11, 100, 125, 0.08);
  --ds-pipeText: #0b647d;
  --ds-pipeDot: #0b647d;
  --ds-shadowSm: 0 1px 2px rgba(41, 28, 24, 0.06);
  --ds-shadowMd: 0 12px 32px -16px rgba(50, 31, 25, 0.24), 0 2px 8px rgba(41, 28, 24, 0.05);
  --ds-shadowLg: 0 28px 64px -24px rgba(50, 31, 25, 0.32);
  --xm-accent: #17675c;
  --xm-accent-fill: #17675c;
  --xm-on-accent: #ffffff;
  --xm-surface: #ffffff;
  --xm-canvas: #fafaf9;
  --xm-text: #20252c;
  --xm-muted: #626b76;
  --xm-border: #e1e3e6;
  --xm-soft: #f8f9fb;
  --xm-line-soft: #eceef0;
  --xm-input-border: #cdd2d9;
  --xm-success: #256b48;
  --xm-success-bg: #edf6f0;
  --xm-warning: #8a470d;
  --xm-warning-bg: #fff4e2;
  --xm-danger: #a52831;
  --xm-danger-bg: #fcecef;
  --xm-info: #245f96;
  --xm-info-bg: #edf4fc;
  --xm-neutral-bg: #f0f1f3;
  --xm-toggle-track: #7e8895;
  --xm-toggle-thumb: #fff;
  --xm-overlay: #20252c55;
  --xm-placeholder: #727a84;
  --xm-scrollbar: #8b96a6;
}
:root[data-color-mode='light'][data-accent='slate'] {
  color-scheme: light;
  --ds-bg: #f5f6f8;
  --ds-panel: #ffffff;
  --ds-panelSoft: #f8f9fb;
  --ds-border: #e2e5ea;
  --ds-borderSoft: #edf0f3;
  --ds-divider: #d4d9e1;
  --ds-textXL: #191a1d;
  --ds-text: #191a1d;
  --ds-textMid: #586174;
  --ds-textDim: #667085;
  --ds-textFaint: #697386;
  --ds-brand: #48566b;
  --ds-brandLight: #48566b;
  --ds-brandDark: #48566b;
  --ds-brandWash: color-mix(in srgb, #48566b 8%, white);
  --ds-copper: #b96d3e;
  --ds-copperWash: rgba(185, 109, 62, 0.1);
  --ds-plum: #48566b;
  --ds-plumLight: #48566b;
  --ds-plumDark: #48566b;
  --ds-plumWash: color-mix(in srgb, #48566b 8%, white);
  --ds-okBg: rgba(35, 112, 68, 0.1);
  --ds-okText: #237044;
  --ds-okDot: #237044;
  --ds-warnBg: rgba(138, 71, 13, 0.1);
  --ds-warnText: #8a470d;
  --ds-warnDot: #8a470d;
  --ds-badBg: rgba(181, 47, 38, 0.08);
  --ds-badText: #b52f26;
  --ds-badDot: #b52f26;
  --ds-offBg: rgba(0, 0, 0, 0.05);
  --ds-offText: #706b64;
  --ds-offDot: #706b64;
  --ds-infoBg: rgba(40, 92, 199, 0.09);
  --ds-infoText: #285cc7;
  --ds-infoDot: #285cc7;
  --ds-pipeBg: rgba(11, 100, 125, 0.08);
  --ds-pipeText: #0b647d;
  --ds-pipeDot: #0b647d;
  --ds-shadowSm: 0 1px 2px rgba(41, 28, 24, 0.06);
  --ds-shadowMd: 0 12px 32px -16px rgba(50, 31, 25, 0.24), 0 2px 8px rgba(41, 28, 24, 0.05);
  --ds-shadowLg: 0 28px 64px -24px rgba(50, 31, 25, 0.32);
  --xm-accent: #48566b;
  --xm-accent-fill: #48566b;
  --xm-on-accent: #ffffff;
  --xm-surface: #ffffff;
  --xm-canvas: #fafaf9;
  --xm-text: #20252c;
  --xm-muted: #626b76;
  --xm-border: #e1e3e6;
  --xm-soft: #f8f9fb;
  --xm-line-soft: #eceef0;
  --xm-input-border: #cdd2d9;
  --xm-success: #256b48;
  --xm-success-bg: #edf6f0;
  --xm-warning: #8a470d;
  --xm-warning-bg: #fff4e2;
  --xm-danger: #a52831;
  --xm-danger-bg: #fcecef;
  --xm-info: #245f96;
  --xm-info-bg: #edf4fc;
  --xm-neutral-bg: #f0f1f3;
  --xm-toggle-track: #7e8895;
  --xm-toggle-thumb: #fff;
  --xm-overlay: #20252c55;
  --xm-placeholder: #727a84;
  --xm-scrollbar: #8b96a6;
}
:root[data-color-mode='dark'][data-accent='plum'] {
  color-scheme: dark;
  --ds-bg: #11151c;
  --ds-panel: #1b212b;
  --ds-panelSoft: #222a36;
  --ds-border: #3b4657;
  --ds-borderSoft: #303a49;
  --ds-divider: #566377;
  --ds-textXL: #edf1f7;
  --ds-text: #edf1f7;
  --ds-textMid: #bcc6d5;
  --ds-textDim: #a9b6c8;
  --ds-textFaint: #9aa8bc;
  --ds-brand: #e8adc0;
  --ds-brandLight: #e8adc0;
  --ds-brandDark: #834158;
  --ds-brandWash: color-mix(in srgb, #e8adc0 12%, #1b212b);
  --ds-copper: #e2ad86;
  --ds-copperWash: #342b25;
  --ds-plum: #e8adc0;
  --ds-plumLight: #e8adc0;
  --ds-plumDark: #834158;
  --ds-plumWash: color-mix(in srgb, #e8adc0 12%, #1b212b);
  --ds-okBg: #193b30;
  --ds-okText: #94d6b2;
  --ds-okDot: #94d6b2;
  --ds-warnBg: #3e3020;
  --ds-warnText: #efc18b;
  --ds-warnDot: #efc18b;
  --ds-badBg: #422731;
  --ds-badText: #ffb2bb;
  --ds-badDot: #ffb2bb;
  --ds-offBg: #2b3442;
  --ds-offText: #b9c4d3;
  --ds-offDot: #b9c4d3;
  --ds-infoBg: #20334e;
  --ds-infoText: #a3c7fa;
  --ds-infoDot: #a3c7fa;
  --ds-pipeBg: #1c3740;
  --ds-pipeText: #9ad8e5;
  --ds-pipeDot: #9ad8e5;
  --ds-shadowSm: 0 1px 2px #0003;
  --ds-shadowMd: 0 12px 32px -16px #0009;
  --ds-shadowLg: 0 28px 64px -24px #000b;
  --xm-accent: #e8adc0;
  --xm-accent-fill: #834158;
  --xm-on-accent: #ffffff;
  --xm-surface: #1b212b;
  --xm-canvas: #11151c;
  --xm-text: #edf1f7;
  --xm-muted: #bcc6d5;
  --xm-border: #3b4657;
  --xm-soft: #222a36;
  --xm-line-soft: #303a49;
  --xm-input-border: #566377;
  --xm-success: #94d6b2;
  --xm-success-bg: #193b30;
  --xm-warning: #efc18b;
  --xm-warning-bg: #3e3020;
  --xm-danger: #ffb2bb;
  --xm-danger-bg: #422731;
  --xm-info: #a3c7fa;
  --xm-info-bg: #20334e;
  --xm-neutral-bg: #2b3442;
  --xm-toggle-track: #627087;
  --xm-toggle-thumb: #fff;
  --xm-overlay: #0009;
  --xm-placeholder: #a9b6c8;
  --xm-scrollbar: #657388;
}
:root[data-color-mode='dark'][data-accent='blue'] {
  color-scheme: dark;
  --ds-bg: #11151c;
  --ds-panel: #1b212b;
  --ds-panelSoft: #222a36;
  --ds-border: #3b4657;
  --ds-borderSoft: #303a49;
  --ds-divider: #566377;
  --ds-textXL: #edf1f7;
  --ds-text: #edf1f7;
  --ds-textMid: #bcc6d5;
  --ds-textDim: #a9b6c8;
  --ds-textFaint: #9aa8bc;
  --ds-brand: #a1c5ff;
  --ds-brandLight: #a1c5ff;
  --ds-brandDark: #285a9e;
  --ds-brandWash: color-mix(in srgb, #a1c5ff 12%, #1b212b);
  --ds-copper: #e2ad86;
  --ds-copperWash: #342b25;
  --ds-plum: #a1c5ff;
  --ds-plumLight: #a1c5ff;
  --ds-plumDark: #285a9e;
  --ds-plumWash: color-mix(in srgb, #a1c5ff 12%, #1b212b);
  --ds-okBg: #193b30;
  --ds-okText: #94d6b2;
  --ds-okDot: #94d6b2;
  --ds-warnBg: #3e3020;
  --ds-warnText: #efc18b;
  --ds-warnDot: #efc18b;
  --ds-badBg: #422731;
  --ds-badText: #ffb2bb;
  --ds-badDot: #ffb2bb;
  --ds-offBg: #2b3442;
  --ds-offText: #b9c4d3;
  --ds-offDot: #b9c4d3;
  --ds-infoBg: #20334e;
  --ds-infoText: #a3c7fa;
  --ds-infoDot: #a3c7fa;
  --ds-pipeBg: #1c3740;
  --ds-pipeText: #9ad8e5;
  --ds-pipeDot: #9ad8e5;
  --ds-shadowSm: 0 1px 2px #0003;
  --ds-shadowMd: 0 12px 32px -16px #0009;
  --ds-shadowLg: 0 28px 64px -24px #000b;
  --xm-accent: #a1c5ff;
  --xm-accent-fill: #285a9e;
  --xm-on-accent: #ffffff;
  --xm-surface: #1b212b;
  --xm-canvas: #11151c;
  --xm-text: #edf1f7;
  --xm-muted: #bcc6d5;
  --xm-border: #3b4657;
  --xm-soft: #222a36;
  --xm-line-soft: #303a49;
  --xm-input-border: #566377;
  --xm-success: #94d6b2;
  --xm-success-bg: #193b30;
  --xm-warning: #efc18b;
  --xm-warning-bg: #3e3020;
  --xm-danger: #ffb2bb;
  --xm-danger-bg: #422731;
  --xm-info: #a3c7fa;
  --xm-info-bg: #20334e;
  --xm-neutral-bg: #2b3442;
  --xm-toggle-track: #627087;
  --xm-toggle-thumb: #fff;
  --xm-overlay: #0009;
  --xm-placeholder: #a9b6c8;
  --xm-scrollbar: #657388;
}
:root[data-color-mode='dark'][data-accent='green'] {
  color-scheme: dark;
  --ds-bg: #11151c;
  --ds-panel: #1b212b;
  --ds-panelSoft: #222a36;
  --ds-border: #3b4657;
  --ds-borderSoft: #303a49;
  --ds-divider: #566377;
  --ds-textXL: #edf1f7;
  --ds-text: #edf1f7;
  --ds-textMid: #bcc6d5;
  --ds-textDim: #a9b6c8;
  --ds-textFaint: #9aa8bc;
  --ds-brand: #8ed5c5;
  --ds-brandLight: #8ed5c5;
  --ds-brandDark: #206c60;
  --ds-brandWash: color-mix(in srgb, #8ed5c5 12%, #1b212b);
  --ds-copper: #e2ad86;
  --ds-copperWash: #342b25;
  --ds-plum: #8ed5c5;
  --ds-plumLight: #8ed5c5;
  --ds-plumDark: #206c60;
  --ds-plumWash: color-mix(in srgb, #8ed5c5 12%, #1b212b);
  --ds-okBg: #193b30;
  --ds-okText: #94d6b2;
  --ds-okDot: #94d6b2;
  --ds-warnBg: #3e3020;
  --ds-warnText: #efc18b;
  --ds-warnDot: #efc18b;
  --ds-badBg: #422731;
  --ds-badText: #ffb2bb;
  --ds-badDot: #ffb2bb;
  --ds-offBg: #2b3442;
  --ds-offText: #b9c4d3;
  --ds-offDot: #b9c4d3;
  --ds-infoBg: #20334e;
  --ds-infoText: #a3c7fa;
  --ds-infoDot: #a3c7fa;
  --ds-pipeBg: #1c3740;
  --ds-pipeText: #9ad8e5;
  --ds-pipeDot: #9ad8e5;
  --ds-shadowSm: 0 1px 2px #0003;
  --ds-shadowMd: 0 12px 32px -16px #0009;
  --ds-shadowLg: 0 28px 64px -24px #000b;
  --xm-accent: #8ed5c5;
  --xm-accent-fill: #206c60;
  --xm-on-accent: #ffffff;
  --xm-surface: #1b212b;
  --xm-canvas: #11151c;
  --xm-text: #edf1f7;
  --xm-muted: #bcc6d5;
  --xm-border: #3b4657;
  --xm-soft: #222a36;
  --xm-line-soft: #303a49;
  --xm-input-border: #566377;
  --xm-success: #94d6b2;
  --xm-success-bg: #193b30;
  --xm-warning: #efc18b;
  --xm-warning-bg: #3e3020;
  --xm-danger: #ffb2bb;
  --xm-danger-bg: #422731;
  --xm-info: #a3c7fa;
  --xm-info-bg: #20334e;
  --xm-neutral-bg: #2b3442;
  --xm-toggle-track: #627087;
  --xm-toggle-thumb: #fff;
  --xm-overlay: #0009;
  --xm-placeholder: #a9b6c8;
  --xm-scrollbar: #657388;
}
:root[data-color-mode='dark'][data-accent='slate'] {
  color-scheme: dark;
  --ds-bg: #11151c;
  --ds-panel: #1b212b;
  --ds-panelSoft: #222a36;
  --ds-border: #3b4657;
  --ds-borderSoft: #303a49;
  --ds-divider: #566377;
  --ds-textXL: #edf1f7;
  --ds-text: #edf1f7;
  --ds-textMid: #bcc6d5;
  --ds-textDim: #a9b6c8;
  --ds-textFaint: #9aa8bc;
  --ds-brand: #bdc9dd;
  --ds-brandLight: #bdc9dd;
  --ds-brandDark: #526079;
  --ds-brandWash: color-mix(in srgb, #bdc9dd 12%, #1b212b);
  --ds-copper: #e2ad86;
  --ds-copperWash: #342b25;
  --ds-plum: #bdc9dd;
  --ds-plumLight: #bdc9dd;
  --ds-plumDark: #526079;
  --ds-plumWash: color-mix(in srgb, #bdc9dd 12%, #1b212b);
  --ds-okBg: #193b30;
  --ds-okText: #94d6b2;
  --ds-okDot: #94d6b2;
  --ds-warnBg: #3e3020;
  --ds-warnText: #efc18b;
  --ds-warnDot: #efc18b;
  --ds-badBg: #422731;
  --ds-badText: #ffb2bb;
  --ds-badDot: #ffb2bb;
  --ds-offBg: #2b3442;
  --ds-offText: #b9c4d3;
  --ds-offDot: #b9c4d3;
  --ds-infoBg: #20334e;
  --ds-infoText: #a3c7fa;
  --ds-infoDot: #a3c7fa;
  --ds-pipeBg: #1c3740;
  --ds-pipeText: #9ad8e5;
  --ds-pipeDot: #9ad8e5;
  --ds-shadowSm: 0 1px 2px #0003;
  --ds-shadowMd: 0 12px 32px -16px #0009;
  --ds-shadowLg: 0 28px 64px -24px #000b;
  --xm-accent: #bdc9dd;
  --xm-accent-fill: #526079;
  --xm-on-accent: #ffffff;
  --xm-surface: #1b212b;
  --xm-canvas: #11151c;
  --xm-text: #edf1f7;
  --xm-muted: #bcc6d5;
  --xm-border: #3b4657;
  --xm-soft: #222a36;
  --xm-line-soft: #303a49;
  --xm-input-border: #566377;
  --xm-success: #94d6b2;
  --xm-success-bg: #193b30;
  --xm-warning: #efc18b;
  --xm-warning-bg: #3e3020;
  --xm-danger: #ffb2bb;
  --xm-danger-bg: #422731;
  --xm-info: #a3c7fa;
  --xm-info-bg: #20334e;
  --xm-neutral-bg: #2b3442;
  --xm-toggle-track: #627087;
  --xm-toggle-thumb: #fff;
  --xm-overlay: #0009;
  --xm-placeholder: #a9b6c8;
  --xm-scrollbar: #657388;
}
html,
body {
  background: var(--ds-bg);
  color: var(--ds-text);
}
* {
  scrollbar-color: var(--xm-scrollbar) transparent;
  scrollbar-width: thin;
}
::selection {
  background: var(--xm-accent-fill);
  color: white;
}

.tp{--tp-bg: #f7f8fc;--tp-surface: #ffffff;--tp-surface-hover: #f0f1f8;--tp-text: #1d2231;--tp-muted: #535e74;--tp-faint: #647087;--tp-line: #d8deeb;--tp-accent: #514acc;--tp-fill: #5953d9;--tp-on-fill: #fff;--tp-shadow: 0 16px 48px #1e25451c;--tp-overlay: #10172570;min-height:100svh;background:var(--tp-bg);color:var(--tp-text);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif;font-size:16px;line-height:1.5;font-weight:400;letter-spacing:0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);color-scheme:light}:root[data-color-mode=dark] .tp{--tp-bg: #0c0f13;--tp-surface: #10141b;--tp-surface-hover: #1a202c;--tp-text: #f4f5f8;--tp-muted: #b4bbcc;--tp-faint: #919db3;--tp-line: #2b3342;--tp-accent: #a0a4ff;--tp-fill: #979bff;--tp-on-fill: #101325;--tp-shadow: 0 16px 48px #0005;--tp-overlay: #0009;color-scheme:dark}.tp *,.tp *:before,.tp *:after{box-sizing:border-box}.tp [hidden]{display:none!important}.tp h1,.tp h2,.tp h3,.tp p{margin:0}.tp a{color:inherit;text-decoration:none}.tp button{font:inherit;color:inherit;cursor:pointer;border:0;padding:0;background:none}.tp img{display:block;max-width:100%;image-rendering:-webkit-optimize-contrast}.tp :is(a,button):focus-visible{outline:2px solid var(--tp-accent);outline-offset:5px;border-radius:5px}.tp :is(a,button){-webkit-tap-highlight-color:transparent}.tp ::selection{background:var(--tp-fill);color:var(--tp-on-fill)}.tp-container{width:calc(100% - 112px);max-width:1392px;margin-inline:auto}.tp-icon{display:inline-block;flex:0 0 auto;width:22px;height:22px;vertical-align:middle}.tp-header{height:88px;display:flex;align-items:center;gap:64px;position:relative;z-index:5}.tp-brand{display:inline-flex;align-items:center;gap:13px;font-size:27px;font-weight:700;white-space:nowrap}.tp-brandmark{width:30px;height:34px;display:inline-block;border-radius:57% 44% 48% 58%;transform:rotate(25deg);background:radial-gradient(ellipse at 28% 12%,#c2c5ff 0%,transparent 42%),linear-gradient(130deg,#6567d9 20%,#a3a4fc 62%,#7475dd);box-shadow:inset 1px 1px 1px #d8d9ff88}.tp-desktop-nav{display:flex;align-items:center;gap:34px;color:var(--tp-muted);font-size:15px}.tp-desktop-nav>*{min-height:44px;display:inline-flex;align-items:center}.tp-desktop-nav>*:hover,.tp-footer nav>*:hover{color:var(--tp-accent)}.tp-header-actions{display:flex;align-items:center;gap:18px;margin-left:auto}.tp-icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px!important}.tp-icon-button:hover{background:var(--tp-surface-hover)}.tp .tp-login{height:42px;padding:0 20px;display:inline-flex;align-items:center;gap:10px;border:1px solid var(--tp-accent);border-radius:12px;font-size:15px}.tp-login .tp-icon{width:16px;height:16px}.tp-login:hover{background:var(--tp-surface-hover)}.tp-theme-control{position:relative}.tp-theme-popover{position:absolute;top:53px;right:0;width:190px;padding:10px;border:1px solid var(--tp-line);border-radius:14px;background:var(--tp-surface);box-shadow:var(--tp-shadow)}.tp-theme-popover>p{font-size:12px;color:var(--tp-faint);margin:6px 10px 8px}.tp-theme-popover>button{display:flex;align-items:center;width:100%;gap:10px;padding:11px 10px;border-radius:7px;text-align:left;font-size:14px}.tp-theme-popover>button[aria-pressed=true],.tp-theme-popover>button:hover{background:var(--tp-surface-hover);color:var(--tp-accent)}.tp-theme-popover .tp-icon{width:18px;height:18px}.tp-selected{margin-left:auto;opacity:0}.tp-theme-popover>button[aria-pressed=true] .tp-selected{opacity:1}.tp-menu-button,.tp-mobile-nav{display:none}.tp-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:392px;gap:20px;padding:26px 0 30px}.tp-hero-copy{position:relative;z-index:1}.tp-eyebrow{color:var(--tp-faint);font-size:11px;letter-spacing:.28em;margin-bottom:24px!important}.tp-eyebrow-mobile{display:none}.tp h1{font-size:clamp(44px,4.65vw,72px);line-height:1.22;letter-spacing:-.035em;font-weight:750}.tp h1>span{display:block;white-space:nowrap}.tp-intro{margin-top:20px!important;color:var(--tp-muted);font-size:clamp(16px,1.42vw,22px);line-height:1.65}.tp-intro>span{white-space:nowrap}.tp .tp-explore{color:var(--tp-accent);font-weight:600;display:none;align-items:center;gap:10px;min-height:44px}.tp-hero-art{position:relative;padding:0 28px 0 0}.tp-hero-art>img{width:100%;height:auto}.tp-art-caption{position:absolute;right:-2px;top:52%;color:var(--tp-faint);font-size:8px;letter-spacing:.22em;line-height:2.2}.tp-section-heading{display:flex;position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.tp-tools,.tp-card{scroll-margin-top:24px}.tp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.tp-card{min-height:304px;position:relative;overflow:hidden;border:1px solid var(--tp-line);border-radius:12px;background:var(--tp-surface);padding:22px 24px 68px;transition:border-color .18s}.tp-card:hover{border-color:var(--tp-accent)}.tp-card-index{font-size:14px;letter-spacing:.04em;color:var(--tp-faint);position:relative;z-index:1}.tp-card-index>span{display:none}.tp-card-copy{position:relative;z-index:1;pointer-events:none}.tp-product-icon{width:34px;height:34px;color:var(--tp-accent);margin:19px 0 15px}.tp h3{font-size:26px;line-height:1.35;font-weight:650}.tp-description{font-size:15px;color:var(--tp-muted);margin-top:15px!important;max-width:228px;line-height:1.7}.tp-detail{font-size:12px;color:var(--tp-faint);margin-top:8px!important;white-space:nowrap}.tp-card-art{position:absolute;width:56%;height:88%;right:-8%;bottom:-8%;opacity:.52;pointer-events:none;mask-image:linear-gradient(90deg,transparent,#000 45%)}.tp-card-art img{width:100%;height:100%;object-fit:contain}.tp-valorant-art{width:100%;height:100%;color:var(--tp-accent)}.tp-card-scan .tp-card-art{right:-2%;bottom:-5%}.tp-card-actions{position:absolute;left:24px;right:24px;bottom:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:2}.tp .tp-card-action{color:var(--tp-accent);min-height:44px;display:inline-flex;align-items:center;font-size:16px;font-weight:600;white-space:nowrap}.tp-card-action>.tp-icon{width:19px;height:19px;margin-left:9px}.tp .tp-card-download{min-height:44px;display:inline-flex;align-items:center;gap:6px;color:var(--tp-accent);font-size:14px;white-space:nowrap}.tp-card-download>.tp-icon{width:18px;height:18px}.tp-card-download:hover{text-decoration:underline}.tp-action-mobile{display:none}.tp-footer{border-top:1px solid var(--tp-line);margin-top:44px;min-height:126px;display:flex;align-items:center;gap:26px;color:var(--tp-faint)}.tp-footer .tp-brand{font-size:20px;color:var(--tp-text);gap:10px}.tp-footer .tp-brandmark{width:21px;height:24px}.tp-footer p,.tp-footer nav{font-size:13px}.tp-footer nav{display:flex;gap:28px;align-items:center;margin-left:auto}.tp-footer nav>*{min-height:44px;display:inline-flex;align-items:center}.tp-notice{position:fixed;z-index:20;bottom:calc(24px + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%);width:max-content;max-width:calc(100% - 40px);padding:10px 12px 10px 18px;display:flex;align-items:center;gap:12px;border:1px solid var(--tp-line);border-radius:12px;color:var(--tp-text);background:var(--tp-surface);box-shadow:var(--tp-shadow);font-size:14px}.tp-notice button{width:40px;height:40px;display:grid;place-items:center;flex-shrink:0}.tp-help{padding:0;width:min(540px,calc(100% - 40px));max-height:calc(100svh - 48px);border:1px solid var(--tp-line);border-radius:18px;color:var(--tp-text);background:var(--tp-surface);box-shadow:var(--tp-shadow);margin:auto}.tp-help::backdrop{background:var(--tp-overlay)}.tp-help-content{padding:26px}.tp-help-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.tp-help-heading h2{font-size:24px;font-weight:650}.tp-help-heading form{margin:0}.tp-help h3{margin-top:20px;font-size:16px}.tp-help p{margin-top:8px;font-size:14px;color:var(--tp-muted);line-height:1.85}.tp-skip{position:fixed;top:-100px;left:20px;z-index:30;padding:12px 16px;background:var(--tp-surface)}.tp-skip:focus{top:12px}@media (min-width: 1550px){.tp-hero{min-height:440px}.tp-card{min-height:330px}}@media (max-width: 1199px) and (min-width: 900px){.tp-container{width:calc(100% - 64px)}.tp-header{gap:24px}.tp-desktop-nav{gap:14px;font-size:14px}.tp-header-actions{gap:8px}.tp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tp-hero{min-height:360px}.tp h1{font-size:44px}.tp-description{max-width:200px}.tp-card{padding-inline:20px}.tp-card-actions{left:20px;right:20px}.tp-art-caption{display:none}}@media (max-width: 899px){.tp-container{width:calc(100% - 44px);max-width:560px}.tp-header{height:80px;gap:10px}.tp-brand{font-size:26px;gap:10px}.tp-brandmark{width:26px;height:30px}.tp-desktop-nav{display:none}.tp-header-actions{gap:8px}.tp .tp-login{padding:0 14px;height:38px;border-radius:9px;font-size:15px}.tp-login .tp-icon{display:none}.tp-menu-button{display:inline-flex}.tp-mobile-nav{position:absolute;top:72px;right:0;left:0;display:grid;border:1px solid var(--tp-line);border-radius:14px;padding:10px;background:var(--tp-surface);box-shadow:var(--tp-shadow)}.tp-mobile-nav>*{display:flex;justify-content:space-between;align-items:center;padding:14px 12px;min-height:48px;font-size:16px;text-align:left}.tp-mobile-nav>*:hover{color:var(--tp-accent);background:var(--tp-surface-hover);border-radius:7px}.tp-theme-popover{right:-72px}.tp-hero{display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0;padding:25px 0 24px}.tp-eyebrow{margin-bottom:17px!important;font-size:13px;letter-spacing:.05em}.tp-eyebrow-mobile{display:inline}.tp-eyebrow-desktop{display:none}.tp h1{font-size:clamp(30px,8.7vw,42px);line-height:1.32;letter-spacing:-.035em;font-weight:750}.tp-intro{font-size:16px;margin-top:17px!important;line-height:1.8;max-width:360px}.tp .tp-explore{display:inline-flex;margin-top:14px;font-size:17px}.tp-hero-art{padding:0;margin:12px -5px 0}.tp-hero-art img{width:100%;height:auto}.tp-art-caption{display:none}.tp-section-heading{position:static;width:auto;height:auto;overflow:visible;clip-path:none;display:flex;align-items:center;gap:18px;margin-bottom:20px}.tp-section-heading h2{font-size:20px;font-weight:650}.tp-section-heading>span{flex:1;height:1px;background:var(--tp-line)}.tp-grid{grid-template-columns:minmax(0,1fr);gap:18px}.tp-card{min-height:0;padding:20px 18px 18px;border-radius:16px;display:flex;flex-direction:column}.tp-card-index{font-size:13px;margin-bottom:14px!important}.tp-card-index>span{display:inline}.tp-card-copy{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center}.tp-product-icon{width:28px;height:28px;margin:0}.tp h3{font-size:26px;line-height:1.4}.tp-description{grid-column:1 / -1;max-width:none;font-size:16px;margin-top:12px!important;line-height:1.65}.tp-detail{grid-column:1 / -1;margin-top:8px!important;font-size:13px;white-space:normal}.tp-card-art{position:static;width:100%;height:230px;margin:4px 0 8px;opacity:1;mask-image:none}.tp-card-camp .tp-card-art{height:252px}.tp-card-scan .tp-card-art{height:248px;margin-top:16px}.tp-card-art img{object-fit:cover}.tp-card-scan .tp-card-art img{object-fit:contain}.tp-card-actions{position:static;flex-direction:column;align-items:stretch;gap:10px}.tp .tp-card-action{display:flex;justify-content:center;width:100%;min-height:48px;padding:10px 14px;border-radius:10px;background:var(--tp-fill);color:var(--tp-on-fill);font-size:16px;font-weight:650}.tp .tp-card-action:hover{filter:brightness(1.08)}.tp .tp-card-download{justify-content:center;min-height:48px;padding:10px 14px;border:1px solid var(--tp-line);border-radius:10px;font-size:16px}.tp-card-download:hover{background:var(--tp-surface-hover);text-decoration:none}.tp-action-desktop{display:none}.tp-action-mobile{display:inline}.tp-footer{margin-top:30px;padding:26px 0 22px;min-height:0;flex-direction:column;gap:12px}.tp-footer p{display:none}.tp-footer nav{margin-left:0;gap:0;font-size:14px}.tp-footer nav>*{padding:0 20px}.tp-footer nav>*+*{position:relative}.tp-footer nav>*+*:before{content:"";position:absolute;top:14px;bottom:14px;left:0;width:1px;background:var(--tp-line)}.tp-help-content{padding:20px}}@media (prefers-reduced-motion: reduce){.tp *{transition:none!important;scroll-behavior:auto!important}}