/* GuGu white-blue login surface: visual-only override for runtime Ant styles. */
.login-page {
  background: transparent !important;
  color: #eaf6ff !important;
}
.login-page .login-container {
  background: transparent !important;
  border: 1px solid #bfdbfe !important;
  box-shadow: 0 24px 60px rgba(30, 64, 175, .16), 0 8px 24px rgba(37, 99, 235, .10) !important;
}
.login-page .login-brand {
  background: transparent !important;
  color: #d9f0ff !important;
}
.login-page .login-form-section,
.login-page .login-form-wrapper {
  background: transparent !important;
  color: #eaf6ff !important;
}
.login-page .login-form-header h2,
.login-page .login-form-header p,
.login-page .form-options,
.login-page .form-footer,
.login-page .ant-checkbox-label {
  color: #eaf6ff !important;
}
.login-page .ant-input-affix-wrapper {
  background: transparent !important;
  border-color: #bfdbfe !important;
  color: #eaf6ff !important;
  box-shadow: none !important;
}
.login-page .ant-input-affix-wrapper:hover,
.login-page .ant-input-affix-wrapper-focused,
.login-page .ant-input-affix-wrapper:focus-within {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .14) !important;
}
.login-page .ant-input,
.login-page .ant-input-affix-wrapper input {
  background: transparent !important;
  color: #eaf6ff !important;
  caret-color: #2563eb !important;
}
.login-page .ant-input::placeholder {
  color: rgba(190, 226, 255, .6) !important;
}
.login-page .ant-input-prefix,
.login-page .ant-input-password-icon {
  color: rgba(176, 222, 255, .8) !important;
}
.login-page .ant-checkbox-inner {
  background: transparent !important;
  border-color: rgba(180, 220, 247, .25) !important;
}
.login-page .ant-checkbox-checked .ant-checkbox-inner {
  background: #2563eb !important;
  border-color: #2563eb !important;
}
.login-page .forgot-link {
  color: #2563eb !important;
  border-bottom-color: rgba(37, 99, 235, .35) !important;
}
.login-page .login-button,
.login-page .ant-btn-primary {
  background: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, .22) !important;
}
.login-page .login-button:hover,
.login-page .ant-btn-primary:hover {
  background: #1d4ed8 !important;
  border-color: #1d4ed8 !important;
}
.login-page .brand-title,
.login-page .brand-line,
.login-page .brand-sub {
  color: #d9f0ff !important;
}
.login-page .brand-ring,
.login-page .brand-divider,
.login-page .brand-corner {
  border-color: #3b82f6 !important;
}
.login-page .brand-glow,
.login-page .brand-aura,
.login-page .brand-sweep {
  opacity: .18 !important;
}

