/* 批TGWDEV482：组件角色映射；媒体和开奖/冷热/涨跌系列保留数据色。 */
:root[data-app-theme], [data-app-fixed-theme], .mobile-app:has(#screen-three.is-active) {
  --bg: var(--app-page) !important; --surface-2: var(--app-field) !important; --surface-3: var(--app-chart-header) !important; --line-strong: var(--app-border) !important;
  --page: var(--app-page) !important; --panel: var(--app-panel) !important; --panel-deep: var(--app-field) !important;
  --toolbar-a: var(--app-panel) !important; --toolbar-b: var(--app-field) !important; --toolbar-c: var(--app-chart-header) !important;
  --button: var(--app-field) !important; --button-hover: var(--app-wash) !important; --button-active: var(--app-primary) !important;
  --chat-bg: var(--app-page) !important; --chat-ink: var(--app-text) !important; --chat-muted: var(--app-muted) !important; --chat-line: var(--app-border) !important;
  --chat-green: var(--app-accent) !important; --chat-green-dark: var(--app-accent) !important;
  --cs-ink: var(--app-text) !important; --cs-muted: var(--app-muted) !important; --cs-primary: var(--app-accent) !important; --cs-primary-soft: var(--app-wash) !important;
  --desktop-chat-canvas: var(--app-page) !important; --desktop-chat-directory: var(--app-page) !important;
  --desktop-chat-panel: var(--app-panel) !important; --desktop-chat-panel-strong: var(--app-field) !important;
  --desktop-chat-text: var(--app-text) !important; --desktop-chat-muted: var(--app-muted) !important; --desktop-chat-line: var(--app-border) !important;
  --desktop-chat-ink: var(--app-text) !important; --desktop-chat-brand-deep: var(--app-accent) !important;
  --desktop-chat-brand: var(--app-primary) !important; --desktop-chat-brand-soft: var(--app-wash) !important;
  --desktop-chat-incoming: var(--app-panel) !important; --desktop-chat-mine: var(--app-primary) !important;
  --app-bg: var(--app-page) !important; --surface: var(--app-panel) !important; --ink: var(--app-text) !important;
  --text: var(--app-text) !important; --muted: var(--app-muted) !important; --line: var(--app-border) !important;
  --teal: var(--app-accent) !important; --accent: var(--app-accent) !important; --accent-strong: var(--app-primary) !important;
  --page-background: var(--app-page) !important; --chat-background: var(--app-page) !important;
  --incoming-bubble: var(--app-panel) !important; --outgoing-bubble: var(--app-primary) !important; --chat-text: var(--app-text) !important;
  --calc-workspace: var(--app-page) !important; --calc-card: var(--app-panel) !important; --calc-card-soft: var(--app-field) !important;
  --calc-input: var(--app-field) !important; --calc-omission: var(--app-field) !important; --calc-result: var(--app-panel) !important;
  --calc-search: var(--app-field) !important; --calc-rail: var(--app-field) !important; --calc-border: var(--app-border) !important;
  --calc-primary: var(--app-primary) !important; --calc-selected: var(--app-accent) !important; --calc-text: var(--app-text) !important; --calc-muted: var(--app-muted) !important;
  --bg-a: var(--app-panel) !important; --bg-b: var(--app-field) !important; --bg-c: var(--app-chart-header) !important; --bg-d: var(--app-chart-header) !important;
  --grid-line: var(--app-border) !important; --axis-text: var(--app-text) !important; --line-main: var(--app-muted) !important;
  --ball-normal-bg: var(--app-panel) !important; --ball-normal-text: var(--app-text) !important;
}
html[data-app-theme] body { background: var(--app-page); color: var(--app-text); }
html[data-app-theme] :is(.mobile-app,.mobile-chat-hub,.mobile-main,.account-center-content) { background: var(--app-page) !important; color: var(--app-text); }
html[data-app-theme] :is(.mobile-statusbar,.mobile-topbar,.bottom-nav,.chat-login-gate,.chat-search,.chat-round-button,.chat-home-shortcuts button,.chat-register-toggle,.chat-home-shortcut-handle,.chat-composer,.chat-side-panel,.chat-conversation-list,.chat-directory-list,.account-center-dialog,.account-center-head,.account-center-nav,.account-center-section,.account-center-footer,.account-center-login>div,.account-center-metric,.account-center-access-table,.account-center-permission-group,.account-center-settings-nav button,.full-feature-link,.mobile-chart-viewer,.mobile-chart-settings,.mobile-chart-history,.mobile-chart-game-strip,.mobile-chart-mode-strip,.mobile-back) {
  background: var(--app-panel) !important; color: var(--app-text) !important; border-color: var(--app-border) !important;
}
html[data-app-theme] :is(.mobile-title strong,.chat-login-gate h2,.chat-login-gate h3,.account-center-head__title strong,.account-center-panel-head h2,.account-center-section h3,.account-center-profile-summary strong,.account-center-metric strong,.account-center-row__main strong) { color: var(--app-text) !important; }
html[data-app-theme] :is(.mobile-title span,.chat-login-gate p,.account-center-head__title span,.account-center-panel-head p,.account-center-section p,.account-center-profile-summary span,.account-center-metric span,.account-center-metric small,.account-center-row__main span,.account-center-row__main small,.account-center-settings-list span,.account-center-settings-nav button span,.account-center-nav-group,.account-center-toggle small,.account-center-empty,.account-center-field) { color: var(--app-muted) !important; }
html[data-app-theme] :is(.nav-button,.account-center-launch,.account-center-head button,.account-center-button,.account-center-nav button,.chat-register-toggle,.chat-round-button,#mobileFunctionMenu,.chat-home-shortcut-handle,.mobile-back,.mobile-chart-game-strip button,.mobile-chart-mode-strip button) { background: var(--app-field) !important; color: var(--app-text) !important; border-color: var(--app-border) !important; }
html[data-app-theme] :is(.chat-home-shortcuts button span,.nav-button b,.account-center-settings-list>div,.account-center-note,.account-center-access-row--head) { background: var(--app-field) !important; color: var(--app-muted) !important; border-color: var(--app-border) !important; }
html[data-app-theme] :is(.nav-button.is-on,.nav-button.is-active,.account-center-nav button[aria-selected="true"],.account-center-settings-nav button[aria-current="page"],.account-center-permission-chip,.mobile-chart-game-strip button.is-on,.mobile-chart-mode-strip button.is-on) { background: var(--app-wash) !important; color: var(--app-accent) !important; border-color: var(--app-accent) !important; }
html[data-app-theme] :is(.nav-button.is-on b,.nav-button.is-active b) { background: var(--app-wash) !important; color: var(--app-accent) !important; }
html[data-app-theme] :is(.mobile-action,.mobile-install-button,.chat-login-submit,.account-center-button--primary,.account-center-login a) { background: var(--app-primary) !important; color: var(--app-on-primary) !important; border-color: var(--app-primary) !important; }
html[data-app-theme] :is(.account-center-button--danger,.account-center-badge--rejected,.account-center-badge--suspended,.account-center-badge--expired) { background: var(--app-danger-wash) !important; color: var(--app-danger) !important; border-color: var(--app-danger) !important; }
html[data-app-theme] :is(.account-center-note--warning,.account-center-badge--pending,.account-center-badge--supplement_required,.account-center-badge--appealing,.account-center-nav .account-center-nav__platform-admin) { background: var(--app-warning-wash) !important; color: var(--app-warning) !important; }
html[data-app-theme] :is(.account-center-badge--approved,.account-center-badge--active) { background: var(--app-wash) !important; color: var(--app-accent) !important; }
html[data-app-theme] :is(.chat-home-content,.chat-message-list,.chat-latest-draws) { background: var(--app-page) !important; color: var(--app-text) !important; }
html[data-app-theme] :is(.chat-conversation-item,.chat-conversation-header,.chat-contact-panel,.chat-contact-row,.chat-quick-drawer,.chat-action-modal,.chat-feature-header,.chat-feature-list-button,.chat-home-draw-main,.chat-message-bubble,.mobile-stat-summary>div,.mobile-stat-chart-card,.mobile-stat-latest,.mobile-stat-recent,.mobile-stat-related,.mobile-calc-workbench,.mobile-calc-results,.mobile-calc-parameter,.mobile-calc-condition,.wide-panel,.group-buy-project-card,.group-buy-ticket-batches details) { background: var(--app-panel) !important; color: var(--app-text) !important; border-color: var(--app-border) !important; }
html[data-app-theme] :is(.chat-quick-grid button,.chat-composer button,.chat-inline-actions button,.chat-side-panel header button,.chat-quick-drawer header button,.chat-action-modal header button,.chat-feature-header button,.mobile-stat-games button,.mobile-stat-view-tabs button,.mobile-stat-periods button,.mobile-stat-position button,.mobile-stat-related button,.mobile-calc-choice,.mobile-calc-draft-actions button,.mobile-calc-result-actions button,.mobile-calc-workbench>header button,.mobile-calc-results>header button) { background: var(--app-field) !important; color: var(--app-text) !important; border-color: var(--app-border) !important; }
html[data-app-theme] :is(.chat-login-form button,.chat-register-code button,.chat-register-form>button[type="submit"],.chat-action-form button,.chat-composer__send,.mobile-calc-choice.is-selected,.mobile-calc-choice[aria-pressed="true"],.mobile-calc-draft-actions .is-add,.mobile-calc-result-actions .is-calculate) { background: var(--app-primary) !important; color: var(--app-on-primary) !important; border-color: var(--app-primary) !important; }
html[data-app-theme] :is(.chat-message-row.is-mine .chat-message-bubble) { background: var(--app-primary) !important; color: var(--app-on-primary) !important; border-color: var(--app-primary) !important; }
html[data-app-theme] :is(.chat-message-sender,.chat-conversation-copy small,.chat-contact-row small,.chat-conversation-header small,.mobile-stat-periods>span,.mobile-stat-summary span,.mobile-stat-related>span,.chat-register-consent) { color: var(--app-muted) !important; }
html[data-app-theme] :is(.chat-home-draw-card strong,.chat-conversation-copy strong,.mobile-stat-summary strong) { color: var(--app-text) !important; }
html[data-app-theme] .chat-svc-row { background: var(--app-panel) !important; color: var(--app-text) !important; }
html[data-app-theme] .chat-login-gate__mark { background: var(--app-primary) !important; color: var(--app-on-primary) !important; }
html[data-app-theme] :is(.chat-connection-status.is-offline,.mobile-chart-hint) { background: var(--app-warning-wash) !important; color: var(--app-warning) !important; }
html[data-app-theme] :is(.mobile-stat-games button.is-on,.mobile-stat-view-tabs button.is-on,.mobile-stat-periods button.is-on,.mobile-stat-position button.is-on) { background: var(--app-wash) !important; color: var(--app-accent) !important; border-color: var(--app-accent) !important; }
html[data-app-theme] :is(.mobile-topbar,.bottom-nav,.panel-card,.module-tile,.row-list,.mobile-screen,.account-center,.account-center__panel,.account-center__main,.dialog-card,.dialog-body,.modal-card,.sheet,.chat-panel,.chat-sidebar,.chat-plus-panel,.desktop-account-ai,.desktop-account-ai__head,.desktop-account-ai__composer,.feature-card,.workspace-card,.view-tools,.trend-toolbar) {
  background-color: var(--app-panel); color: var(--app-text); border-color: var(--app-border);
}
html[data-app-theme] :is(.row-item,.field-group,.chat-composer,.chat-conversation,.chat-directory,.account-center__sidebar,.desktop-account-ai__voice) { color: var(--app-text); border-color: var(--app-border); }
html[data-app-theme] :is(input:not([type="color"]):not([type="checkbox"]):not([type="radio"]),textarea,select,.field) { background-color: var(--app-field); color: var(--app-text); border-color: var(--app-border); }
html[data-app-theme] :is(input,textarea)::placeholder { color: var(--app-muted); opacity: 1; }
html[data-app-theme] :is(.primary-button,.primary-btn,.chat-send-button) { background: var(--app-primary); color: var(--app-on-primary); border-color: var(--app-primary); }
html[data-app-theme] :is(.muted,.row-item>span>span,.section-title>span,.desktop-account-ai__head>span,.tile-mark,.nav-button) { color: var(--app-muted); }
html[data-app-theme] :is(.row-action,.nav-button.is-on,.nav-button.is-active,.tool-button.is-active,.tool-button.active) { color: var(--app-accent); }
.app-appearance-dialog { width: min(440px,calc(100% - 32px)); padding: 20px; border: 1px solid var(--app-border); border-radius: 20px; background: var(--app-panel); color: var(--app-text); box-shadow: 0 20px 60px #0005; }
.app-appearance-dialog::backdrop { background: #0008; }
.app-appearance-dialog header { display: flex; align-items: center; justify-content: space-between; font-size: 18px; margin-bottom: 16px; }
.app-appearance-dialog header button { width: 44px; height: 44px; border: 0; background: transparent; color: var(--app-muted); font-size: 26px; }
.app-theme-options { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.app-theme-options>button { padding: 14px; text-align: left; background: var(--preview-page); color: var(--preview-text); border: 2px solid var(--app-border); border-radius: 14px; }
.app-theme-options>button[aria-pressed="true"] { border-color: var(--app-accent); }
.app-theme-preview { display: grid; gap: 8px; margin-top: 14px; padding: 14px 10px; background: var(--preview-panel); border-radius: 10px; font-size: 13px; }
.app-theme-preview small { color: var(--preview-muted); }
.app-theme-preview i { width: 42px; height: 4px; background: var(--app-primary); border-radius: 2px; }
.app-appearance-dialog p { font-size: 12px; color: var(--app-muted); margin: 18px 0 0; }
/* 新设置采用平面控件，不继承旧公共按钮的立体高光。 */
html[data-app-theme] body :is(.app-appearance-dialog button,.nav-button,.chat-round-button,.chat-register-toggle,.chat-home-shortcut-handle,.account-center-dialog button) {
  box-shadow: none !important; background-image: none !important; filter: none !important;
}
html[data-app-theme] body .app-theme-options>button { border-radius: 14px !important; }
html[data-app-theme] body #appAppearanceDialog button:not(#quickPushNextDragHandle),
html[data-app-theme] body #appAppearanceDialog button:not(#quickPushNextDragHandle):hover,
html[data-app-theme] body #appAppearanceDialog button:not(#quickPushNextDragHandle):active { box-shadow: none !important; filter: none !important; }
html[data-app-theme] body .app-appearance-dialog header button { border-radius: 50% !important; }
html[data-app-theme] body :is(.app-appearance-dialog button,.account-center-dialog button):focus-visible { outline: 2px solid var(--app-accent) !important; }