/* GuGu white-blue application theme: visual-only overrides for authenticated SPA views. */
:root {
  --gugu-blue-900: #123b67;
  --gugu-blue-800: #164f86;
  --gugu-blue-700: #1d64a5;
  --gugu-blue-600: #2478c9;
  --gugu-blue-500: #3d8ed8;
  --gugu-blue-200: #c7def3;
  --gugu-blue-100: #e7f2fc;
  --gugu-blue-50: #f5faff;
  --gugu-ink: #18354f;
  --gugu-muted: #66829d;
  --gugu-border: #d5e5f3;
  --gugu-shadow: 0 8px 24px rgba(22, 79, 134, .08);

  /* Fisher custom design tokens used by authenticated views. */
  --fc-bg: #f5faff !important;
  --fc-bg-deep: #edf6ff !important;
  --fc-surface: #ffffff !important;
  --fc-surface-hi: #f8fbff !important;
  --fc-elevated: #ffffff !important;
  --fc-overlay: rgba(12, 51, 87, .24) !important;
  --fc-border: #d5e5f3 !important;
  --fc-border-soft: #e7f2fc !important;
  --fc-border-hi: #c7def3 !important;
  --fc-border-focus: #3d8ed8 !important;
  --fc-primary: #2478c9 !important;
  --fc-primary-hi: #3d8ed8 !important;
  --fc-primary-lo: #164f86 !important;
  --fc-primary-soft: rgba(36, 120, 201, .12) !important;
  --fc-primary-border: rgba(36, 120, 201, .32) !important;
  --fc-accent: #1d64a5 !important;
  --fc-accent-hi: #2478c9 !important;
  --fc-accent-soft: rgba(36, 120, 201, .12) !important;
  --fc-success: #1264b7 !important;
  --fc-success-soft: rgba(18, 100, 183, .12) !important;
  --fc-success-border: rgba(18, 100, 183, .32) !important;
  --fc-danger: #2478c9 !important;
  --fc-danger-soft: rgba(36, 120, 201, .12) !important;
  --fc-danger-border: rgba(36, 120, 201, .32) !important;
  --fc-warn: #1d64a5 !important;
  --fc-info: #2478c9 !important;
  --fc-info-soft: rgba(36, 120, 201, .12) !important;
  --fc-blue: #2478c9 !important;
  --fc-blue-soft: rgba(36, 120, 201, .14) !important;
  --fc-blue-border: rgba(36, 120, 201, .35) !important;
  --fc-text-hi: #123b67 !important;
  --fc-text: #18354f !important;
  --fc-text-lo: #426783 !important;
  --fc-text-mute: #66829d !important;
  --fc-shadow-xs: 0 1px 2px rgba(22, 79, 134, .06) !important;
  --fc-shadow-sm: 0 2px 6px rgba(22, 79, 134, .08), 0 1px 2px rgba(22, 79, 134, .05) !important;
  --fc-shadow: 0 6px 16px rgba(22, 79, 134, .10), 0 2px 4px rgba(22, 79, 134, .06) !important;
  --fc-shadow-lg: 0 16px 36px rgba(22, 79, 134, .12), 0 4px 10px rgba(22, 79, 134, .07) !important;
  --fc-grad-primary: linear-gradient(135deg, #1d64a5 0%, #3d8ed8 100%) !important;
  --fc-grad-accent: linear-gradient(135deg, #2478c9 0%, #5da6ef 100%) !important;
}

html, body, #root {
  background: #f5faff !important;
  color: var(--gugu-ink) !important;
}

/* The control console uses fixed custom classes and dark literals in addition to Ant. */
html[data-theme="dark"] {
  color-scheme: light !important;
  --fc-bg: #f5faff !important;
  --fc-bg-body: #f5faff !important;
  --fc-bg-root: #edf6ff !important;
  --fc-bg-shell: #f5faff !important;
  --fc-bg-panel: #ffffff !important;
  --fc-bg-sidebar: #f7fbff !important;
  --fc-bg-topbar: #ffffff !important;
  --fc-bg-deep: #edf6ff !important;
  --fc-surface: #ffffff !important;
  --fc-surface-hi: #f8fbff !important;
  --fc-elevated: #ffffff !important;
  --fc-text-hi: #123b67 !important;
  --fc-text: #18354f !important;
  --fc-text-secondary: #334f6b !important;
  --fc-text-muted: #66829d !important;
  --fc-text-lo: #426783 !important;
}
/* Match the app's :root[data-theme] token rule specificity. */
:root[data-theme="dark"] {
  color-scheme: light !important;
  --fc-bg: #f5faff !important;
  --fc-bg-deep: #edf6ff !important;
  --fc-surface: #ffffff !important;
  --fc-surface-hi: #f8fbff !important;
  --fc-elevated: #ffffff !important;
  --fc-overlay: rgba(12, 51, 87, .24) !important;
  --fc-border: #d5e5f3 !important;
  --fc-border-soft: #e7f2fc !important;
  --fc-border-hi: #c7def3 !important;
  --fc-text-hi: #123b67 !important;
  --fc-text: #18354f !important;
  --fc-text-secondary: #334f6b !important;
  --fc-text-muted: #66829d !important;
  --fc-text-lo: #426783 !important;
}
.control-page,
.ctrl-tab-content,
.ctrl-tab-panel,
.ctrl-toolbar,
.ctrl-sidebar,
.ctrl-screen-area,
.ctrl-quick-panel,
.ctrl-sidebar-panel,
.inj-layout,
.home-tab-topbar,
.rc-main {
  background: #f5faff !important;
  color: var(--gugu-ink) !important;
}
.ctrl-header,
.ctrl-tabs,
.ctrl-tabs-bar {
  background: #ffffff !important;
  border-color: var(--gugu-border) !important;
  color: var(--gugu-blue-900) !important;
}
.ctrl-tab {
  background: transparent !important;
  border-color: var(--gugu-border) !important;
  color: var(--gugu-blue-800) !important;
}
.ctrl-tab:hover,
.ctrl-tab.active {
  background: #e7f2fc !important;
  border-color: #93c5fd !important;
  color: var(--gugu-blue-700) !important;
}
.ctrl-sidebar,
.ctrl-device-list,
.sidebar-card,
.inj-panel,
.panel,
.s-card,
.device-card,
.login-card {
  background: transparent !important;
  border-color: var(--gugu-border) !important;
  color: var(--gugu-ink) !important;
  box-shadow: var(--gugu-shadow) !important;
}
.ctrl-header-brand,
.ctrl-tab-panel-head h2,
.ctrl-sidebar h3,
.ctrl-device-row span,
.ctrl-device-row .device-name,
.ctrl-screen-label,
.rc-main h3,
.rc-main h4,
.panel h3,
.panel h4,
.panel strong,
.panel b,
.s-card strong {
  color: var(--gugu-blue-900) !important;
}
.ctrl-time-row,
.ctrl-ws-status,
.ctrl-tab-panel-head p,
.ctrl-device-row label,
.ctrl-empty-inline,
.panel label,
.panel span,
.panel div,
.panel td,
.rc-main p { color: var(--gugu-muted) !important; }
.ctrl-tab-action,
.ctrl-qbtn,
.sidebar-btn,
.sidebar-btn-sm,
.ctrl-swipe-btn,
.ctrl-dpad button,
.rc-btn-primary {
  background: var(--gugu-blue-600) !important;
  border-color: var(--gugu-blue-600) !important;
  color: #ffffff !important;
}
.ctrl-log-row,
.sidebar-input,
.sidebar-textarea,
.modal-input,
.role-select,
.rc-main input,
.rc-main select,
.rc-main textarea {
  background: #ffffff !important;
  border-color: var(--gugu-blue-200) !important;
  color: var(--gugu-ink) !important;
}
.ctrl-phone-frame,
.ctrl-phone-screen { background: #eef6ff !important; border-color: var(--gugu-border) !important; }
.sidebar-card-head { background: var(--gugu-blue-50) !important; border-color: var(--gugu-border) !important; color: var(--gugu-blue-900) !important; }
.sidebar-card-body { background: #ffffff !important; color: var(--gugu-ink) !important; }
.modal-beautiful { background: #ffffff !important; border-color: var(--gugu-border) !important; box-shadow: 0 18px 48px rgba(22,79,134,.16) !important; }
.modal-beautiful .modal-head,
.modal-beautiful .modal-footer { background: #ffffff !important; border-color: var(--gugu-border) !important; color: var(--gugu-blue-900) !important; }
.injection-panel,
.injection-card { background: #ffffff !important; border-color: var(--gugu-border) !important; color: var(--gugu-ink) !important; }

body, button, input, textarea, select, .ant-typography {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif !important;
}

/* Main shell: sidebar, header, content and breadcrumbs. */
.ant-layout,
.ant-layout-content,
.ant-layout-footer {
  background: #f5faff !important;
  color: var(--gugu-ink) !important;
}
.ant-layout-sider,
.ant-layout-sider-children,
.ant-menu-dark,
.ant-menu-dark .ant-menu-sub {
  background: #ffffff !important;
}
.ant-layout-sider {
  border-right: 1px solid var(--gugu-border) !important;
  box-shadow: 3px 0 14px rgba(22, 79, 134, .05) !important;
}
.ant-layout-header {
  background: rgba(255,255,255,.96) !important;
  border-bottom: 1px solid var(--gugu-border) !important;
  box-shadow: 0 2px 10px rgba(22,79,134,.05) !important;
}
.ant-breadcrumb,
.ant-breadcrumb a,
.ant-breadcrumb-separator {
  color: var(--gugu-muted) !important;
}
.ant-breadcrumb > span:last-child {
  color: var(--gugu-blue-900) !important;
  font-weight: 600 !important;
}

/* Menu and navigation states. */
.ant-menu,
.ant-menu-item,
.ant-menu-submenu-title {
  color: #426783 !important;
}
.ant-menu-item:hover,
.ant-menu-submenu-title:hover,
.ant-menu-item-active {
  color: var(--gugu-blue-700) !important;
  background: var(--gugu-blue-50) !important;
}
.ant-menu-item-selected {
  color: #ffffff !important;
  background: var(--gugu-blue-600) !important;
  box-shadow: inset 3px 0 0 var(--gugu-blue-900) !important;
}
.ant-menu-item-selected::after { border-right-color: var(--gugu-blue-600) !important; }
.ant-menu-item .anticon,
.ant-menu-submenu-title .anticon { color: currentColor !important; }

/* Cards, statistic panels and sections. */
.ant-card,
.ant-statistic,
.ant-collapse,
.ant-list,
.ant-descriptions,
.ant-alert,
.ant-result {
  background: #ffffff !important;
  border-color: var(--gugu-border) !important;
  box-shadow: var(--gugu-shadow) !important;
}
.ant-card-head,
.ant-collapse > .ant-collapse-item,
.ant-list-header,
.ant-descriptions-title {
  border-color: var(--gugu-border) !important;
  color: var(--gugu-blue-900) !important;
}
.ant-card-head-title,
.ant-card-extra,
.ant-statistic-title,
.ant-list-item-meta-title,
.ant-descriptions-item-label {
  color: var(--gugu-blue-800) !important;
}
.ant-card-body,
.ant-list-item,
.ant-descriptions-item-content,
.ant-collapse-content {
  color: var(--gugu-ink) !important;
}

/* Tables and data-dense device lists. */
.ant-table,
.ant-table-container,
.ant-table-content,
.ant-table-thead > tr > th,
.ant-table-tbody > tr > td {
  background: #ffffff !important;
  border-color: var(--gugu-border) !important;
  color: var(--gugu-ink) !important;
}
.ant-table-thead > tr > th {
  background: var(--gugu-blue-50) !important;
  color: var(--gugu-blue-900) !important;
  font-weight: 600 !important;
}
.ant-table-tbody > tr:hover > td,
.ant-table-tbody > tr.ant-table-row-selected > td {
  background: #edf6ff !important;
}
.ant-table-cell-fix-left,
.ant-table-cell-fix-right { background: #ffffff !important; }

/* Inputs, selects and form controls. */
.ant-input,
.ant-input-affix-wrapper,
.ant-input-number,
.ant-input-number-input,
.ant-picker,
.ant-select-selector,
.ant-cascader-picker,
.ant-mentions,
.ant-upload.ant-upload-select-picture-card {
  background: #ffffff !important;
  border-color: var(--gugu-blue-200) !important;
  color: var(--gugu-ink) !important;
}

/* === Login page input transparency override === */
.login-page .ant-input,
.login-page .ant-input-affix-wrapper,
.login-page .ant-input-affix-wrapper input,
html:has(.login-page) .login-page .ant-input,
html:has(.login-page) .login-page .ant-input-affix-wrapper,
html:has(.login-page) .login-page .ant-input-affix-wrapper input {
  background: transparent !important;
  border-color: rgba(180, 220, 247, .25) !important;
  color: #dcefff !important;
  box-shadow: none !important;
}
.login-page .ant-input:hover,
.login-page .ant-input-affix-wrapper:hover,
.login-page .ant-input:focus,
.login-page .ant-input-affix-wrapper-focused,
.login-page .ant-input-affix-wrapper:focus-within {
  background: transparent !important;
  border-color: rgba(127, 202, 255, .6) !important;
  box-shadow: 0 0 0 3px rgba(75, 166, 236, .18) !important;
}

.ant-input:hover,
.ant-input-affix-wrapper:hover,
.ant-input-number:hover,
.ant-picker:hover,
.ant-select:hover .ant-select-selector,
.ant-input:focus,
.ant-input-focused,
.ant-input-affix-wrapper-focused,
.ant-input-number-focused,
.ant-picker-focused,
.ant-select-focused .ant-select-selector {
  border-color: var(--gugu-blue-500) !important;
  box-shadow: 0 0 0 2px rgba(61,142,216,.14) !important;
}
.ant-input::placeholder,
.ant-select-selection-placeholder { color: #88a1b7 !important; }
.ant-form-item-label > label,
.ant-checkbox-wrapper,
.ant-radio-wrapper,
.ant-switch + * { color: var(--gugu-blue-800) !important; }
.ant-checkbox-checked .ant-checkbox-inner,
.ant-radio-checked .ant-radio-inner,
.ant-switch-checked { background: var(--gugu-blue-600) !important; border-color: var(--gugu-blue-600) !important; }

/* Buttons, links and action emphasis. */
.ant-btn-primary,
.ant-btn-primary:not(:disabled) {
  background: var(--gugu-blue-600) !important;
  border-color: var(--gugu-blue-600) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(36,120,201,.2) !important;
}
.ant-btn-primary:hover,
.ant-btn-primary:focus { background: var(--gugu-blue-700) !important; border-color: var(--gugu-blue-700) !important; }
.ant-btn-default,
.ant-btn-dashed {
  background: #ffffff !important;
  border-color: var(--gugu-blue-200) !important;
  color: var(--gugu-blue-800) !important;
}
.ant-btn-default:hover,
.ant-btn-dashed:hover { border-color: var(--gugu-blue-500) !important; color: var(--gugu-blue-700) !important; }
.ant-btn-link,
.ant-btn-link:not(:disabled) { color: var(--gugu-blue-700) !important; }
.ant-btn-link:hover,
.ant-btn-link:focus { color: var(--gugu-blue-900) !important; background: var(--gugu-blue-50) !important; }
a, .ant-typography a { color: var(--gugu-blue-600) !important; }

/* Login and verification feature rail stays within the same white-blue palette. */
.login-page .feature-item {
  background: transparent !important;
  border-color: rgba(36, 120, 201, .22) !important;
  color: var(--gugu-blue-900) !important;
}
.login-page .feature-item:hover { background: rgba(36, 120, 201, .23) !important; }
.login-page .feature-icon { color: var(--gugu-blue-600) !important; border-color: rgba(36,120,201,.55) !important; }
.login-page .feature-desc,
.login-page .feature-text { color: var(--gugu-blue-900) !important; }
.login-page .form-footer,
.login-page .form-footer span { color: #426783 !important; }

/* Tabs, pagination, tags and statuses. */
.ant-tabs-tab,
.ant-tabs-tab-btn { color: var(--gugu-muted) !important; }
.ant-tabs-tab:hover,
.ant-tabs-tab-active .ant-tabs-tab-btn { color: var(--gugu-blue-700) !important; }
.ant-tabs-ink-bar { background: var(--gugu-blue-600) !important; }
.ant-pagination-item,
.ant-pagination-prev .ant-pagination-item-link,
.ant-pagination-next .ant-pagination-item-link {
  background: #ffffff !important;
  border-color: var(--gugu-border) !important;
}
.ant-pagination-item a { color: var(--gugu-blue-700) !important; }
.ant-pagination-item-active { border-color: var(--gugu-blue-600) !important; background: var(--gugu-blue-600) !important; }
.ant-pagination-item-active a { color: #ffffff !important; }
.ant-tag { border-color: var(--gugu-blue-200) !important; color: var(--gugu-blue-800) !important; background: var(--gugu-blue-50) !important; }
.ant-badge-status-processing { background: var(--gugu-blue-600) !important; }

/* Runtime overlays rendered under body. */
.ant-modal-content,
.ant-drawer-content,
.ant-popover-inner,
.ant-dropdown-menu,
.ant-select-dropdown,
.ant-picker-dropdown .ant-picker-panel-container,
.ant-notification-notice,
.ant-message-notice-content,
.ant-tooltip-inner {
  background: #ffffff !important;
  border: 1px solid var(--gugu-border) !important;
  color: var(--gugu-ink) !important;
  box-shadow: 0 12px 32px rgba(22,79,134,.14) !important;
}
.ant-modal-header,
.ant-drawer-header,
.ant-popover-title { background: #ffffff !important; border-color: var(--gugu-border) !important; color: var(--gugu-blue-900) !important; }
.ant-modal-title,
.ant-drawer-title { color: var(--gugu-blue-900) !important; }
.ant-dropdown-menu-item:hover,
.ant-select-item-option-active { background: var(--gugu-blue-50) !important; color: var(--gugu-blue-700) !important; }
.ant-modal-mask,
.ant-drawer-mask { background: rgba(12, 51, 87, .24) !important; }
  .ant-layout-header { padding: 0 14px !important; }
  .ant-layout-content { padding: 14px !important; }
  .ant-card { margin-bottom: 12px !important; }
  .ant-table { overflow-x: auto !important; }
  .ant-modal { max-width: calc(100vw - 24px) !important; }

/* Authenticated Fisher shell: the dashboard uses custom classes and inline
   styles in addition to Ant Design. Keep those surfaces in the same palette. */
.dashboard-root,
.dashboard-root .rc-main,
.dashboard-root .rc-shell,
.dashboard-root .rc-content {
  background: #f5faff !important;
  color: var(--gugu-ink) !important;
}
.dashboard-root .dashboard-topbar {
  background: rgba(255,255,255,.96) !important;
  border-bottom: 1px solid var(--gugu-border) !important;
  box-shadow: 0 2px 10px rgba(22,79,134,.06) !important;
}
.dashboard-root .dashboard-hero,
.dashboard-root .rc-header,
.dashboard-root .rc-header-elevated,
.dashboard-root .rc-device-toolbar,
.dashboard-root .rc-table-wrap,
.dashboard-root .device-card,
.dashboard-root .panel,
.dashboard-root .s-card,
.dashboard-root .admin-add-form,
.dashboard-root .rc-pagination,
.dashboard-root .batch-bar {
  background: #ffffff !important;
  border: 1px solid var(--gugu-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--gugu-shadow) !important;
  color: var(--gugu-ink) !important;
}
.dashboard-root .dashboard-hero {
  min-height: 104px !important;
  padding: 20px 24px !important;
  margin-bottom: 16px !important;
  background: linear-gradient(135deg, #ffffff 0%, #f3f8ff 100%) !important;
}
.dashboard-root .dashboard-hero h1,
.dashboard-root .rc-header,
.dashboard-root .rc-header-elevated,
.dashboard-root .panel h3,
.dashboard-root .panel h4 {
  color: var(--gugu-blue-900) !important;
  text-shadow: none !important;
}
.dashboard-root .dashboard-hero h1 {
  font-size: 26px !important;
  letter-spacing: 0 !important;
}
.dashboard-root .dashboard-hero .hero-kicker {
  color: var(--gugu-blue-600) !important;
  letter-spacing: 2px !important;
}
.dashboard-root .dashboard-hero p,
.dashboard-root .rc-top-left span,
.dashboard-root .dc-label,
.dashboard-root .td-muted,
.dashboard-root .td-sm,
.dashboard-root .placeholder-panel,
.dashboard-root .s-card .s-title,
.dashboard-root .modal-label,
.dashboard-root .modal-muted {
  color: var(--gugu-muted) !important;
}

/* The overview metric tiles are anonymous inline-styled divs. Scope the
   override to the flex row immediately following the hero so other layouts
   and runtime dialogs are unaffected. */
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div {
  background: #ffffff !important;
  border: 1px solid var(--gugu-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 16px rgba(22,79,134,.10) !important;
  color: var(--gugu-ink) !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div > div[style*="border-radius"] {
  background: var(--gugu-blue-50) !important;
  border-color: var(--gugu-blue-200) !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:first-child {
  color: var(--gugu-muted) !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:nth-child(2) {
  color: var(--gugu-blue-700) !important;
}

/* Device toolbar, filters and custom table controls. */
.dashboard-root .rc-device-toolbar input,
.dashboard-root .rc-device-toolbar select,
.dashboard-root .rc-device-toolbar button,
.dashboard-root .batch-bar input,
.dashboard-root .batch-bar select,
.dashboard-root .batch-bar button,
.dashboard-root .rc-pagination select,
.dashboard-root .rc-pagination button {
  background: #ffffff !important;
  border-color: var(--gugu-blue-200) !important;
  color: var(--gugu-blue-800) !important;
}
.dashboard-root .rc-device-toolbar input:focus,
.dashboard-root .batch-bar input:focus {
  border-color: var(--gugu-blue-500) !important;
  box-shadow: 0 0 0 2px rgba(61,142,216,.14) !important;
}
.dashboard-root .rc-table-wrap table,
.dashboard-root .rc-table-wrap thead,
.dashboard-root .rc-table-wrap tbody,
.dashboard-root .rc-table-wrap tr,
.dashboard-root .rc-table-wrap td,
.dashboard-root .rc-table-wrap th {
  background: #ffffff !important;
  border-color: var(--gugu-border) !important;
  color: var(--gugu-ink) !important;
}
.dashboard-root .rc-table-wrap th {
  background: var(--gugu-blue-50) !important;
  color: var(--gugu-blue-900) !important;
}
.dashboard-root .rc-table-wrap tr:hover td {
  background: var(--gugu-blue-100) !important;
}
.dashboard-root .batch-bar,
.dashboard-root .rc-pagination {
  padding: 10px 14px !important;
}

/* Custom status/action buttons that do not carry Ant classes. */
.dashboard-root .ctrl-qbtn,
.dashboard-root .sidebar-btn,
.dashboard-root .sidebar-btn-sm,
.dashboard-root .ctrl-tab-action {
  background: var(--gugu-blue-600) !important;
  border-color: var(--gugu-blue-600) !important;
  color: #ffffff !important;
}
.dashboard-root .ctrl-qbtn:hover,
.dashboard-root .sidebar-btn:hover,
.dashboard-root .sidebar-btn-sm:hover,
.dashboard-root .ctrl-tab-action:hover {
  background: var(--gugu-blue-700) !important;
  border-color: var(--gugu-blue-700) !important;
}
.dashboard-root .ctrl-header,
.dashboard-root .ctrl-tabs,
.dashboard-root .ctrl-tabs-bar,
.dashboard-root .home-tab-topbar {
  background: #ffffff !important;
  border-color: var(--gugu-border) !important;
}

/* Carbon-inspired final pass from the supplied DESIGN.md: a flat white
   enterprise canvas, charcoal type and one confident blue accent. */
:root {
  --carbon-blue: #0f62fe;
  --carbon-blue-hover: #0050e6;
  --carbon-blue-pressed: #002d9c;
  --carbon-ink: #161616;
  --carbon-muted: #525252;
  --carbon-subtle: #8c8c8c;
  --carbon-canvas: #ffffff;
  --carbon-surface: #f4f4f4;
  --carbon-border: #e0e0e0;
}

.dashboard-root,
.dashboard-root .rc-main,
.dashboard-root .rc-shell,
.dashboard-root .rc-content,
.control-page,
.control-page .rc-main {
  background: var(--carbon-canvas) !important;
  color: var(--carbon-ink) !important;
  font-family: "IBM Plex Sans", "Segoe UI", "Microsoft YaHei", sans-serif !important;
  letter-spacing: .16px !important;
}
.dashboard-root .dashboard-topbar {
  height: 48px !important;
  padding: 0 24px !important;
  background: var(--carbon-canvas) !important;
  border-bottom: 1px solid var(--carbon-border) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.dashboard-root .dashboard-hero,
.dashboard-root .rc-header,
.dashboard-root .rc-header-elevated,
.dashboard-root .rc-device-toolbar,
.dashboard-root .rc-table-wrap,
.dashboard-root .device-card,
.dashboard-root .panel,
.dashboard-root .s-card,
.dashboard-root .admin-add-form,
.dashboard-root .rc-pagination,
.dashboard-root .batch-bar {
  background: var(--carbon-canvas) !important;
  border: 1px solid var(--carbon-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.dashboard-root .dashboard-hero {
  min-height: 104px !important;
  padding: 24px !important;
  margin-bottom: 16px !important;
  background: var(--carbon-canvas) !important;
}
.dashboard-root .dashboard-hero h1 {
  margin: 0 !important;
  color: var(--carbon-ink) !important;
  font-size: 32px !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
.dashboard-root .dashboard-hero .hero-kicker {
  color: var(--carbon-muted) !important;
  font-size: 14px !important;
  letter-spacing: .16px !important;
  text-transform: none !important;
}
.dashboard-root .dashboard-hero::before,
.dashboard-root .dashboard-hero::after,
.dashboard-root::before,
.dashboard-root::after {
  display: none !important;
}

/* Flat metric tiles: the inner elements are inline-styled by the app, so
   these scoped rules intentionally use !important to preserve the visual
   system without touching the component's data or click handlers. */
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div {
  background: var(--carbon-canvas) !important;
  border: 1px solid var(--carbon-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 16px !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div > div[style*="border-radius"] {
  background: var(--carbon-surface) !important;
  border: 1px solid var(--carbon-border) !important;
  border-radius: 0 !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:first-child {
  color: var(--carbon-muted) !important;
  font-size: 14px !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:nth-child(2) {
  color: var(--carbon-blue) !important;
  font-size: 28px !important;
  font-weight: 600 !important;
}

.dashboard-root .ant-card,
.dashboard-root .ant-statistic,
.dashboard-root .ant-collapse,
.dashboard-root .ant-list,
.dashboard-root .ant-descriptions,
.dashboard-root .ant-alert,
.dashboard-root .ant-result,
.dashboard-root .ant-modal-content,
.dashboard-root .ant-drawer-content,
.dashboard-root .ant-popover-inner,
.dashboard-root .ant-dropdown-menu {
  border-radius: 0 !important;
  box-shadow: none !important;
}
.dashboard-root .ant-card,
.dashboard-root .ant-table,
.dashboard-root .ant-table-container,
.dashboard-root .ant-table-thead > tr > th,
.dashboard-root .ant-table-tbody > tr > td {
  border-color: var(--carbon-border) !important;
}
.dashboard-root .ant-table-thead > tr > th {
  background: var(--carbon-surface) !important;
  color: var(--carbon-ink) !important;
  font-weight: 600 !important;
}
.dashboard-root .ant-table-tbody > tr:hover > td {
  background: #edf5ff !important;
}
.dashboard-root .ant-btn,
.dashboard-root .ant-input,
.dashboard-root .ant-input-affix-wrapper,
.dashboard-root .ant-input-number,
.dashboard-root .ant-picker,
.dashboard-root .ant-select-selector,
.dashboard-root .ant-cascader-picker,
.dashboard-root .ant-upload.ant-upload-select-picture-card {
  border-radius: 0 !important;
  box-shadow: none !important;
  letter-spacing: .16px !important;
}
.dashboard-root .ant-input,
.dashboard-root .ant-input-affix-wrapper,
.dashboard-root .ant-input-number,
.dashboard-root .ant-picker,
.dashboard-root .ant-select-selector {
  background: var(--carbon-surface) !important;
  border-color: var(--carbon-border) !important;
  color: var(--carbon-ink) !important;
}
.dashboard-root .ant-input:focus,
.dashboard-root .ant-input-affix-wrapper-focused,
.dashboard-root .ant-input-number-focused,
.dashboard-root .ant-picker-focused,
.dashboard-root .ant-select-focused .ant-select-selector {
  border-color: var(--carbon-blue) !important;
  box-shadow: 0 0 0 1px var(--carbon-blue) !important;
}
.dashboard-root .ant-btn-primary,
.dashboard-root .ant-btn-primary:not(:disabled),
.dashboard-root .ctrl-qbtn,
.dashboard-root .sidebar-btn,
.dashboard-root .sidebar-btn-sm,
.dashboard-root .ctrl-tab-action {
  background: var(--carbon-blue) !important;
  border-color: var(--carbon-blue) !important;
  border-radius: 0 !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
.dashboard-root .ant-btn-primary:hover,
.dashboard-root .ctrl-qbtn:hover,
.dashboard-root .sidebar-btn:hover,
.dashboard-root .sidebar-btn-sm:hover,
.dashboard-root .ctrl-tab-action:hover {
  background: var(--carbon-blue-hover) !important;
  border-color: var(--carbon-blue-hover) !important;
}
.dashboard-root .ant-btn-default,
.dashboard-root .ant-btn-dashed {
  background: var(--carbon-canvas) !important;
  border-color: var(--carbon-ink) !important;
  border-radius: 0 !important;
  color: var(--carbon-ink) !important;
}
.dashboard-root .ant-btn-default:hover,
.dashboard-root .ant-btn-dashed:hover {
  color: var(--carbon-blue) !important;
  border-color: var(--carbon-blue) !important;
}
.dashboard-root .ant-menu-item,
.dashboard-root .ant-menu-submenu-title {
  border-radius: 0 !important;
  color: var(--carbon-muted) !important;
}
.dashboard-root .ant-menu-item-selected {
  background: var(--carbon-blue) !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.dashboard-root .ant-menu-item-selected::after {
  border-right-color: var(--carbon-blue) !important;
}
.dashboard-root .ant-tabs-tab,
.dashboard-root .ant-tabs-tab-btn {
  border-radius: 0 !important;
  color: var(--carbon-muted) !important;
}
.dashboard-root .ant-tabs-tab-active .ant-tabs-tab-btn,
.dashboard-root .ant-tabs-tab:hover {
  color: var(--carbon-blue) !important;
}
.dashboard-root .ant-tabs-ink-bar {
  background: var(--carbon-blue) !important;
}
.dashboard-root .ant-tag {
  border-radius: 2px !important;
  background: #edf5ff !important;
  border-color: #b8d4ff !important;
  color: var(--carbon-blue-pressed) !important;
}
.dashboard-root a,
.dashboard-root .ant-typography a,
.dashboard-root .ant-btn-link {
  color: var(--carbon-blue) !important;
}
.dashboard-root .ant-pagination-item,
.dashboard-root .ant-pagination-prev .ant-pagination-item-link,
.dashboard-root .ant-pagination-next .ant-pagination-item-link {
  border-radius: 0 !important;
  border-color: var(--carbon-border) !important;
  background: var(--carbon-canvas) !important;
}
.dashboard-root .ant-pagination-item-active {
  background: var(--carbon-blue) !important;
  border-color: var(--carbon-blue) !important;
}
  .dashboard-root .dashboard-hero { padding: 16px !important; }
  .dashboard-root .dashboard-hero h1 { font-size: 26px !important; }
  .dashboard-root .dashboard-topbar { padding: 0 16px !important; }

/* Linear-inspired product skin from the supplied design reference and the
   public linear.app product surface. This final layer intentionally replaces
   the earlier light theme as one coherent system. */
:root {
  --linear-canvas: #010102;
  --linear-surface-1: #0f1011;
  --linear-surface-2: #141516;
  --linear-surface-3: #18191a;
  --linear-border: #23252a;
  --linear-border-strong: #34343a;
  --linear-ink: #f7f8f8;
  --linear-muted: #d0d6e0;
  --linear-subtle: #8a8f98;
  --linear-tertiary: #62666d;
  --linear-primary: #5e6ad2;
  --linear-primary-hover: #828fff;
  --linear-primary-pressed: #5e69d1;
}

html,
body,
#root,
.dashboard-root,
.dashboard-root .rc-main,
.dashboard-root .rc-shell,
.dashboard-root .rc-content,
.control-page,
.control-page .rc-main {
  background: var(--linear-canvas) !important;
  color: var(--linear-ink) !important;
  font-family: Inter, "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif !important;
  letter-spacing: 0 !important;
}

/* Ensure the app's dark-mode token block cannot reintroduce the old palette. */
html[data-theme="dark"],
:root[data-theme="dark"] {
  color-scheme: dark !important;
  --fc-bg: var(--linear-canvas) !important;
  --fc-bg-deep: #000000 !important;
  --fc-bg-body: var(--linear-canvas) !important;
  --fc-bg-root: var(--linear-canvas) !important;
  --fc-bg-shell: var(--linear-canvas) !important;
  --fc-bg-page: var(--linear-canvas) !important;
  --fc-bg-panel: var(--linear-surface-1) !important;
  --fc-bg-sidebar: var(--linear-surface-1) !important;
  --fc-bg-topbar: var(--linear-surface-1) !important;
  --fc-surface: var(--linear-surface-1) !important;
  --fc-surface-hi: var(--linear-surface-2) !important;
  --fc-elevated: var(--linear-surface-3) !important;
  --fc-border: var(--linear-border) !important;
  --fc-border-soft: var(--linear-surface-2) !important;
  --fc-border-hi: var(--linear-border-strong) !important;
  --fc-primary: var(--linear-primary) !important;
  --fc-primary-hi: var(--linear-primary-hover) !important;
  --fc-primary-lo: var(--linear-primary-pressed) !important;
  --fc-text-hi: var(--linear-ink) !important;
  --fc-text: var(--linear-muted) !important;
  --fc-text-secondary: var(--linear-muted) !important;
  --fc-text-lo: var(--linear-subtle) !important;
  --fc-text-mute: var(--linear-tertiary) !important;
  --fc-accent: var(--linear-primary) !important;
  --fc-accent-hi: var(--linear-primary-hover) !important;
  --fc-info: var(--linear-primary) !important;
  --fc-blue: var(--linear-primary-hover) !important;
  --fc-shadow: none !important;
  --fc-shadow-sm: none !important;
  --fc-shadow-lg: none !important;
}

/* Login: one dark surface ladder shared with the product console. */
.login-page {
  background: var(--linear-canvas) !important;
  color: var(--linear-ink) !important;
}
.login-page .login-container {
  background: var(--linear-surface-1) !important;
  border: 1px solid var(--linear-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 80px rgba(0,0,0,.45) !important;
}
.login-page .login-brand {
  background: var(--linear-surface-2) !important;
  border-right: 1px solid var(--linear-border) !important;
  color: var(--linear-ink) !important;
}
.login-page .login-form-section,
.login-page .login-form-wrapper {
  background: var(--linear-surface-1) !important;
  color: var(--linear-ink) !important;
}
.login-page .login-form-header h2,
.login-page .login-form-header p,
.login-page .form-options,
.login-page .form-footer,
.login-page .ant-checkbox-label,
.login-page .brand-title,
.login-page .brand-line,
.login-page .brand-sub {
  color: var(--linear-ink) !important;
}
.login-page .login-form-header p,
.login-page .form-options,
.login-page .form-footer,
.login-page .form-footer span {
  color: var(--linear-subtle) !important;
}
.login-page .ant-input-affix-wrapper,
.login-page .ant-input,
.login-page .ant-input-affix-wrapper input {
  background: transparent !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-ink) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
.login-page .ant-input-affix-wrapper:hover,
.login-page .ant-input-affix-wrapper-focused,
.login-page .ant-input-affix-wrapper:focus-within {
  border-color: var(--linear-primary) !important;
  box-shadow: 0 0 0 3px rgba(94,106,210,.2) !important;
}
.login-page .ant-input::placeholder { color: var(--linear-tertiary) !important; }
.login-page .ant-input-prefix,
.login-page .ant-input-password-icon { color: var(--linear-subtle) !important; }
.login-page .ant-checkbox-inner {
  background: var(--linear-surface-2) !important;
  border-color: var(--linear-border-strong) !important;
  border-radius: 4px !important;
}
.login-page .ant-checkbox-checked .ant-checkbox-inner {
  background: var(--linear-primary) !important;
  border-color: var(--linear-primary) !important;
}
.login-page .forgot-link { color: var(--linear-primary-hover) !important; }
.login-page .login-button,
.login-page .ant-btn-primary {
  background: var(--linear-primary) !important;
  border-color: var(--linear-primary) !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  box-shadow: 0 8px 24px rgba(94,106,210,.24) !important;
}
.login-page .login-button:hover,
.login-page .ant-btn-primary:hover {
  background: var(--linear-primary-hover) !important;
  border-color: var(--linear-primary-hover) !important;
}
.login-page .brand-ring,
.login-page .brand-divider,
.login-page .brand-corner { border-color: var(--linear-primary) !important; }
.login-page .brand-glow,
.login-page .brand-aura,
.login-page .brand-sweep { opacity: .12 !important; }
.login-page .feature-item {
  background: var(--linear-surface-3) !important;
  border-color: var(--linear-border) !important;
  border-radius: 8px !important;
  color: var(--linear-muted) !important;
}
.login-page .feature-item:hover { background: var(--linear-surface-2) !important; }
.login-page .feature-icon { color: var(--linear-primary-hover) !important; border-color: var(--linear-border-strong) !important; }
.login-page .feature-desc,
.login-page .feature-text { color: var(--linear-muted) !important; }

/* Product console chrome. */
.dashboard-root .dashboard-topbar {
  height: 56px !important;
  padding: 0 24px !important;
  background: var(--linear-surface-1) !important;
  border-bottom: 1px solid var(--linear-border) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.dashboard-root .dashboard-hero,
.dashboard-root .rc-header,
.dashboard-root .rc-header-elevated,
.dashboard-root .rc-device-toolbar,
.dashboard-root .rc-table-wrap,
.dashboard-root .device-card,
.dashboard-root .panel,
.dashboard-root .s-card,
.dashboard-root .admin-add-form,
.dashboard-root .rc-pagination,
.dashboard-root .batch-bar {
  background: var(--linear-surface-1) !important;
  border: 1px solid var(--linear-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  color: var(--linear-ink) !important;
}
.dashboard-root .dashboard-hero {
  min-height: 104px !important;
  padding: 24px !important;
  margin-bottom: 16px !important;
  background: linear-gradient(135deg, #0f1011 0%, #141516 100%) !important;
}
.dashboard-root .dashboard-hero::before,
.dashboard-root .dashboard-hero::after,
.dashboard-root::before,
.dashboard-root::after { display: none !important; }
.dashboard-root .dashboard-hero h1,
.dashboard-root .rc-header,
.dashboard-root .rc-header-elevated,
.dashboard-root .panel h3,
.dashboard-root .panel h4 {
  color: var(--linear-ink) !important;
  background: none !important;
  text-shadow: none !important;
  -webkit-text-fill-color: currentColor !important;
}
.dashboard-root .dashboard-hero h1 {
  font-size: 28px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: -.6px !important;
}
.dashboard-root .dashboard-hero .hero-kicker {
  color: var(--linear-primary-hover) !important;
  font-size: 13px !important;
  letter-spacing: .4px !important;
}
.dashboard-root .dashboard-hero p,
.dashboard-root .rc-top-left span,
.dashboard-root .dc-label,
.dashboard-root .td-muted,
.dashboard-root .td-sm,
.dashboard-root .placeholder-panel,
.dashboard-root .s-card .s-title,
.dashboard-root .modal-label,
.dashboard-root .modal-muted {
  color: var(--linear-subtle) !important;
}

/* Overview metric tiles generated with inline styles. */
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div {
  background: var(--linear-surface-1) !important;
  border: 1px solid var(--linear-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  padding: 16px !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div > div[style*="border-radius"] {
  background: var(--linear-surface-3) !important;
  border: 1px solid var(--linear-border-strong) !important;
  border-radius: 8px !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:first-child {
  color: var(--linear-subtle) !important;
  font-size: 12px !important;
}
.dashboard-root .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:nth-child(2) {
  color: var(--linear-ink) !important;
  font-size: 28px !important;
  font-weight: 600 !important;
}

/* Ant and custom controls share the same surface ladder. */
.dashboard-root .ant-layout,
.dashboard-root .ant-layout-content,
.dashboard-root .ant-layout-footer,
.dashboard-root .ant-layout-sider,
.dashboard-root .ant-layout-sider-children,
.dashboard-root .ant-menu,
.dashboard-root .ant-menu-dark,
.dashboard-root .ant-menu-dark .ant-menu-sub,
.dashboard-root .ctrl-sidebar,
.dashboard-root .ctrl-screen-area,
.dashboard-root .ctrl-sidebar-panel,
.dashboard-root .inj-layout {
  background: var(--linear-canvas) !important;
  color: var(--linear-ink) !important;
}
.dashboard-root .ant-layout-sider {
  background: var(--linear-surface-1) !important;
  border-right: 1px solid var(--linear-border) !important;
  box-shadow: none !important;
}
.dashboard-root .ant-menu-item,
.dashboard-root .ant-menu-submenu-title {
  color: var(--linear-muted) !important;
  border-radius: 8px !important;
}
.dashboard-root .ant-menu-item:hover,
.dashboard-root .ant-menu-submenu-title:hover {
  color: var(--linear-ink) !important;
  background: var(--linear-surface-3) !important;
}
.dashboard-root .ant-menu-item-selected {
  color: #ffffff !important;
  background: var(--linear-primary) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
.dashboard-root .ant-menu-item-selected::after { border-right-color: var(--linear-primary) !important; }
.dashboard-root .ant-card,
.dashboard-root .ant-statistic,
.dashboard-root .ant-collapse,
.dashboard-root .ant-list,
.dashboard-root .ant-descriptions,
.dashboard-root .ant-alert,
.dashboard-root .ant-result,
.dashboard-root .ant-modal-content,
.dashboard-root .ant-drawer-content,
.dashboard-root .ant-popover-inner,
.dashboard-root .ant-dropdown-menu,
.dashboard-root .ant-select-dropdown {
  background: var(--linear-surface-1) !important;
  border-color: var(--linear-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  color: var(--linear-ink) !important;
}
.dashboard-root .ant-card-head,
.dashboard-root .ant-modal-header,
.dashboard-root .ant-drawer-header,
.dashboard-root .ant-popover-title {
  background: var(--linear-surface-1) !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-ink) !important;
}
.dashboard-root .ant-card-head-title,
.dashboard-root .ant-card-extra,
.dashboard-root .ant-statistic-title,
.dashboard-root .ant-form-item-label > label,
.dashboard-root .ant-checkbox-wrapper,
.dashboard-root .ant-radio-wrapper {
  color: var(--linear-muted) !important;
}
.dashboard-root .ant-table,
.dashboard-root .ant-table-container,
.dashboard-root .ant-table-content,
.dashboard-root .ant-table-thead > tr > th,
.dashboard-root .ant-table-tbody > tr > td,
.dashboard-root .rc-table-wrap table,
.dashboard-root .rc-table-wrap thead,
.dashboard-root .rc-table-wrap tbody,
.dashboard-root .rc-table-wrap tr,
.dashboard-root .rc-table-wrap td,
.dashboard-root .rc-table-wrap th {
  background: var(--linear-surface-1) !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-muted) !important;
}
.dashboard-root .ant-table-thead > tr > th,
.dashboard-root .rc-table-wrap th { background: var(--linear-surface-2) !important; color: var(--linear-ink) !important; }
.dashboard-root .ant-table-tbody > tr:hover > td,
.dashboard-root .rc-table-wrap tr:hover td { background: var(--linear-surface-3) !important; }
.dashboard-root .ant-input,
.dashboard-root .ant-input-affix-wrapper,
.dashboard-root .ant-input-number,
.dashboard-root .ant-picker,
.dashboard-root .ant-select-selector,
.dashboard-root .rc-device-toolbar input,
.dashboard-root .rc-device-toolbar select,
.dashboard-root .batch-bar input,
.dashboard-root .batch-bar select {
  background: var(--linear-surface-2) !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-ink) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
.dashboard-root .ant-input::placeholder,
.dashboard-root .rc-device-toolbar input::placeholder,
.dashboard-root .batch-bar input::placeholder { color: var(--linear-tertiary) !important; }
.dashboard-root .ant-input:focus,
.dashboard-root .ant-input-affix-wrapper-focused,
.dashboard-root .ant-input-number-focused,
.dashboard-root .ant-picker-focused,
.dashboard-root .ant-select-focused .ant-select-selector,
.dashboard-root .rc-device-toolbar input:focus,
.dashboard-root .batch-bar input:focus {
  border-color: var(--linear-primary) !important;
  box-shadow: 0 0 0 3px rgba(94,106,210,.2) !important;
}
.dashboard-root .ant-btn,
.dashboard-root .rc-device-toolbar button,
.dashboard-root .batch-bar button,
.dashboard-root .rc-pagination button,
.dashboard-root .ctrl-qbtn,
.dashboard-root .sidebar-btn,
.dashboard-root .sidebar-btn-sm,
.dashboard-root .ctrl-tab-action {
  border-radius: 8px !important;
  box-shadow: none !important;
  font-weight: 500 !important;
}
.dashboard-root .ant-btn-primary,
.dashboard-root .ant-btn-primary:not(:disabled),
.dashboard-root .ctrl-qbtn,
.dashboard-root .sidebar-btn,
.dashboard-root .sidebar-btn-sm,
.dashboard-root .ctrl-tab-action {
  background: var(--linear-primary) !important;
  border-color: var(--linear-primary) !important;
  color: #ffffff !important;
}
.dashboard-root .ant-btn-primary:hover,
.dashboard-root .ctrl-qbtn:hover,
.dashboard-root .sidebar-btn:hover,
.dashboard-root .sidebar-btn-sm:hover,
.dashboard-root .ctrl-tab-action:hover {
  background: var(--linear-primary-hover) !important;
  border-color: var(--linear-primary-hover) !important;
}
.dashboard-root .ant-btn-default,
.dashboard-root .ant-btn-dashed,
.dashboard-root .rc-device-toolbar button,
.dashboard-root .batch-bar button,
.dashboard-root .rc-pagination button {
  background: var(--linear-surface-2) !important;
  border-color: var(--linear-border-strong) !important;
  color: var(--linear-muted) !important;
}
.dashboard-root .ant-btn-default:hover,
.dashboard-root .ant-btn-dashed:hover,
.dashboard-root .rc-device-toolbar button:hover,
.dashboard-root .batch-bar button:hover,
.dashboard-root .rc-pagination button:hover {
  border-color: var(--linear-primary) !important;
  color: var(--linear-primary-hover) !important;
}
.dashboard-root a,
.dashboard-root .ant-typography a,
.dashboard-root .ant-btn-link { color: var(--linear-primary-hover) !important; }
.dashboard-root .ant-tabs-tab,
.dashboard-root .ant-tabs-tab-btn { color: var(--linear-subtle) !important; }
.dashboard-root .ant-tabs-tab:hover,
.dashboard-root .ant-tabs-tab-active .ant-tabs-tab-btn { color: var(--linear-ink) !important; }
.dashboard-root .ant-tabs-ink-bar { background: var(--linear-primary) !important; }
.dashboard-root .ant-tag {
  background: var(--linear-surface-2) !important;
  border-color: var(--linear-border-strong) !important;
  color: var(--linear-muted) !important;
  border-radius: 9999px !important;
}
.dashboard-root .ant-pagination-item,
.dashboard-root .ant-pagination-prev .ant-pagination-item-link,
.dashboard-root .ant-pagination-next .ant-pagination-item-link {
  background: var(--linear-surface-2) !important;
  border-color: var(--linear-border) !important;
  border-radius: 8px !important;
}
.dashboard-root .ant-pagination-item a { color: var(--linear-muted) !important; }
.dashboard-root .ant-pagination-item-active { background: var(--linear-primary) !important; border-color: var(--linear-primary) !important; }
.dashboard-root .ant-pagination-item-active a { color: #ffffff !important; }
.dashboard-root .ant-modal-mask,
.dashboard-root .ant-drawer-mask { background: rgba(0,0,0,.72) !important; }
.dashboard-root .ctrl-header,
.dashboard-root .ctrl-tabs,
.dashboard-root .ctrl-tabs-bar,
.dashboard-root .home-tab-topbar,
.dashboard-root .sidebar-card,
.dashboard-root .inj-panel {
  background: var(--linear-surface-1) !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-ink) !important;
}
.dashboard-root .ctrl-header,
.dashboard-root .ctrl-tabs,
.dashboard-root .ctrl-tabs-bar { border-radius: 12px !important; }
.dashboard-root .sidebar-card-head { background: var(--linear-surface-2) !important; border-color: var(--linear-border) !important; color: var(--linear-muted) !important; }
.dashboard-root .sidebar-input,
.dashboard-root .sidebar-textarea { background: var(--linear-surface-2) !important; border-color: var(--linear-border) !important; color: var(--linear-ink) !important; }
  .login-page .login-container { border-radius: 12px !important; }
  .dashboard-root .dashboard-hero { padding: 16px !important; }
  .dashboard-root .dashboard-hero h1 { font-size: 24px !important; }
  .dashboard-root .dashboard-topbar { padding: 0 16px !important; }

/* DOM scope bridge: the authenticated shell is an Ant Layout without a
   dashboard-root class. These selectors are anchored to the app's real
   data-theme attribute so the new skin actually reaches every page. */
html[data-theme="dark"] body,
html[data-theme="dark"] #root,
html[data-theme="dark"] .ant-layout,
html[data-theme="dark"] .ant-layout-content {
  background: var(--linear-canvas) !important;
  color: var(--linear-ink) !important;
  font-family: Inter, "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif !important;
}
html[data-theme="dark"] .ant-layout-header {
  height: 56px !important;
  padding: 0 24px !important;
  background: var(--linear-surface-1) !important;
  border-bottom: 1px solid var(--linear-border) !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .ant-layout-sider,
html[data-theme="dark"] .ant-layout-sider-children,
html[data-theme="dark"] .ant-menu,
html[data-theme="dark"] .ant-menu-dark,
html[data-theme="dark"] .ant-menu-dark .ant-menu-sub {
  background: var(--linear-surface-1) !important;
  color: var(--linear-muted) !important;
}
html[data-theme="dark"] .ant-layout-sider {
  border-right: 1px solid var(--linear-border) !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .ant-menu-item,
html[data-theme="dark"] .ant-menu-submenu-title {
  color: var(--linear-muted) !important;
  border-radius: 8px !important;
}
html[data-theme="dark"] .ant-menu-item:hover,
html[data-theme="dark"] .ant-menu-submenu-title:hover {
  color: var(--linear-ink) !important;
  background: var(--linear-surface-3) !important;
}
html[data-theme="dark"] .ant-menu-item-selected {
  color: #ffffff !important;
  background: var(--linear-primary) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .ant-menu-item-selected::after { border-right-color: var(--linear-primary) !important; }

html[data-theme="dark"] .dashboard-hero,
html[data-theme="dark"] .rc-header,
html[data-theme="dark"] .rc-header-elevated,
html[data-theme="dark"] .rc-device-toolbar,
html[data-theme="dark"] .rc-table-wrap,
html[data-theme="dark"] .device-card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .s-card,
html[data-theme="dark"] .admin-add-form,
html[data-theme="dark"] .rc-pagination,
html[data-theme="dark"] .batch-bar {
  background: var(--linear-surface-1) !important;
  border: 1px solid var(--linear-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  color: var(--linear-ink) !important;
}
html[data-theme="dark"] .dashboard-hero {
  min-height: 104px !important;
  padding: 24px !important;
  margin-bottom: 16px !important;
  background: linear-gradient(135deg, #0f1011 0%, #141516 100%) !important;
}
html[data-theme="dark"] .dashboard-hero::before,
html[data-theme="dark"] .dashboard-hero::after { display: none !important; }
html[data-theme="dark"] .dashboard-hero h1,
html[data-theme="dark"] .rc-header,
html[data-theme="dark"] .rc-header-elevated,
html[data-theme="dark"] .panel h3,
html[data-theme="dark"] .panel h4 {
  color: var(--linear-ink) !important;
  background: none !important;
  text-shadow: none !important;
  -webkit-text-fill-color: currentColor !important;
}
html[data-theme="dark"] .dashboard-hero h1 {
  font-size: 28px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: -.6px !important;
}
html[data-theme="dark"] .dashboard-hero .hero-kicker {
  color: var(--linear-primary-hover) !important;
  font-size: 13px !important;
  letter-spacing: .4px !important;
}
html[data-theme="dark"] .dashboard-hero p,
html[data-theme="dark"] .rc-top-left span,
html[data-theme="dark"] .dc-label,
html[data-theme="dark"] .td-muted,
html[data-theme="dark"] .td-sm,
html[data-theme="dark"] .placeholder-panel,
html[data-theme="dark"] .s-card .s-title,
html[data-theme="dark"] .modal-label,
html[data-theme="dark"] .modal-muted { color: var(--linear-subtle) !important; }

html[data-theme="dark"] .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div {
  background: var(--linear-surface-1) !important;
  border: 1px solid var(--linear-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  padding: 16px !important;
}
html[data-theme="dark"] .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div > div[style*="border-radius"] {
  background: var(--linear-surface-3) !important;
  border: 1px solid var(--linear-border-strong) !important;
  border-radius: 8px !important;
}
html[data-theme="dark"] .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:first-child { color: var(--linear-subtle) !important; }
html[data-theme="dark"] .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:nth-child(2) {
  color: var(--linear-ink) !important;
  font-size: 28px !important;
  font-weight: 600 !important;
}

html[data-theme="dark"] .ant-card,
html[data-theme="dark"] .ant-statistic,
html[data-theme="dark"] .ant-collapse,
html[data-theme="dark"] .ant-list,
html[data-theme="dark"] .ant-descriptions,
html[data-theme="dark"] .ant-alert,
html[data-theme="dark"] .ant-result,
html[data-theme="dark"] .ant-modal-content,
html[data-theme="dark"] .ant-drawer-content,
html[data-theme="dark"] .ant-popover-inner,
html[data-theme="dark"] .ant-dropdown-menu,
html[data-theme="dark"] .ant-select-dropdown {
  background: var(--linear-surface-1) !important;
  border-color: var(--linear-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  color: var(--linear-ink) !important;
}
html[data-theme="dark"] .ant-card-head,
html[data-theme="dark"] .ant-modal-header,
html[data-theme="dark"] .ant-drawer-header,
html[data-theme="dark"] .ant-popover-title {
  background: var(--linear-surface-1) !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-ink) !important;
}
html[data-theme="dark"] .ant-card-head-title,
html[data-theme="dark"] .ant-card-extra,
html[data-theme="dark"] .ant-statistic-title,
html[data-theme="dark"] .ant-form-item-label > label,
html[data-theme="dark"] .ant-checkbox-wrapper,
html[data-theme="dark"] .ant-radio-wrapper { color: var(--linear-muted) !important; }
html[data-theme="dark"] .ant-table,
html[data-theme="dark"] .ant-table-container,
html[data-theme="dark"] .ant-table-content,
html[data-theme="dark"] .ant-table-thead > tr > th,
html[data-theme="dark"] .ant-table-tbody > tr > td,
html[data-theme="dark"] .rc-table-wrap table,
html[data-theme="dark"] .rc-table-wrap thead,
html[data-theme="dark"] .rc-table-wrap tbody,
html[data-theme="dark"] .rc-table-wrap tr,
html[data-theme="dark"] .rc-table-wrap td,
html[data-theme="dark"] .rc-table-wrap th {
  background: var(--linear-surface-1) !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-muted) !important;
}
html[data-theme="dark"] .ant-table-thead > tr > th,
html[data-theme="dark"] .rc-table-wrap th { background: var(--linear-surface-2) !important; color: var(--linear-ink) !important; }
html[data-theme="dark"] .ant-table-tbody > tr:hover > td,
html[data-theme="dark"] .rc-table-wrap tr:hover td { background: var(--linear-surface-3) !important; }

html[data-theme="dark"] .ant-input,
html[data-theme="dark"] .ant-input-affix-wrapper,
html[data-theme="dark"] .ant-input-number,
html[data-theme="dark"] .ant-picker,
html[data-theme="dark"] .ant-select-selector,
html[data-theme="dark"] .rc-device-toolbar input,
html[data-theme="dark"] .rc-device-toolbar select,
html[data-theme="dark"] .batch-bar input,
html[data-theme="dark"] .batch-bar select {
  background: var(--linear-surface-2) !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-ink) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .ant-input::placeholder,
html[data-theme="dark"] .rc-device-toolbar input::placeholder,
html[data-theme="dark"] .batch-bar input::placeholder { color: var(--linear-tertiary) !important; }
html[data-theme="dark"] .ant-input:focus,
html[data-theme="dark"] .ant-input-affix-wrapper-focused,
html[data-theme="dark"] .ant-input-number-focused,
html[data-theme="dark"] .ant-picker-focused,
html[data-theme="dark"] .ant-select-focused .ant-select-selector,
html[data-theme="dark"] .rc-device-toolbar input:focus,
html[data-theme="dark"] .batch-bar input:focus {
  border-color: var(--linear-primary) !important;
  box-shadow: 0 0 0 3px rgba(94,106,210,.2) !important;
}
html[data-theme="dark"] .ant-btn,
html[data-theme="dark"] .rc-device-toolbar button,
html[data-theme="dark"] .batch-bar button,
html[data-theme="dark"] .rc-pagination button,
html[data-theme="dark"] .ctrl-qbtn,
html[data-theme="dark"] .sidebar-btn,
html[data-theme="dark"] .sidebar-btn-sm,
html[data-theme="dark"] .ctrl-tab-action {
  border-radius: 8px !important;
  box-shadow: none !important;
  font-weight: 500 !important;
}
html[data-theme="dark"] .ant-btn-primary,
html[data-theme="dark"] .ant-btn-primary:not(:disabled),
html[data-theme="dark"] .ctrl-qbtn,
html[data-theme="dark"] .sidebar-btn,
html[data-theme="dark"] .sidebar-btn-sm,
html[data-theme="dark"] .ctrl-tab-action {
  background: var(--linear-primary) !important;
  border-color: var(--linear-primary) !important;
  color: #ffffff !important;
}
html[data-theme="dark"] .ant-btn-primary:hover,
html[data-theme="dark"] .ctrl-qbtn:hover,
html[data-theme="dark"] .sidebar-btn:hover,
html[data-theme="dark"] .sidebar-btn-sm:hover,
html[data-theme="dark"] .ctrl-tab-action:hover {
  background: var(--linear-primary-hover) !important;
  border-color: var(--linear-primary-hover) !important;
}
html[data-theme="dark"] .ant-btn-default,
html[data-theme="dark"] .ant-btn-dashed,
html[data-theme="dark"] .rc-device-toolbar button,
html[data-theme="dark"] .batch-bar button,
html[data-theme="dark"] .rc-pagination button {
  background: var(--linear-surface-2) !important;
  border-color: var(--linear-border-strong) !important;
  color: var(--linear-muted) !important;
}
html[data-theme="dark"] a,
html[data-theme="dark"] .ant-typography a,
html[data-theme="dark"] .ant-btn-link { color: var(--linear-primary-hover) !important; }
html[data-theme="dark"] .ant-tabs-tab,
html[data-theme="dark"] .ant-tabs-tab-btn { color: var(--linear-subtle) !important; }
html[data-theme="dark"] .ant-tabs-tab-active .ant-tabs-tab-btn,
html[data-theme="dark"] .ant-tabs-tab:hover { color: var(--linear-ink) !important; }
html[data-theme="dark"] .ant-tabs-ink-bar { background: var(--linear-primary) !important; }
html[data-theme="dark"] .ant-tag { background: var(--linear-surface-2) !important; border-color: var(--linear-border-strong) !important; color: var(--linear-muted) !important; }
html[data-theme="dark"] .ant-pagination-item,
html[data-theme="dark"] .ant-pagination-prev .ant-pagination-item-link,
html[data-theme="dark"] .ant-pagination-next .ant-pagination-item-link {
  background: var(--linear-surface-2) !important;
  border-color: var(--linear-border) !important;
  border-radius: 8px !important;
}
html[data-theme="dark"] .ant-pagination-item a { color: var(--linear-muted) !important; }
html[data-theme="dark"] .ant-pagination-item-active { background: var(--linear-primary) !important; border-color: var(--linear-primary) !important; }
html[data-theme="dark"] .ant-pagination-item-active a { color: #ffffff !important; }
html[data-theme="dark"] .ant-modal-mask,
html[data-theme="dark"] .ant-drawer-mask { background: rgba(0,0,0,.72) !important; }

html[data-theme="dark"] .ctrl-header,
html[data-theme="dark"] .ctrl-tabs,
html[data-theme="dark"] .ctrl-tabs-bar,
html[data-theme="dark"] .home-tab-topbar,
html[data-theme="dark"] .sidebar-card,
html[data-theme="dark"] .inj-panel {
  background: var(--linear-surface-1) !important;
  border-color: var(--linear-border) !important;
  color: var(--linear-ink) !important;
}
html[data-theme="dark"] .sidebar-card-head { background: var(--linear-surface-2) !important; border-color: var(--linear-border) !important; color: var(--linear-muted) !important; }
html[data-theme="dark"] .sidebar-input,
html[data-theme="dark"] .sidebar-textarea { background: var(--linear-surface-2) !important; border-color: var(--linear-border) !important; color: var(--linear-ink) !important; }
  html[data-theme="dark"] .dashboard-hero { padding: 16px !important; }
  html[data-theme="dark"] .dashboard-hero h1 { font-size: 24px !important; }
  html[data-theme="dark"] .ant-layout-header { padding: 0 16px !important; }

/* Miaoda-inspired crystal workspace: frosted glass surfaces, midnight
   canvas and a restrained blue-violet signal. This is the final visual layer
   for both authentication and the full device-management workspace. */
:root {
  --miaoda-bg: #030b1a;
  --miaoda-bg-soft: #070c14;
  --miaoda-surface: rgba(21, 27, 38, .78);
  --miaoda-surface-solid: #151b26;
  --miaoda-surface-raised: rgba(31, 42, 61, .86);
  --miaoda-border: rgba(255,255,255,.12);
  --miaoda-border-strong: rgba(116, 71, 251, .42);
  --miaoda-ink: #f7f7f9;
  --miaoda-muted: #a2abbd;
  --miaoda-subtle: #818999;
  --miaoda-blue: #0056f2;
  --miaoda-blue-hover: #2468f2;
  --miaoda-violet: #7447fb;
  --miaoda-cyan: #55d9ff;
  --miaoda-success: #20d291;
  --miaoda-shadow: 0 20px 60px rgba(0,0,0,.32);
}

html,
body,
#root,
html[data-theme="dark"] body,
html[data-theme="dark"] #root {
  background: var(--miaoda-bg) !important;
  color: var(--miaoda-ink) !important;
  font-family: Inter, "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif !important;
}

/* Login surface: a complete glass workspace instead of the previous light
   form card. */
.login-page {
  min-height: 100vh !important;
  padding: 36px !important;
  background:
    linear-gradient(135deg, rgba(0,86,242,.18), transparent 42%),
    linear-gradient(315deg, rgba(116,71,251,.16), transparent 45%),
    var(--miaoda-bg) !important;
  color: var(--miaoda-ink) !important;
}
.login-page::before,
.login-page::after { display: none !important; }
.login-page .login-container {
  width: min(1080px, 100%) !important;
  min-height: 640px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr) !important;
  overflow: hidden !important;
  background: rgba(7,12,20,.72) !important;
  border: 1px solid var(--miaoda-border) !important;
  border-radius: 24px !important;
  box-shadow: var(--miaoda-shadow), 0 0 0 1px rgba(116,71,251,.08) inset !important;
  backdrop-filter: blur(28px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(150%) !important;
}
.login-page .login-brand {
  min-width: 0 !important;
  padding: 64px 56px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  background:
    linear-gradient(145deg, rgba(0,86,242,.34), rgba(116,71,251,.18) 54%, rgba(3,11,26,.12)),
    rgba(21,27,38,.58) !important;
  border-right: 1px solid var(--miaoda-border) !important;
  color: var(--miaoda-ink) !important;
}
.login-page .login-form-section,
.login-page .login-form-wrapper {
  min-width: 0 !important;
  padding: 56px !important;
  background: rgba(15,20,31,.74) !important;
  color: var(--miaoda-ink) !important;
}
.login-page .login-form-header h2 {
  margin-bottom: 10px !important;
  color: var(--miaoda-ink) !important;
  font-size: 34px !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
  letter-spacing: -.8px !important;
}
.login-page .login-form-header p,
.login-page .form-options,
.login-page .form-footer,
.login-page .form-footer span { color: var(--miaoda-muted) !important; }
.login-page .brand-title,
.login-page .brand-line,
.login-page .brand-sub { color: var(--miaoda-ink) !important; }
.login-page .brand-title { font-size: clamp(42px, 5vw, 72px) !important; font-weight: 600 !important; letter-spacing: -2px !important; }
.login-page .brand-sub { color: var(--miaoda-muted) !important; letter-spacing: .4px !important; }
.login-page .ant-input-affix-wrapper,
.login-page .ant-input,
.login-page .ant-input-affix-wrapper input {
  min-height: 48px !important;
  background: transparent !important;
  border: 1px solid var(--miaoda-border) !important;
  border-radius: 10px !important;
  color: var(--miaoda-ink) !important;
  box-shadow: none !important;
}
.login-page .ant-input-affix-wrapper:hover,
.login-page .ant-input-affix-wrapper-focused,
.login-page .ant-input-affix-wrapper:focus-within {
  border-color: var(--miaoda-violet) !important;
  box-shadow: 0 0 0 3px rgba(116,71,251,.2) !important;
}
.login-page .ant-input::placeholder { color: var(--miaoda-subtle) !important; }
.login-page .ant-input-prefix,
.login-page .ant-input-password-icon { color: var(--miaoda-subtle) !important; }
.login-page .ant-checkbox-inner { background: var(--miaoda-surface-solid) !important; border-color: var(--miaoda-border-strong) !important; border-radius: 5px !important; }
.login-page .ant-checkbox-checked .ant-checkbox-inner { background: var(--miaoda-violet) !important; border-color: var(--miaoda-violet) !important; }
.login-page .forgot-link { color: var(--miaoda-cyan) !important; }
.login-page .login-button,
.login-page .ant-btn-primary {
  min-height: 48px !important;
  background: linear-gradient(135deg, var(--miaoda-blue), var(--miaoda-violet)) !important;
  border: 0 !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  box-shadow: 0 12px 28px rgba(0,86,242,.28) !important;
  font-weight: 600 !important;
}
.login-page .login-button:hover,
.login-page .ant-btn-primary:hover { filter: brightness(1.1) !important; }
.login-page .feature-item {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 12px !important;
  color: var(--miaoda-muted) !important;
  backdrop-filter: blur(12px) !important;
}
.login-page .feature-item:hover { background: rgba(116,71,251,.14) !important; border-color: rgba(116,71,251,.42) !important; }
.login-page .feature-icon { color: var(--miaoda-cyan) !important; border-color: rgba(85,217,255,.42) !important; }
.login-page .feature-desc,
.login-page .feature-text { color: var(--miaoda-muted) !important; }
.login-page .brand-ring,
.login-page .brand-divider,
.login-page .brand-corner { border-color: var(--miaoda-cyan) !important; }

/* Authenticated workspace root and chrome. */
html[data-theme="dark"] .ant-layout {
  min-height: 100vh !important;
  background: linear-gradient(135deg, #030b1a 0%, #07152d 46%, #11102d 100%) !important;
  color: var(--miaoda-ink) !important;
}
html[data-theme="dark"] .ant-layout-header {
  height: 60px !important;
  padding: 0 28px !important;
  background: rgba(7,12,20,.74) !important;
  border-bottom: 1px solid var(--miaoda-border) !important;
  box-shadow: none !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
}
html[data-theme="dark"] .ant-layout-sider,
html[data-theme="dark"] .ant-layout-sider-children {
  background: rgba(7,12,20,.62) !important;
  border-right: 1px solid var(--miaoda-border) !important;
  box-shadow: none !important;
  backdrop-filter: blur(22px) !important;
  -webkit-backdrop-filter: blur(22px) !important;
}
html[data-theme="dark"] .ant-layout-content {
  padding: 28px !important;
  background: transparent !important;
}
html[data-theme="dark"] .brand-lockup { padding: 28px 24px 24px !important; }
html[data-theme="dark"] .brand-lockup-name { color: var(--miaoda-ink) !important; font-size: 24px !important; font-weight: 600 !important; letter-spacing: -.5px !important; }
html[data-theme="dark"] .brand-lockup-sub { color: var(--miaoda-subtle) !important; }
html[data-theme="dark"] .ant-menu,
html[data-theme="dark"] .ant-menu-dark,
html[data-theme="dark"] .ant-menu-dark .ant-menu-sub { background: transparent !important; color: var(--miaoda-muted) !important; }
html[data-theme="dark"] .ant-menu-item,
html[data-theme="dark"] .ant-menu-submenu-title { color: var(--miaoda-muted) !important; border-radius: 9px !important; margin: 4px 12px !important; width: auto !important; }
html[data-theme="dark"] .ant-menu-item:hover,
html[data-theme="dark"] .ant-menu-submenu-title:hover { background: rgba(255,255,255,.07) !important; color: var(--miaoda-ink) !important; }
html[data-theme="dark"] .ant-menu-item-selected { background: linear-gradient(135deg, rgba(0,86,242,.92), rgba(116,71,251,.86)) !important; color: #ffffff !important; box-shadow: 0 10px 24px rgba(0,86,242,.24) !important; }
html[data-theme="dark"] .ant-menu-item-selected::after { border-right-color: transparent !important; }

/* Crystal panels and metric cards. */
html[data-theme="dark"] .dashboard-hero,
html[data-theme="dark"] .rc-header,
html[data-theme="dark"] .rc-header-elevated,
html[data-theme="dark"] .rc-device-toolbar,
html[data-theme="dark"] .rc-table-wrap,
html[data-theme="dark"] .device-card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .s-card,
html[data-theme="dark"] .admin-add-form,
html[data-theme="dark"] .rc-pagination,
html[data-theme="dark"] .batch-bar,
html[data-theme="dark"] .ctrl-header,
html[data-theme="dark"] .ctrl-tabs,
html[data-theme="dark"] .ctrl-tabs-bar,
html[data-theme="dark"] .home-tab-topbar,
html[data-theme="dark"] .sidebar-card,
html[data-theme="dark"] .inj-panel {
  background: var(--miaoda-surface) !important;
  border: 1px solid var(--miaoda-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--miaoda-shadow) !important;
  color: var(--miaoda-ink) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
}
html[data-theme="dark"] .dashboard-hero {
  min-height: 132px !important;
  padding: 30px 32px !important;
  margin-bottom: 20px !important;
  background: linear-gradient(135deg, rgba(0,86,242,.2), rgba(116,71,251,.1) 48%, rgba(21,27,38,.82)) !important;
}
html[data-theme="dark"] .dashboard-hero::before,
html[data-theme="dark"] .dashboard-hero::after { display: none !important; }
html[data-theme="dark"] .dashboard-hero h1,
html[data-theme="dark"] .rc-header,
html[data-theme="dark"] .rc-header-elevated,
html[data-theme="dark"] .panel h3,
html[data-theme="dark"] .panel h4 { color: var(--miaoda-ink) !important; text-shadow: none !important; }
html[data-theme="dark"] .dashboard-hero h1 { font-size: 34px !important; font-weight: 600 !important; letter-spacing: -1px !important; }
html[data-theme="dark"] .hero-kicker { color: var(--miaoda-cyan) !important; font-size: 12px !important; letter-spacing: 1.6px !important; }
html[data-theme="dark"] .dashboard-hero p,
html[data-theme="dark"] .rc-top-left span,
html[data-theme="dark"] .dc-label,
html[data-theme="dark"] .td-muted,
html[data-theme="dark"] .td-sm,
html[data-theme="dark"] .placeholder-panel,
html[data-theme="dark"] .s-card .s-title,
html[data-theme="dark"] .modal-label,
html[data-theme="dark"] .modal-muted { color: var(--miaoda-muted) !important; }
html[data-theme="dark"] .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div {
  min-height: 112px !important;
  padding: 18px !important;
  background: linear-gradient(145deg, rgba(21,27,38,.88), rgba(31,42,61,.68)) !important;
  border: 1px solid var(--miaoda-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.22) !important;
}
html[data-theme="dark"] .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div > div:last-child {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 12px !important;
}
html[data-theme="dark"] .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:first-child { color: var(--miaoda-subtle) !important; }
html[data-theme="dark"] .dashboard-hero ~ div[style*="display: flex"][style*="flex-wrap: wrap"] > div > div span:nth-child(2) { color: var(--miaoda-ink) !important; font-size: 30px !important; font-weight: 600 !important; }

/* Forms, tables, tags, tabs and overlays. */
html[data-theme="dark"] .ant-card,
html[data-theme="dark"] .ant-statistic,
html[data-theme="dark"] .ant-collapse,
html[data-theme="dark"] .ant-list,
html[data-theme="dark"] .ant-descriptions,
html[data-theme="dark"] .ant-alert,
html[data-theme="dark"] .ant-result,
html[data-theme="dark"] .ant-modal-content,
html[data-theme="dark"] .ant-drawer-content,
html[data-theme="dark"] .ant-popover-inner,
html[data-theme="dark"] .ant-dropdown-menu,
html[data-theme="dark"] .ant-select-dropdown { background: var(--miaoda-surface-solid) !important; border-color: var(--miaoda-border) !important; border-radius: 14px !important; box-shadow: var(--miaoda-shadow) !important; color: var(--miaoda-ink) !important; }
html[data-theme="dark"] .ant-card-head,
html[data-theme="dark"] .ant-modal-header,
html[data-theme="dark"] .ant-drawer-header,
html[data-theme="dark"] .ant-popover-title { background: transparent !important; border-color: var(--miaoda-border) !important; color: var(--miaoda-ink) !important; }
html[data-theme="dark"] .ant-card-head-title,
html[data-theme="dark"] .ant-card-extra,
html[data-theme="dark"] .ant-statistic-title,
html[data-theme="dark"] .ant-form-item-label > label,
html[data-theme="dark"] .ant-checkbox-wrapper,
html[data-theme="dark"] .ant-radio-wrapper { color: var(--miaoda-muted) !important; }
html[data-theme="dark"] .ant-table,
html[data-theme="dark"] .ant-table-container,
html[data-theme="dark"] .ant-table-content,
html[data-theme="dark"] .ant-table-thead > tr > th,
html[data-theme="dark"] .ant-table-tbody > tr > td,
html[data-theme="dark"] .rc-table-wrap table,
html[data-theme="dark"] .rc-table-wrap thead,
html[data-theme="dark"] .rc-table-wrap tbody,
html[data-theme="dark"] .rc-table-wrap tr,
html[data-theme="dark"] .rc-table-wrap td,
html[data-theme="dark"] .rc-table-wrap th { background: transparent !important; border-color: var(--miaoda-border) !important; color: var(--miaoda-muted) !important; }
html[data-theme="dark"] .ant-table-thead > tr > th,
html[data-theme="dark"] .rc-table-wrap th { background: rgba(255,255,255,.05) !important; color: var(--miaoda-ink) !important; }
html[data-theme="dark"] .ant-table-tbody > tr:hover > td,
html[data-theme="dark"] .rc-table-wrap tr:hover td { background: rgba(116,71,251,.1) !important; }
html[data-theme="dark"] .ant-input,
html[data-theme="dark"] .ant-input-affix-wrapper,
html[data-theme="dark"] .ant-input-number,
html[data-theme="dark"] .ant-picker,
html[data-theme="dark"] .ant-select-selector,
html[data-theme="dark"] .rc-device-toolbar input,
html[data-theme="dark"] .rc-device-toolbar select,
html[data-theme="dark"] .batch-bar input,
html[data-theme="dark"] .batch-bar select { background: rgba(21,27,38,.88) !important; border-color: var(--miaoda-border) !important; color: var(--miaoda-ink) !important; border-radius: 10px !important; box-shadow: none !important; }
html[data-theme="dark"] .ant-input::placeholder,
html[data-theme="dark"] .rc-device-toolbar input::placeholder,
html[data-theme="dark"] .batch-bar input::placeholder { color: var(--miaoda-subtle) !important; }
html[data-theme="dark"] .ant-input:focus,
html[data-theme="dark"] .ant-input-affix-wrapper-focused,
html[data-theme="dark"] .ant-input-number-focused,
html[data-theme="dark"] .ant-picker-focused,
html[data-theme="dark"] .ant-select-focused .ant-select-selector,
html[data-theme="dark"] .rc-device-toolbar input:focus,
html[data-theme="dark"] .batch-bar input:focus { border-color: var(--miaoda-violet) !important; box-shadow: 0 0 0 3px rgba(116,71,251,.2) !important; }
html[data-theme="dark"] .ant-btn,
html[data-theme="dark"] .rc-device-toolbar button,
html[data-theme="dark"] .batch-bar button,
html[data-theme="dark"] .rc-pagination button,
html[data-theme="dark"] .ctrl-qbtn,
html[data-theme="dark"] .sidebar-btn,
html[data-theme="dark"] .sidebar-btn-sm,
html[data-theme="dark"] .ctrl-tab-action { border-radius: 10px !important; box-shadow: none !important; font-weight: 500 !important; }
html[data-theme="dark"] .ant-btn-primary,
html[data-theme="dark"] .ant-btn-primary:not(:disabled),
html[data-theme="dark"] .ctrl-qbtn,
html[data-theme="dark"] .sidebar-btn,
html[data-theme="dark"] .sidebar-btn-sm,
html[data-theme="dark"] .ctrl-tab-action { background: linear-gradient(135deg, var(--miaoda-blue), var(--miaoda-violet)) !important; border-color: transparent !important; color: #ffffff !important; }
html[data-theme="dark"] .ant-btn-primary:hover,
html[data-theme="dark"] .ctrl-qbtn:hover,
html[data-theme="dark"] .sidebar-btn:hover,
html[data-theme="dark"] .sidebar-btn-sm:hover,
html[data-theme="dark"] .ctrl-tab-action:hover { filter: brightness(1.12) !important; }
html[data-theme="dark"] .ant-btn-default,
html[data-theme="dark"] .ant-btn-dashed,
html[data-theme="dark"] .rc-device-toolbar button,
html[data-theme="dark"] .batch-bar button,
html[data-theme="dark"] .rc-pagination button { background: rgba(255,255,255,.06) !important; border-color: var(--miaoda-border) !important; color: var(--miaoda-muted) !important; }
html[data-theme="dark"] .ant-btn-default:hover,
html[data-theme="dark"] .ant-btn-dashed:hover,
html[data-theme="dark"] .rc-device-toolbar button:hover,
html[data-theme="dark"] .batch-bar button:hover,
html[data-theme="dark"] .rc-pagination button:hover { border-color: var(--miaoda-violet) !important; color: var(--miaoda-ink) !important; }
html[data-theme="dark"] a,
html[data-theme="dark"] .ant-typography a,
html[data-theme="dark"] .ant-btn-link { color: var(--miaoda-cyan) !important; }
html[data-theme="dark"] .ant-tabs-tab,
html[data-theme="dark"] .ant-tabs-tab-btn { color: var(--miaoda-subtle) !important; }
html[data-theme="dark"] .ant-tabs-tab-active .ant-tabs-tab-btn,
html[data-theme="dark"] .ant-tabs-tab:hover { color: var(--miaoda-ink) !important; }
html[data-theme="dark"] .ant-tabs-ink-bar { background: linear-gradient(90deg, var(--miaoda-blue), var(--miaoda-violet)) !important; }
html[data-theme="dark"] .ant-tag { background: rgba(116,71,251,.14) !important; border-color: rgba(116,71,251,.35) !important; color: #c5adff !important; border-radius: 9999px !important; }
html[data-theme="dark"] .ant-pagination-item,
html[data-theme="dark"] .ant-pagination-prev .ant-pagination-item-link,
html[data-theme="dark"] .ant-pagination-next .ant-pagination-item-link { background: rgba(255,255,255,.05) !important; border-color: var(--miaoda-border) !important; border-radius: 8px !important; }
html[data-theme="dark"] .ant-pagination-item a { color: var(--miaoda-muted) !important; }
html[data-theme="dark"] .ant-pagination-item-active { background: var(--miaoda-violet) !important; border-color: var(--miaoda-violet) !important; }
html[data-theme="dark"] .ant-pagination-item-active a { color: #ffffff !important; }
html[data-theme="dark"] .ant-modal-mask,
html[data-theme="dark"] .ant-drawer-mask { background: rgba(0,0,0,.72) !important; backdrop-filter: blur(8px) !important; }
  .login-page { padding: 16px !important; }
  .login-page .login-container { grid-template-columns: 1fr !important; min-height: auto !important; }
  .login-page .login-brand { padding: 36px 28px !important; border-right: 0 !important; border-bottom: 1px solid var(--miaoda-border) !important; }
  .login-page .login-form-section,
  .login-page .login-form-wrapper { padding: 32px 28px !important; }
  html[data-theme="dark"] .ant-layout-content { padding: 16px !important; }
  html[data-theme="dark"] .ant-layout-header { padding: 0 16px !important; }

/* Final inline-style bridge: overview and control screens render several
   anonymous wrappers with colors assigned directly in JSX. Keep those
   values inside the Miaoda palette without touching their behavior. */
html[data-theme="dark"] #root button,
html[data-theme="dark"] #root input,
html[data-theme="dark"] #root select,
html[data-theme="dark"] #root textarea {
  font-family: inherit !important;
}
html[data-theme="dark"] #root button[style*="#e63946"],
html[data-theme="dark"] #root button[style*="#ff4d6d"],
html[data-theme="dark"] #root button[style*="#fca311"],
html[data-theme="dark"] #root button[style*="rgb(230, 57, 70)"] {
  background: linear-gradient(135deg, var(--miaoda-blue), var(--miaoda-violet)) !important;
  border-color: transparent !important;
  color: #fff !important;
}
html[data-theme="dark"] #root [style*="#e63946"],
html[data-theme="dark"] #root [style*="#ff4d6d"],
html[data-theme="dark"] #root [style*="#fca311"],
html[data-theme="dark"] #root [style*="rgb(230, 57, 70)"] {
  border-color: var(--miaoda-border-strong) !important;
  color: var(--miaoda-cyan) !important;
}
html[data-theme="dark"] #root [style*="background:#e63946"],
html[data-theme="dark"] #root [style*="background: #e63946"],
html[data-theme="dark"] #root [style*="background:#ff4d6d"],
html[data-theme="dark"] #root [style*="background: #ff4d6d"],
html[data-theme="dark"] #root [style*="background:#fca311"],
html[data-theme="dark"] #root [style*="background: #fca311"] {
  background: rgba(0,86,242,.18) !important;
}
html[data-theme="dark"] #root .control-page,
html[data-theme="dark"] #root .ctrl-body,
html[data-theme="dark"] #root .ctrl-screen-area,
html[data-theme="dark"] #root .inj-layout,
html[data-theme="dark"] #root .fc-card,
html[data-theme="dark"] #root .fc-panel,
html[data-theme="dark"] #root .log-panel,
html[data-theme="dark"] #root .account-panel,
html[data-theme="dark"] #root .telegram-panel {
  color: var(--miaoda-ink) !important;
}
html[data-theme="dark"] #root .ctrl-device-row,
html[data-theme="dark"] #root .fc-card,
html[data-theme="dark"] #root .fc-panel,
html[data-theme="dark"] #root .log-panel,
html[data-theme="dark"] #root .account-panel,
html[data-theme="dark"] #root .telegram-panel,
html[data-theme="dark"] #root .inj-panel {
  background: var(--miaoda-surface) !important;
  border: 1px solid var(--miaoda-border) !important;
  border-radius: 14px !important;
  box-shadow: var(--miaoda-shadow) !important;
}
html[data-theme="dark"] #root .ctrl-tabs,
html[data-theme="dark"] #root .ctrl-tabs-bar,
html[data-theme="dark"] #root .inj-searchbar,
html[data-theme="dark"] #root .fc-header,
html[data-theme="dark"] #root .log-header {
  border-color: var(--miaoda-border) !important;
  background: rgba(255,255,255,.045) !important;
  color: var(--miaoda-muted) !important;
}

/* Miaoda-style landing/login composition: an image-led left story panel and
   a calm white action panel. The existing form nodes remain in place, so all
   submit, password, captcha and bind handlers continue to use their APIs. */
.login-page {
  padding: 28px !important;
  background: #edf5ff url('/miaoda-ice-field.png?v=blue20260905designreview7') center / cover no-repeat !important;
  color: #151b26 !important;
}
.login-page .login-container {
  max-width: 1180px !important;
  min-height: min(760px, calc(100vh - 56px)) !important;
  grid-template-columns: minmax(0, 1.12fr) minmax(390px, .88fr) !important;
  background: rgba(255,255,255,.78) !important;
  border: 1px solid rgba(21,27,38,.12) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 80px rgba(44,91,160,.18) !important;
  backdrop-filter: blur(24px) saturate(145%) !important;
}
.login-page .login-brand {
  position: relative !important;
  overflow: hidden !important;
  padding: 72px 64px !important;
  background: linear-gradient(145deg, rgba(237,247,255,.84), rgba(204,226,255,.64)) url('/miaoda-ice-field.png?v=blue20260905designreview7') center / cover no-repeat !important;
  border-right: 1px solid rgba(21,27,38,.1) !important;
  color: #151b26 !important;
}
.login-page .login-brand::after {
  content: "" !important;
  position: absolute !important;
  width: 360px !important;
  height: 360px !important;
  right: -110px !important;
  bottom: -130px !important;
  border: 1px solid rgba(0,86,242,.24) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 28px rgba(116,71,251,.06), 0 0 0 56px rgba(85,217,255,.05) !important;
  pointer-events: none !important;
}
.login-page .brand-title,
.login-page .brand-line { color: #151b26 !important; }
.login-page .brand-title { font-weight: 500 !important; letter-spacing: -1.5px !important; }
.login-page .brand-sub { color: #4f6078 !important; }
.login-page .brand-divider { border-color: rgba(0,86,242,.25) !important; }
.login-page .feature-item {
  background: rgba(255,255,255,.48) !important;
  border-color: rgba(0,86,242,.16) !important;
  color: #44536a !important;
  box-shadow: 0 8px 22px rgba(44,91,160,.08) !important;
}
.login-page .feature-text,
.login-page .feature-desc { color: #52647c !important; }
.login-page .login-form-section,
.login-page .login-form-wrapper {
  background: rgba(255,255,255,.92) !important;
  color: #151b26 !important;
}
.login-page .login-form-header h2 { color: #151b26 !important; font-weight: 600 !important; }
.login-page .login-form-header p,
.login-page .form-options,
.login-page .form-footer,
.login-page .form-footer span { color: #718096 !important; }
.login-page .ant-input-affix-wrapper,
.login-page .ant-input,
.login-page .ant-input-affix-wrapper input {
  background: transparent !important;
  border-color: #c8d7ea !important;
  color: #151b26 !important;
}
.login-page .ant-input::placeholder { color: #94a6bd !important; }
.login-page .login-button,
.login-page .ant-btn-primary {
  background: linear-gradient(135deg, #2468f2, #7447fb) !important;
  box-shadow: 0 12px 28px rgba(36,104,242,.24) !important;
}

/* Anonymous device toolbar rows use inline layout styles instead of stable
   class names; structural anchors keep the same Miaoda action treatment. */
html[data-theme="dark"] .dashboard-hero ~ div[style*="flex-wrap"] input,
html[data-theme="dark"] .dashboard-hero ~ div[style*="flex-wrap"] select,
html[data-theme="dark"] .dashboard-hero ~ div[style*="flex-wrap"] button,
html[data-theme="dark"] .ant-layout-content > div > div[style*="flex-wrap"] input,
html[data-theme="dark"] .ant-layout-content > div > div[style*="flex-wrap"] select,
html[data-theme="dark"] .ant-layout-content > div > div[style*="flex-wrap"] button {
  min-height: 36px !important;
  background: rgba(21,27,38,.72) !important;
  border: 1px solid var(--miaoda-border) !important;
  border-radius: 8px !important;
  color: var(--miaoda-muted) !important;
}
html[data-theme="dark"] .dashboard-hero ~ div[style*="flex-wrap"] button:hover,
html[data-theme="dark"] .ant-layout-content > div > div[style*="flex-wrap"] button:hover {
  border-color: var(--miaoda-violet) !important;
  color: var(--miaoda-ink) !important;
}
  .login-page { padding: 0 !important; }
  .login-page .login-container { border-radius: 0 !important; min-height: 100vh !important; }
  .login-page .login-brand { min-height: 42vh !important; padding: 42px 28px !important; }
  .login-page .login-form-section,
  .login-page .login-form-wrapper { padding: 34px 26px !important; }

/* Reference-home composition for the public entry: black exhibition canvas
   on the left, slim white action rail on the right. */
.login-page {
  padding: 0 !important;
  display: block !important;
  background: #09090b !important;
  color: #f4f4f5 !important;
}
.login-page .login-container {
  width: 100% !important;
  max-width: none !important;
  min-height: 100vh !important;
  height: 100vh !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 408px !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #09090b !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.login-page .login-brand {
  position: relative !important;
  overflow: hidden !important;
  min-height: 100vh !important;
  padding: 40px 48px 34px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: center !important;
  background:
    linear-gradient(180deg, rgba(9,9,11,.98) 0%, rgba(9,9,11,.9) 56%, rgba(9,9,11,.78) 100%),
    url('/miaoda-ice-field.png?v=blue20260905designreview7') center / cover no-repeat !important;
  border: 0 !important;
  color: #f4f4f5 !important;
}
.login-page .login-brand::before {
  content: "神州科技" !important;
  position: absolute !important;
  top: 30px !important;
  left: 48px !important;
  color: rgba(244,244,245,.76) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-style: italic !important;
  font-size: 16px !important;
  letter-spacing: .4px !important;
}
.login-page .brand-emblem,
.login-page .brand-logo,
.login-page .brand-ring,
.login-page .brand-glow,
.login-page .brand-aura,
.login-page .brand-corner { display: none !important; }
.login-page .brand-content {
  width: min(760px, 92%) !important;
  margin-top: clamp(108px, 17vh, 178px) !important;
  text-align: center !important;
  z-index: 1 !important;
}
.login-page .brand-title {
  margin: 0 !important;
  font-size: clamp(46px, 7vw, 92px) !important;
  line-height: 1.05 !important;
  font-weight: 200 !important;
  letter-spacing: .08em !important;
  color: #f4f4f5 !important;
  text-shadow: none !important;
}
.login-page .brand-title { font-size: 0 !important; }
.login-page .brand-title::before {
  content: "神州科技" !important;
  display: block !important;
  font-size: clamp(46px, 7vw, 92px) !important;
  font-weight: 200 !important;
  line-height: 1.05 !important;
  letter-spacing: .08em !important;
  color: #f4f4f5 !important;
}
.login-page .brand-title::after {
  content: "领导未来" !important;
  display: block !important;
  margin-top: 18px !important;
  color: rgba(244,244,245,.68) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-style: italic !important;
  font-size: clamp(18px, 2.3vw, 30px) !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}
.login-page .brand-sub { display: none !important; }
.login-page .brand-line,
.login-page .brand-divider { display: none !important; }
.login-page .brand-features {
  position: absolute !important;
  left: 48px !important;
  right: 48px !important;
  bottom: 30px !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: end !important;
  z-index: 2 !important;
}
.login-page .feature-item {
  min-height: 142px !important;
  padding: 18px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  align-items: flex-start !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.025)) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.3) !important;
  backdrop-filter: blur(10px) !important;
  color: rgba(244,244,245,.8) !important;
  transform-origin: center bottom !important;
}
.login-page .feature-item:nth-child(1) { transform: perspective(500px) rotateY(8deg) rotateZ(-2deg); }
.login-page .feature-item:nth-child(2) { min-height: 174px !important; }
.login-page .feature-item:nth-child(3) { transform: perspective(500px) rotateY(-8deg) rotateZ(2deg); }
.login-page .feature-icon { color: #55d9ff !important; border-color: rgba(85,217,255,.45) !important; }
.login-page .feature-text,
.login-page .feature-desc { color: rgba(244,244,245,.68) !important; }
.login-page .login-form-section,
.login-page .login-form-wrapper {
  min-height: 100vh !important;
  padding: 48px 32px !important;
  display: flex !important;
  align-items: center !important;
  background: #ffffff !important;
  color: #151b26 !important;
  border-left: 1px solid rgba(255,255,255,.08) !important;
}
.login-page .login-form-wrapper {
  width: 100% !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: center !important;
}
.login-page .login-form-wrapper .login-form-header {
  width: min(100%, 320px) !important;
  margin: 0 auto 22px !important;
}
  .login-page .login-container {
    position: relative !important;
    display: block !important;
  }
  .login-page .login-brand {
    width: 100% !important;
    min-height: 100vh !important;
  }
  .login-page .login-form-section {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 408px !important;
    height: 100vh !important;
    min-height: 100vh !important;
    transform: translate(-50%, -50%) !important;
    z-index: 10 !important;
    border-left: 1px solid rgba(21,27,38,.12) !important;
    border-right: 1px solid rgba(21,27,38,.12) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.32) !important;
  }
  .login-page .login-form-section,
  .login-page .login-form-wrapper {
    background: rgba(18, 22, 31, .9) !important;
    color: #f4f4f5 !important;
    border-color: rgba(255,255,255,.14) !important;
    backdrop-filter: blur(26px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(26px) saturate(135%) !important;
  }
  .login-page .login-form-header h2,
  .login-page .login-form-header h2::before { color: #f4f4f5 !important; }
  .login-page .login-form-header p,
  .login-page .login-form-header p::after,
  .login-page .form-options,
  .login-page .form-footer,
  .login-page .form-footer span { color: rgba(244,244,245,.62) !important; }
  .login-page .ant-input-affix-wrapper,
  .login-page .ant-input,
  .login-page .ant-input-affix-wrapper input {
    background: transparent !important;
    border-color: rgba(255,255,255,.16) !important;
    color: #f4f4f5 !important;
  }
  .login-page .ant-input::placeholder { color: rgba(244,244,245,.48) !important; }
  .login-page .ant-input-prefix,
  .login-page .ant-input-password-icon { color: rgba(244,244,245,.52) !important; }
  .login-page .ant-checkbox-inner { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.24) !important; }
  .login-page .forgot-link { color: #55d9ff !important; }
  .login-page .form-footer { border-color: rgba(255,255,255,.16) !important; }
  .login-page .login-form-section,
  .login-page .login-form-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  .login-page .login-container {
    position: relative !important;
    display: block !important;
    background: #09090b !important;
  }
  .login-page .login-brand {
    display: flex !important;
    width: 100% !important;
    min-height: 100vh !important;
    background: #09090b !important;
  }
  .login-page .login-form-section {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: min(390px, calc(100vw - 48px)) !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 34px 24px !important;
    transform: translate(-50%, -50%) !important;
    z-index: 10 !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 18px !important;
    background: rgba(18,22,31,.56) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.34), inset 0 0 30px rgba(255,255,255,.025) !important;
    backdrop-filter: blur(24px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(135%) !important;
  }
  .login-page .login-form-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  .login-page .login-brand { display: flex !important; min-height: 58vh !important; }
  .login-page .login-form-section { background: rgba(18,22,31,.62) !important; border: 1px solid rgba(255,255,255,.18) !important; }
  .login-page .login-form-section,
  .login-page .login-form-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  .login-page .login-container { display: block !important; background: #09090b !important; }
  .login-page .login-brand { display: none !important; }
  .login-page .login-form-section {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: min(390px, calc(100vw - 48px)) !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 38px 32px 34px !important;
    transform: translate(-50%, -50%) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    border-radius: 18px !important;
    background: rgba(18,22,31,.9) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.4) !important;
    backdrop-filter: blur(28px) saturate(135%) !important;
  }
  .login-page .login-form-wrapper {
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
  }
  .login-page .login-form-header { margin-bottom: 28px !important; }
  .login-page .form-options,
  .login-page .form-footer,
  .login-page .bind-tip,
  .login-page .login-step-panel,
  .login-page .forgot-link { display: none !important; }
  .login-page .login-form-wrapper form .ant-form-item:has(.form-options) { display: none !important; }
  .login-page .login-form-wrapper form .ant-form-item { margin-bottom: 14px !important; }
  .login-page .login-form-wrapper form .ant-form-item:last-child { margin-bottom: 0 !important; }
  .login-page .login-form-wrapper form,
  .login-page .login-form-wrapper .ant-form { max-width: none !important; }
  .login-page .login-form-header h2::before { content: "神州科技" !important; }
  .login-page .login-form-header p::after { content: "账号密码登录" !important; }
  .login-page .login-button,
  .login-page .ant-btn-primary { margin-top: 10px !important; }
  .login-page .login-brand { display: none !important; }
  .login-page .login-container { min-height: 100vh !important; background: #09090b !important; }
  .login-page .login-form-section { min-height: 100vh !important; padding: 28px 22px !important; background: transparent !important; }
  .login-page .login-form-wrapper { max-width: 390px !important; width: 100% !important; padding: 30px 24px !important; border: 1px solid rgba(255,255,255,.15) !important; border-radius: 18px !important; background: rgba(18,22,31,.9) !important; }
  .login-page .form-options,
  .login-page .form-footer,
  .login-page .bind-tip,
  .login-page .login-step-panel,
  .login-page .forgot-link { display: none !important; }
  .login-page .login-form-wrapper form .ant-form-item:has(.form-options) { display: none !important; }
  .login-page .login-form-wrapper form .ant-form-item { margin-bottom: 14px !important; }
  .login-page .login-form-wrapper form .ant-form-item:last-child { margin-bottom: 0 !important; }
  .login-page .login-form-section {
    width: min(390px, calc(100vw - 48px)) !important;
    padding: 34px 24px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  .login-page .login-form-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  .login-page .login-form-header { margin-bottom: 24px !important; }
  .login-page .ant-input-affix-wrapper,
  .login-page .ant-input,
  .login-page .ant-input-affix-wrapper input {
    background: transparent !important;
    border-color: rgba(255,255,255,.2) !important;
    color: #f4f4f5 !important;
    box-shadow: inset 0 0 24px rgba(255,255,255,.025) !important;
    backdrop-filter: blur(12px) !important;
  }
  .login-page .login-button,
  .login-page .ant-btn-primary { box-shadow: 0 10px 28px rgba(36,104,242,.18) !important; }
  .login-page .login-form-section { background: transparent !important; border: 0 !important; box-shadow: none !important; }
  .login-page .login-form-wrapper { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 24px 12px !important; }
  .login-page .ant-input-affix-wrapper,
  .login-page .ant-input,
  .login-page .ant-input-affix-wrapper input { background: transparent !important; border-color: rgba(255,255,255,.2) !important; color: #f4f4f5 !important; }
.login-page .login-form-header h2 {
  font-size: 0 !important;
  line-height: 1.15 !important;
  color: #151b26 !important;
}
.login-page .login-form-header h2::before {
  content: "神州科技" !important;
  display: block !important;
  font-size: 27px !important;
  font-weight: 650 !important;
  letter-spacing: .02em !important;
}
.login-page .login-form-header p {
  font-size: 0 !important;
  color: #7c8798 !important;
}
.login-page .login-form-header p::after {
  content: "账号登录 · 领导未来" !important;
  font-size: 14px !important;
}
.login-page .login-form-wrapper form,
.login-page .login-form-wrapper .ant-form {
  width: 100% !important;
  min-width: 0 !important;
  flex: 0 0 100% !important;
  max-width: 320px !important;
  margin: 0 auto !important;
}
.login-page .login-form-header h2 { color: #151b26 !important; font-size: 25px !important; font-weight: 600 !important; }
.login-page .login-form-header p,
.login-page .form-options,
.login-page .form-footer,
.login-page .form-footer span { color: #7c8798 !important; }
.login-page .ant-input-affix-wrapper,
.login-page .ant-input,
.login-page .ant-input-affix-wrapper input {
  background: transparent !important;
  border-color: #dbe3ee !important;
  color: #151b26 !important;
}
.login-page .login-button,
.login-page .ant-btn-primary {
  border-radius: 8px !important;
  background: linear-gradient(135deg, #2468f2, #7447fb) !important;
  box-shadow: none !important;
}
  .login-page .login-container { height: auto !important; min-height: 100vh !important; grid-template-columns: 1fr !important; }
  .login-page .login-brand { min-height: 58vh !important; }
  .login-page .login-form-section,
  .login-page .login-form-wrapper { min-height: 42vh !important; }
  .login-page .brand-features { left: 20px !important; right: 20px !important; gap: 8px !important; }
  .login-page .feature-item { min-height: 92px !important; padding: 12px !important; }

/* Exhibition finish: the visual rail uses a photographic poster strip and
   deliberately removes the previous blue-grid treatment. */
.login-page .login-brand {
  background: #09090b !important;
}
.login-page .login-brand::before {
  color: rgba(244,244,245,.72) !important;
  font-size: 15px !important;
  letter-spacing: .35px !important;
}
.login-page .brand-content::after {
  content: "神州科技" !important;
  display: block !important;
  width: min(520px, 88%) !important;
  height: 82px !important;
  margin: 42px auto 0 !important;
  padding: 23px 28px !important;
  box-sizing: border-box !important;
  border: 1px dashed rgba(255,255,255,.2) !important;
  border-radius: 16px !important;
  color: rgba(244,244,245,.82) !important;
  text-align: left !important;
  white-space: pre !important;
  font-family: Inter, "Segoe UI", sans-serif !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: inset 0 0 30px rgba(255,255,255,.015) !important;
  position: relative !important;
  z-index: 5 !important;
}
.login-page .brand-features {
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 260px !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  background: url('/gugu-gallery-strip.png?v=blue20260905designreview7') center bottom / cover no-repeat !important;
  z-index: 2 !important;
}
.login-page .brand-content { position: static !important; }
.login-page .brand-features::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, #09090b 0%, rgba(9,9,11,.06) 48%, rgba(9,9,11,.18) 100%) !important;
  pointer-events: none !important;
}
.login-page .brand-features .feature-item {
  flex: 1 1 33% !important;
  min-height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: none !important;
}
.login-page .login-form-header h2 { font-size: 0 !important; }
  .login-page .brand-features { height: 160px !important; }
  .login-page .brand-content::after { width: 310px !important; margin-top: 26px !important; }
  .login-page .login-form-section,
  .login-page .login-form-wrapper { background: rgba(18,22,31,.9) !important; color: #f4f4f5 !important; }
  .login-page .login-form-header h2,
  .login-page .login-form-header h2::before { color: #f4f4f5 !important; }
  .login-page .login-form-header p,
  .login-page .login-form-header p::after,
  .login-page .form-options,
  .login-page .form-footer,
  .login-page .form-footer span { color: rgba(244,244,245,.62) !important; }
  .login-page .ant-input-affix-wrapper,
  .login-page .ant-input,
  .login-page .ant-input-affix-wrapper input { background: transparent !important; border-color: rgba(255,255,255,.16) !important; color: #f4f4f5 !important; }
  .login-page .ant-input::placeholder { color: rgba(244,244,245,.48) !important; }
  .login-page .ant-input-prefix,
  .login-page .ant-input-password-icon { color: rgba(244,244,245,.52) !important; }
  .login-page .ant-checkbox-inner { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.24) !important; }
  .login-page .forgot-link { color: #55d9ff !important; }
  .login-page .form-footer { border-color: rgba(255,255,255,.16) !important; }
  .login-page .login-form-section,
  .login-page .login-form-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  .login-page .login-container { position: relative !important; display: block !important; background: #09090b !important; }
  .login-page .login-brand { display: flex !important; width: 100% !important; min-height: 100vh !important; background: #09090b !important; }
  .login-page .login-form-section {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: min(390px, calc(100vw - 48px)) !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 34px 24px !important;
    transform: translate(-50%, -50%) !important;
    z-index: 10 !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 18px !important;
    background: rgba(18,22,31,.56) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.34), inset 0 0 30px rgba(255,255,255,.025) !important;
    backdrop-filter: blur(24px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(135%) !important;
  }
  .login-page .login-form-wrapper { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
  .login-page .login-form-section {
    background: rgba(9,9,11,.18) !important;
    border-color: rgba(255,255,255,.08) !important;
    box-shadow: inset 0 0 48px rgba(255,255,255,.018) !important;
    backdrop-filter: blur(14px) saturate(120%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(120%) !important;
  }
  .login-page .login-form-wrapper { background: transparent !important; }
  .login-page .ant-input-affix-wrapper,
  .login-page .ant-input,
  .login-page .ant-input-affix-wrapper input {
    background: transparent !important;
    border-color: rgba(255,255,255,.16) !important;
  }
  .login-page .login-button,
  .login-page .ant-btn-primary { opacity: .94 !important; }
  .login-page .login-form-section,
  .login-page .login-form-wrapper {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .login-page .ant-input-affix-wrapper,
  .login-page .ant-input,
  .login-page .ant-input-affix-wrapper input {
    background: transparent !important;
    border-color: rgba(255,255,255,.18) !important;
    box-shadow: inset 0 0 18px rgba(255,255,255,.018) !important;
  }
  .login-page .login-button,
  .login-page .ant-btn-primary { box-shadow: 0 8px 24px rgba(36,104,242,.16) !important; }

/* Keep the previous poster background, but remove duplicate copy behind the
   inline form so the account controls remain legible. */
.login-page .login-brand::before,
.login-page .brand-title,
.login-page .brand-divider,
.login-page .brand-content::after { visibility: hidden !important; }

/* Curatorial hero layer: a typographic brand watermark behind the direct
   form, matching the reference page's oversized, light-weight composition. */
.login-page .login-brand::before {
  content: "神州科技" !important;
  visibility: visible !important;
  position: absolute !important;
  top: 30px !important;
  left: 48px !important;
  color: rgba(244,244,245,.72) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-style: italic !important;
  font-size: 15px !important;
  letter-spacing: .35px !important;
  z-index: 3 !important;
}
.login-page .brand-content::before {
  content: "神州科技" !important;
  white-space: pre !important;
  position: absolute !important;
  top: 92px !important;
  left: 0 !important;
  width: 100% !important;
  text-align: center !important;
  color: rgba(244,244,245,.9) !important;
  font-family: "Microsoft YaHei Light", "Noto Sans SC", sans-serif !important;
  font-size: clamp(48px, 7vw, 88px) !important;
  font-weight: 200 !important;
  line-height: 1.08 !important;
  letter-spacing: .12em !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
.login-page .login-form-header h2::before {
  content: "账号登录" !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  letter-spacing: .16em !important;
}
.login-page .login-form-header p::after {
  content: "神州科技" !important;
  font-size: 13px !important;
  letter-spacing: .08em !important;
}

/* Restore the authentication verification step hidden by the minimal shell. */
.login-page .login-step-panel,
.login-page .bind-tip {
  display: block !important;
  background: transparent !important;
  color: rgba(244,244,245,.72) !important;
}
.login-page .login-step-panel {
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.login-page .login-step-panel .ant-input,
.login-page .login-step-panel .ant-input-affix-wrapper {
  background: transparent !important;
  border-color: rgba(255,255,255,.18) !important;
  color: #f4f4f5 !important;
}
  .login-page .login-form-section,
  .login-page .login-form-wrapper {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .login-page .login-form-section { padding: 26px 24px !important; }
  .login-page .login-form-wrapper { padding: 0 !important; }
  .login-page .login-brand {
    position: relative !important;
    isolation: isolate !important;
    background:
      radial-gradient(circle at 74% 22%, rgba(38, 96, 177, .12), transparent 28%),
      linear-gradient(135deg, rgba(255,255,255,.025), transparent 38%),
      #090a0d !important;
  }

  .login-page .login-brand::before {
    content: "神州科技" !important;
    visibility: visible !important;
    position: absolute !important;
    top: 30px !important;
    left: 48px !important;
    color: rgba(244,248,255,.72) !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-style: italic !important;
    font-size: 15px !important;
    line-height: 1 !important;
    letter-spacing: .2em !important;
    z-index: 5 !important;
    pointer-events: none !important;
  }

  .login-page .brand-content::before {
    content: "神州科技" !important;
    white-space: pre !important;
    position: absolute !important;
    top: 112px !important;
    left: 7vw !important;
    width: 360px !important;
    text-align: left !important;
    color: rgba(244,248,255,.86) !important;
    font-family: "Microsoft YaHei Light", "Noto Sans SC", sans-serif !important;
    font-size: clamp(54px, 6.2vw, 82px) !important;
    font-weight: 200 !important;
    line-height: .98 !important;
    letter-spacing: .18em !important;
    text-shadow: 0 0 32px rgba(87,170,255,.08) !important;
    pointer-events: none !important;
    z-index: 1 !important;
  }

  .login-page .brand-content::after {
    content: "CONTROL PLATFORM  /  2026" !important;
    visibility: visible !important;
    display: block !important;
    position: absolute !important;
    top: 284px !important;
    left: 7vw !important;
    width: 300px !important;
    height: auto !important;
    margin: 0 !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(255,255,255,.2) !important;
    color: rgba(221,232,246,.48) !important;
    font-family: Arial, sans-serif !important;
    font-size: 10px !important;
    line-height: 1.4 !important;
    letter-spacing: .24em !important;
    text-align: left !important;
    z-index: 1 !important;
    pointer-events: none !important;
  }

  .login-page .login-form-section {
    top: 50% !important;
    left: 50% !important;
    width: min(360px, calc(100vw - 48px)) !important;
    padding: 24px 0 18px !important;
    transform: translate(-50%, -50%) !important;
    z-index: 10 !important;
  }

  .login-page .login-form-header {
    margin-bottom: 22px !important;
    text-align: left !important;
  }
  .login-page .login-form-header h2 {
    height: 22px !important;
    margin: 0 0 8px !important;
    font-size: 0 !important;
    line-height: 1 !important;
  }
  .login-page .login-form-header h2::before {
    content: "账号登录" !important;
    color: rgba(248,250,255,.94) !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    letter-spacing: .18em !important;
  }
  .login-page .login-form-header p {
    height: 16px !important;
    margin: 0 !important;
    font-size: 0 !important;
    line-height: 1 !important;
  }
  .login-page .login-form-header p::after {
    content: "神州科技" !important;
    color: rgba(220,231,245,.5) !important;
    font-size: 11px !important;
    letter-spacing: .14em !important;
  }

  .login-page .ant-form-item { margin-bottom: 12px !important; }
  .login-page .ant-input-affix-wrapper {
    height: 56px !important;
    padding: 0 16px !important;
    border: 1px solid rgba(228,240,255,.2) !important;
    border-radius: 12px !important;
    background: transparent !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 12px 30px rgba(0,0,0,.12) !important;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
  }
  .login-page .ant-input-affix-wrapper:hover,
  .login-page .ant-input-affix-wrapper-focused,
  .login-page .ant-input-affix-wrapper:focus-within {
    border-color: rgba(105,196,255,.78) !important;
    background: transparent !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 0 0 3px rgba(72,164,255,.1), 0 14px 32px rgba(0,0,0,.16) !important;
  }
  .login-page .ant-input-affix-wrapper .ant-input {
    height: 54px !important;
    padding: 0 10px !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    color: rgba(248,251,255,.94) !important;
    box-shadow: none !important;
  }
  .login-page .ant-input::placeholder { color: rgba(211,223,239,.48) !important; }
  .login-page .ant-input-prefix,
  .login-page .ant-input-password-icon { color: rgba(178,204,231,.62) !important; }

  .login-page .form-options {
    margin: 2px 2px 18px !important;
    color: rgba(214,225,238,.54) !important;
    font-size: 12px !important;
  }
  .login-page .forgot-link { color: #75caff !important; }
  .login-page .login-button,
  .login-page .ant-btn-primary {
    height: 54px !important;
    border: 1px solid rgba(172,224,255,.42) !important;
    border-radius: 12px !important;
    background: linear-gradient(105deg, #2868e8 0%, #3f9fff 100%) !important;
    box-shadow: 0 14px 28px rgba(35,111,218,.22), inset 0 1px 0 rgba(255,255,255,.25) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: .2em !important;
  }
  .login-page .form-footer {
    margin-top: 20px !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(255,255,255,.12) !important;
    color: rgba(214,225,238,.38) !important;
    font-size: 10px !important;
    letter-spacing: .08em !important;
    text-align: left !important;
  }
  .login-page,
  .login-page .login-container {
    min-height: 100vh !important;
    background:
      radial-gradient(circle at 50% 8%, rgba(48,119,211,.14), transparent 34%),
      linear-gradient(180deg, #090a0d 0%, #08090c 100%) !important;
  }
  .login-page .login-form-section {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: 24px 18px !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    color: rgba(244,248,255,.92) !important;
  }
  .login-page .login-form-wrapper {
    width: min(360px, calc(100vw - 36px)) !important;
    flex: 0 1 auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  .login-page .login-form-header {
    margin: 0 0 22px !important;
    text-align: left !important;
  }
  .login-page .login-form-header h2 {
    height: 22px !important;
    margin: 0 0 8px !important;
    font-size: 0 !important;
  }
  .login-page .login-form-header h2::before {
    content: "账号登录" !important;
    color: rgba(248,250,255,.94) !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    letter-spacing: .16em !important;
  }
  .login-page .login-form-header p {
    height: 16px !important;
    margin: 0 !important;
    font-size: 0 !important;
  }
  .login-page .login-form-header p::after {
    content: "神州科技" !important;
    color: rgba(220,231,245,.52) !important;
    font-size: 11px !important;
    letter-spacing: .1em !important;
  }
  .login-page .ant-form-item { margin-bottom: 12px !important; }
  .login-page .ant-input-affix-wrapper {
    height: 56px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(228,240,255,.2) !important;
    border-radius: 12px !important;
    background: transparent !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  }
  .login-page .ant-input-affix-wrapper:focus-within,
  .login-page .ant-input-affix-wrapper-focused {
    border-color: rgba(105,196,255,.78) !important;
    background: transparent !important;
    box-shadow: 0 0 0 3px rgba(72,164,255,.1) !important;
  }
  .login-page .ant-input-affix-wrapper .ant-input {
    height: 54px !important;
    padding: 0 10px !important;
    border: 0 !important;
    background: transparent !important;
    color: rgba(248,251,255,.94) !important;
    box-shadow: none !important;
  }
  .login-page .ant-input::placeholder { color: rgba(211,223,239,.5) !important; }
  .login-page .ant-input-prefix,
  .login-page .ant-input-password-icon { color: rgba(178,204,231,.62) !important; }
  .login-page .form-options {
    margin: 2px 2px 18px !important;
    color: rgba(214,225,238,.54) !important;
  }
  .login-page .forgot-link { color: #75caff !important; }
  .login-page .login-button,
  .login-page .ant-btn-primary {
    height: 54px !important;
    border: 1px solid rgba(172,224,255,.42) !important;
    border-radius: 12px !important;
    background: linear-gradient(105deg, #2868e8 0%, #3f9fff 100%) !important;
    box-shadow: 0 14px 28px rgba(35,111,218,.22), inset 0 1px 0 rgba(255,255,255,.25) !important;
  }
  .login-page .form-footer {
    margin-top: 20px !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(255,255,255,.12) !important;
    color: rgba(214,225,238,.38) !important;
    font-size: 10px !important;
    text-align: left !important;
  }
  .login-page .login-step-panel,
  .login-page .bind-tip { color: rgba(244,248,255,.72) !important; }

  .login-page .brand-content::before {
    content: "神州科技" !important;
    top: 58px !important;
    left: 24px !important;
    width: calc(100% - 48px) !important;
    font-size: clamp(38px, 12vw, 58px) !important;
    letter-spacing: .12em !important;
    text-align: center !important;
  }
  .login-page .brand-content::after {
    content: "CONTROL PLATFORM  /  2026" !important;
    top: 132px !important;
    left: 24px !important;
    width: calc(100% - 48px) !important;
    text-align: center !important;
  }
  .login-page .login-form-section {
    width: min(360px, calc(100vw - 36px)) !important;
    padding: 18px 0 !important;
  }
  .login-page .login-form-section {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: 24px 18px !important;
    box-sizing: border-box !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .login-page .login-form-wrapper {
    width: min(360px, calc(100vw - 36px)) !important;
    max-width: 100% !important;
    flex: 0 1 auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  .login-page .brand-content::before {
    left: 48px !important;
    width: 250px !important;
    font-size: clamp(46px, 5.5vw, 62px) !important;
  }
  .login-page .brand-content::after {
    left: 48px !important;
    width: 240px !important;
  }
  .login-page .login-form-section {
    left: auto !important;
    right: 38px !important;
    width: min(340px, 39vw) !important;
    transform: translateY(-50%) !important;
  }
  .login-page .login-button,
  .login-page .ant-btn-primary {
    background: linear-gradient(105deg, #1769ee 0%, #43b9ff 100%) !important;
  }

/* Theme-token specificity guard: the dark theme selector otherwise wins over
   the visual-only button treatment above. */
html[data-theme="dark"] .login-page .login-button,
html[data-theme="dark"] .login-page .ant-btn-primary {
  background: linear-gradient(105deg, #1769ee 0%, #43b9ff 100%) !important;
  border-color: rgba(172,224,255,.42) !important;
}
html[data-theme="dark"] .login-page .login-button:hover,
html[data-theme="dark"] .login-page .ant-btn-primary:hover {
  background: linear-gradient(105deg, #2879f2 0%, #62c7ff 100%) !important;
}
  .login-page .login-container {
    isolation: isolate !important;
    background: transparent !important;
  }
  .login-page .login-container::before {
    content: "神州科技" !important;
    position: absolute !important;
    top: 74px !important;
    left: 0 !important;
    width: 100% !important;
    color: rgba(225,239,255,.18) !important;
    font-family: "Microsoft YaHei Light", "Noto Sans SC", sans-serif !important;
    font-size: clamp(40px, 12vw, 58px) !important;
    font-weight: 200 !important;
    letter-spacing: .18em !important;
    line-height: 1 !important;
    text-align: center !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }
  .login-page .login-container::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 150px !important;
    background: linear-gradient(180deg, transparent, rgba(9,18,31,.84)), url('/gugu-gallery-strip.png?v=blue20260905designreview7') center bottom / cover no-repeat !important;
    opacity: .24 !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }
  .login-page .login-form-section,
  .login-page .login-form-wrapper { z-index: 1 !important; }
  .login-page {
    position: relative !important;
    overflow: hidden !important;
  }
  .login-page::before {
    content: "神州科技" !important;
    position: absolute !important;
    top: 74px !important;
    left: 0 !important;
    width: 100% !important;
    color: rgba(225,239,255,.18) !important;
    font-family: "Microsoft YaHei Light", "Noto Sans SC", sans-serif !important;
    font-size: clamp(40px, 12vw, 58px) !important;
    font-weight: 200 !important;
    letter-spacing: .18em !important;
    line-height: 1 !important;
    text-align: center !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }
  .login-page::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 150px !important;
    background: linear-gradient(180deg, transparent, rgba(9,18,31,.84)), url('/gugu-gallery-strip.png?v=blue20260905designreview7') center bottom / cover no-repeat !important;
    opacity: .24 !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }
  .login-page .login-container,
  .login-page .login-form-section,
  .login-page .login-form-wrapper {
    position: relative !important;
    z-index: 1 !important;
  }
  .login-page .login-button,
  .login-page .ant-btn-primary {
    background: linear-gradient(105deg, #1769ee 0%, #43b9ff 100%) !important;
  }