@charset "UTF-8";
/* Load last, after styles.css, classic.css and simulation.css.
 * Theme: body[data-theme="macau"] (default) / body[data-theme="hk"].
 * Components contain no data, event handlers or external assets.
 */
:root,
body[data-theme="macau"],
.theme-macau {
  --replica-width: 1300px;
  --replica-top: #064679;
  --replica-nav: #0562a8;
  --replica-nav-hover: #1d74b6;
  --replica-nav-active: #e4effa;
  --replica-nav-active-text: #064679;
  --replica-bg: #eff3ff;
  --replica-surface: #fff;
  --replica-soft: #f3f7fc;
  --replica-stripe: #f6f9ff;
  --replica-head: #d8e7f7;
  --replica-head-strong: #c6dbef;
  --replica-line: #b7c9dc;
  --replica-line-soft: #ced9e6;
  --replica-ink: #173c60;
  --replica-muted: #6f8196;
  --replica-link: #064fa0;
  --replica-focus: #76a7d4;
  --replica-warning: #fff4cd;
  --replica-warn-ink: #a46b09;
  --replica-positive: #167029;
  --replica-negative: #ce0000;
  --replica-control-line: #819ab4;
  --bg: var(--replica-bg);
  --surface: var(--replica-surface);
  --ink: var(--replica-ink);
  --subtle: var(--replica-muted);
  --line: var(--replica-line);
  --blue: var(--replica-nav);
  --blue-hover: var(--replica-top);
  --blue-soft: var(--replica-soft);
  --navy: var(--replica-top);
  --radius: 0;
  --shadow: none;
}
body[data-theme="hk"],
.theme-hk {
  --replica-top: #870000;
  --replica-nav: #a00000;
  --replica-nav-hover: #b52a2a;
  --replica-nav-active: #fff0bd;
  --replica-nav-active-text: #810000;
  --replica-bg: #fff0f0;
  --replica-surface: #fff;
  --replica-soft: #fff5f5;
  --replica-stripe: #fff7f7;
  --replica-head: #f4d8d8;
  --replica-head-strong: #edc3c3;
  --replica-line: #d3aaaa;
  --replica-line-soft: #e5c9c9;
  --replica-ink: #5b2828;
  --replica-muted: #956e6e;
  --replica-link: #980000;
  --replica-focus: #c78d8d;
  --replica-control-line: #b78c8c;
  --bg: var(--replica-bg);
  --surface: var(--replica-surface);
  --ink: var(--replica-ink);
  --subtle: var(--replica-muted);
  --line: var(--replica-line);
  --blue: var(--replica-nav);
  --blue-hover: var(--replica-top);
  --blue-soft: var(--replica-soft);
  --navy: var(--replica-top);
}

html { max-width: none; }
body { min-width: 0; max-width: none; margin: 0; overflow-x: auto; background: var(--replica-bg); color: var(--replica-ink); font: 12px/1.35 Arial, "SimSun", "宋体", serif; }
button, input, select, textarea { font-family: Arial, "SimSun", "宋体", serif; font-size: 12px; }
a { color: var(--replica-link); }
a:hover { color: var(--replica-link); text-decoration: underline; }
h1, h2, h3, h4 { color: var(--replica-ink); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--replica-focus); outline-offset: 1px; }
.app-shell { position: relative; width: 100%; min-width: var(--replica-width); }
.workspace { margin-left: 0; padding-top: 58px; width: 100%; min-width: var(--replica-width); }
.topbar { position: absolute; inset: 0 0 auto; width: 100%; min-width: var(--replica-width); height: 26px; min-height: 26px; padding: 0 9px; gap: 8px; background: var(--replica-top); border-bottom: 0; color: #fff; box-shadow: none; }
.breadcrumbs, .breadcrumbs strong, .breadcrumbs > span:last-child { color: #fff; font-size: 12px; font-weight: 400; }
.breadcrumbs > span:first-of-type, .breadcrumb-slash { display: inline; }
.breadcrumb-slash { color: #ccd9e5; }
.topbar-actions { flex-shrink: 0; gap: 12px; font-size: 12px; }
.topbar-user { display: inline-flex; gap: 0; margin: 0; align-items: center; }
.topbar-user::before { content: "代理："; color: #fff; }
.topbar-user strong { color: #fff; font-size: 12px; font-weight: 400; }
.topbar-actions .avatar, .topbar-divider, .topbar-user small { display: none; }
.topbar-actions .badge-demo { color: #dce9f5; background: transparent; border: 0; font-size: 11px; }
.topbar-actions .icon-button { color: #fff; width: auto; height: 21px; min-height: 21px; padding: 1px 0; font-size: 12px; }
.topbar-actions .icon-button:hover { background: transparent; color: #fff3b4; }
.sidebar { position: absolute; inset: 26px 0 auto; width: 100%; min-width: var(--replica-width); height: 32px; padding: 0 7px; gap: 7px; background: var(--replica-nav); border: 0; box-shadow: none; transform: none; overflow: visible; }
.sidebar .brand { width: 53px; padding: 0; margin: 0; }
.sidebar .brand-mark { width: 48px; height: 32px; color: #fff; background: transparent; border-radius: 0; font: italic 900 29px/1 Arial, sans-serif; letter-spacing: -3px; }
.sidebar .brand-copy, .sidebar-caption, .sidebar-footer, .nav-marker, .nav-item .nav-icon { display: none; }
.nav-list { flex-direction: row; flex: 1; align-items: stretch; gap: 0; margin: 0; padding: 0; overflow: visible; scrollbar-width: none; }
.nav-item { width: auto; min-width: 0; min-height: 32px; height: 32px; flex-shrink: 0; padding: 4px 12px; border: 0; border-right: 1px solid #ffffff26; border-radius: 0; background: transparent; color: #fff; font-size: 12px; font-weight: 400; box-shadow: none; }
.nav-item:hover { background: var(--replica-nav-hover); color: #fff; text-decoration: none; }
.nav-item.active { background: var(--replica-nav-active); color: var(--replica-nav-active-text); border: 0; border-right: 1px solid #ffffff26; font-weight: 700; box-shadow: none; }
.mobile-toggle, .icon-button.mobile-toggle, body.sidebar-open::after { display: none !important; }
.replica-account { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-size: 12px; white-space: nowrap; }
.replica-account a { color: #fff; }
.replica-game-switch { display: inline-flex; align-items: center; align-self: stretch; gap: 1px; margin-left: auto; }
.replica-game-button { min-width: 115px; padding: 2px 13px; border: 0; border-left: 1px solid #ffffff50; border-radius: 0; background: #ffffff13; color: #fff; font-size: 12px; font-weight: 700; white-space: nowrap; }
.replica-game-button:hover { color: #fff; background: #ffffff26; text-decoration: none; }
.replica-game-button.active, .replica-game-button[aria-pressed="true"] { background: var(--replica-nav); color: #fffab5; }

.page { width: var(--replica-width); min-width: var(--replica-width); max-width: none; margin: 0; padding: 3px 5px 7px; animation: none; }
.page-heading, .replica-breadcrumb { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 25px; margin: 0 0 4px; padding: 3px 5px; border-bottom: 1px solid var(--replica-line-soft); background: transparent; color: var(--replica-ink); font-size: 12px; }
.page-heading h1 { display: inline; font-size: 12px; line-height: 1.4; font-weight: 400; letter-spacing: 0; margin: 0; }
.page-heading .eyebrow, .page-description { display: none; }
.page-actions { gap: 5px; padding: 0; }
.replica-breadcrumb > .replica-path { display: inline-flex; align-items: center; gap: 5px; }
.replica-breadcrumb strong { font-weight: 400; }
.replica-breadcrumb .replica-path-separator { color: var(--replica-muted); }
.replica-page { width: 100%; min-width: 0; color: var(--replica-ink); }
.panel, .replica-panel { margin: 0 0 5px; border: 1px solid var(--replica-line); border-radius: 0; background: var(--replica-surface); box-shadow: none; overflow: hidden; }
.panel-header, .replica-panel-title { display: flex; align-items: center; justify-content: space-between; min-height: 23px; padding: 3px 6px; gap: 7px; margin: 0; background: var(--replica-head); border-bottom: 1px solid var(--replica-line); color: var(--replica-ink); font-size: 12px; line-height: 1.35; font-weight: 400; }
.panel-header h2 { color: var(--replica-ink); font-size: 12px; font-weight: 400; }
.panel-header p, .panel-header > .muted { margin: 0; color: var(--replica-muted); font-size: 11px; }
.panel-body, .replica-panel-body { padding: 6px; }
.muted, .cell-sub, .field-help, .page-note { color: var(--replica-muted); }
.footer { width: var(--replica-width); min-width: var(--replica-width); max-width: none; margin: 0; padding: 2px 6px 8px; color: var(--replica-muted); font-size: 10px; }
.replica-toolbar, .table-toolbar { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; min-height: 28px; padding: 3px 5px; gap: 4px 9px; border-bottom: 1px solid var(--replica-line); background: var(--replica-soft); color: var(--replica-ink); font-size: 12px; }
.replica-toolbar-group { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.replica-toolbar .replica-toolbar-end { margin-left: auto; }
.replica-summary { display: inline-flex; align-items: center; gap: 15px; font-size: 12px; white-space: nowrap; }
.replica-summary strong { color: var(--replica-negative); font-weight: 400; font-variant-numeric: tabular-nums; }
.replica-note { margin: 4px 0; padding: 3px 5px; color: var(--replica-muted); font-size: 11px; }
.replica-positive { color: var(--replica-positive) !important; }
.replica-negative { color: var(--replica-negative) !important; }
.replica-empty { padding: 14px 7px; text-align: center; color: var(--replica-muted); font-size: 12px; }

/* Dense table and form primitives. */
.data-table, .replica-table, .replica-form-table, .replica-number-table { width: 100%; border-collapse: collapse; border-spacing: 0; font: 12px/1.3 Arial, "SimSun", "宋体", serif; }
.data-table th, .replica-table th, .replica-number-table th { height: 23px; padding: 2px 5px; border: 1px solid var(--replica-line); color: var(--replica-ink); background: var(--replica-head); text-align: center; font-size: 12px; font-weight: 400; white-space: nowrap; }
.data-table td, .recent-users-panel .data-table td, .replica-table td, .replica-number-table td { height: 24px; padding: 2px 5px; border: 1px solid var(--replica-line-soft); background: var(--replica-surface); color: var(--replica-ink); font-size: 12px; line-height: 1.3; vertical-align: middle; }
.data-table th:first-child, .data-table td:first-child, .data-table th:last-child, .data-table td:last-child { padding-left: 5px; padding-right: 5px; border-left: 1px solid var(--replica-line); border-right: 1px solid var(--replica-line); }
.data-table tbody tr:last-child td { border-bottom: 1px solid var(--replica-line-soft); }
.data-table tbody tr:nth-child(even) td, .replica-table.striped tbody tr:nth-child(even) td { background: var(--replica-stripe); }
.data-table tbody tr:nth-child(odd) td { background: var(--replica-surface); }
.data-table tbody tr:hover td, .replica-table tbody tr:hover td, .replica-number-table tbody tr:hover td { background: #fffddd; }
.data-table td.muted { color: var(--replica-muted); font-size: 12px; }
.data-table input[type="checkbox"], .replica-table input[type="checkbox"], .replica-form-table input[type="checkbox"], .replica-form-table input[type="radio"] { width: 13px; height: 13px; min-height: 0; margin: 0 2px 0 0; padding: 0; accent-color: var(--replica-nav); vertical-align: -2px; }
.replica-table .numeric, .replica-number-table .numeric, .replica-form-table .numeric { text-align: right; font-family: Arial, sans-serif; font-variant-numeric: tabular-nums; }
.replica-table .center, .replica-number-table .center { text-align: center; }
.replica-table .nowrap { white-space: nowrap; }
.replica-table .wrap { white-space: normal; overflow-wrap: anywhere; }
.replica-table tfoot td, .replica-table tfoot th, .replica-totals > td, .replica-totals > th { background: var(--replica-head-strong); color: var(--replica-ink); font-weight: 700; }
.replica-table.compact td, .replica-table.compact th { height: 21px; padding-top: 1px; padding-bottom: 1px; }
.replica-table a, .replica-table .text-button { font-size: 12px; }
.table-scroll, .replica-table-scroll { width: 100%; max-width: 100%; overflow: auto; }
.table-footer, .replica-table-footer { display: flex; align-items: center; justify-content: space-between; gap: 7px; min-height: 27px; padding: 3px 5px; border-top: 1px solid var(--replica-line); color: var(--replica-muted); background: var(--replica-soft); font-size: 12px; }
.pagination button, .pagination button.button { min-height: 21px; height: 21px; min-width: 24px; padding: 1px 5px; border: 1px solid var(--replica-control-line); border-radius: 0; background: var(--replica-surface); color: var(--replica-link); font-size: 12px; }
.pagination button.active, .pagination button[aria-current="page"] { background: var(--replica-nav); border-color: var(--replica-nav); color: #fff; }
.pagination > span, .table-footer > span strong { color: var(--replica-ink); }
.button, .button.secondary, .replica-button { min-height: 23px; padding: 2px 8px; border: 1px solid var(--replica-control-line); border-radius: 0; background: #f8fafc; color: var(--replica-ink); font-size: 12px; font-weight: 400; line-height: 1.35; box-shadow: none; }
.button:hover, .button.secondary:hover, .replica-button:hover { background: var(--replica-head); border-color: var(--replica-nav); color: var(--replica-link); }
.button.primary, .replica-button.primary { background: var(--replica-nav); color: #fff; border-color: var(--replica-top); }
.button.primary:hover, .replica-button.primary:hover { background: var(--replica-top); color: #fff; border-color: var(--replica-top); }
.button.small, .row-actions .button.small { min-height: 20px; padding: 1px 5px; border-radius: 0; font-size: 12px; }
.button.danger { background: #fff7f7; border-color: #cc9f9f; color: #b00000; }
.text-button, .text-button:hover { color: var(--replica-link); font-size: 12px; }
.input, .select, .field input, .field select, .field textarea, .replica-input, .replica-select { min-height: 23px; padding: 2px 5px; border: 1px solid var(--replica-control-line); border-radius: 0; background: #fff; color: var(--replica-ink); font-size: 12px; line-height: 1.3; box-shadow: none; }
.input:focus, .select:focus, .field input:focus, .field select:focus, .field textarea:focus, .replica-input:focus, .replica-select:focus { border-color: var(--replica-nav); box-shadow: none; }
.input:disabled, .field input:disabled { color: var(--replica-muted); background: var(--replica-soft); }
.input::placeholder, .field input::placeholder, .field textarea::placeholder { color: #9ba8b6; }
.filter-group { width: auto; gap: 5px; }
.filter-group > .select { flex: none; width: 110px; font-size: 12px; }
.filter-group > .input { flex: none; width: 190px; font-size: 12px; }
.search-input { flex: none; width: 210px; }
.table-toolbar > .search-input { width: 210px; }
.filter-group > .sim-wide-select { width: 200px; }
.search-input > svg { top: 5px; color: var(--replica-muted); }
.search-input > .input { font-size: 12px; }
.field, .field > label { gap: 3px; color: var(--replica-ink); font-size: 12px; }
.field-help { font-size: 11px; }
.form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 10px; }
.replica-form { width: 640px; max-width: none; margin: 0; }
.replica-form-table { width: 100%; background: var(--replica-surface); }
.replica-form-table th { width: 128px; height: 29px; padding: 3px 8px; border: 1px solid var(--replica-line); text-align: right; background: var(--replica-head); color: var(--replica-ink); font-size: 12px; font-weight: 400; white-space: nowrap; }
.replica-form-table td { height: 29px; padding: 3px 7px; border: 1px solid var(--replica-line); background: var(--replica-surface); color: var(--replica-ink); }
.replica-form-table .input, .replica-form-table .select { display: inline-block; width: 200px; max-width: none; vertical-align: middle; }
.replica-form-table .replica-control-short { width: 65px; }
.replica-form-table .replica-control-medium { width: 120px; }
.replica-form-table .replica-control-long { width: 310px; }
.replica-form-table textarea.input { width: 360px; min-height: 58px; resize: vertical; }
.replica-form-table .field-help { display: inline; margin-left: 5px; color: var(--replica-muted); font-size: 11px; }
.replica-required { color: #d00000; padding: 0 3px; }
.replica-checkboxes, .replica-radio-group { display: inline-flex; align-items: center; gap: 12px; min-height: 21px; }
.replica-checkboxes label, .replica-radio-group label { display: inline-flex; align-items: center; gap: 3px; color: var(--replica-ink); font-size: 12px; white-space: nowrap; }
.replica-form-actions { padding: 6px 7px 6px 135px; border: 1px solid var(--replica-line); border-top: 0; display: flex; align-items: center; gap: 7px; background: var(--replica-soft); }
.replica-form-error { margin: 4px 0; color: #c00000; font-size: 12px; }
.replica-form-error:empty { display: none; }

/* Monitor: main area contains five vertical number groups; rankings sit right. */
.replica-tabs, .replica-play-tabs { display: flex; flex-wrap: nowrap; align-items: stretch; gap: 0; margin: 0; padding: 0; border: 1px solid var(--replica-line); border-bottom: 0; background: var(--replica-head); }
.replica-tab { flex: 1 0 auto; min-width: 55px; height: 25px; padding: 3px 9px; border: 0; border-right: 1px solid var(--replica-line); border-radius: 0; background: transparent; color: var(--replica-ink); font-size: 12px; font-weight: 400; text-align: center; white-space: nowrap; }
.replica-tab:last-child { border-right: 0; }
.replica-tab:hover { background: var(--replica-head-strong); color: var(--replica-link); text-decoration: none; }
.replica-tab.active, .replica-tab[aria-selected="true"], .replica-tab[aria-pressed="true"] { background: var(--replica-nav); color: #fff; font-weight: 700; }
.replica-monitor-layout { display: grid; grid-template-columns: minmax(0, 1fr) 204px; align-items: start; gap: 5px; width: 100%; }
.replica-monitor-main { min-width: 0; }
.replica-number-groups { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; align-items: start; }
.replica-number-table { width: 100%; table-layout: fixed; border: 1px solid var(--replica-line); }
.replica-number-table th { height: 24px; padding: 2px 2px; background: var(--replica-head); font-size: 12px; }
.replica-number-table td { height: 25px; padding: 1px 3px; font-size: 12px; white-space: nowrap; }
.replica-number-table th:first-child, .replica-number-table td:first-child { width: 29px; padding: 1px; text-align: center; }
.replica-number-table .replica-rate { width: 44px; color: #9a00a5; text-align: center; font-family: Arial, sans-serif; }
.replica-number-table .replica-stake { text-align: right; color: #004bb5; font-family: Arial, sans-serif; font-variant-numeric: tabular-nums; }
.replica-number-table .replica-net { text-align: right; font-family: Arial, sans-serif; font-variant-numeric: tabular-nums; }
.replica-number-table .replica-row-selected td { background: #fff9c4; }
.replica-number-chip { display: inline-flex; align-items: center; justify-content: center; width: 21px; height: 21px; padding: 0; border: 1px solid currentColor; border-radius: 50%; background: #fff; color: #2462b8; font: 700 12px/1 Arial, sans-serif; text-align: center; text-decoration: none; font-variant-numeric: tabular-nums; }
.replica-number-chip.red { color: #d60000; border-color: #e6a1a1; background: #fff4f4; }
.replica-number-chip.blue { color: #0956ce; border-color: #8db2e1; background: #f4f8ff; }
.replica-number-chip.green { color: #0b8b1e; border-color: #9acfaa; background: #f3fff4; }
button.replica-number-chip:hover, a.replica-number-chip:hover { outline: 1px solid currentColor; outline-offset: 1px; text-decoration: none; }
.replica-number-chip.active, .replica-number-chip[aria-pressed="true"] { outline: 2px solid #b48e00; outline-offset: 1px; }
.replica-ranking { width: 204px; min-width: 0; border: 1px solid var(--replica-line); background: var(--replica-surface); }
.replica-ranking-title { min-height: 25px; padding: 4px 5px; margin: 0; color: var(--replica-ink); background: var(--replica-head-strong); text-align: center; font-size: 12px; font-weight: 400; }
.replica-ranking .replica-table { table-layout: fixed; }
.replica-ranking .replica-table th, .replica-ranking .replica-table td { height: 24px; padding: 2px 4px; font-size: 12px; }
.replica-ranking .replica-table th:first-child, .replica-ranking .replica-table td:first-child { width: 30px; text-align: center; }
.replica-ranking .replica-table th:nth-child(2), .replica-ranking .replica-table td:nth-child(2) { width: 45px; text-align: center; }
.replica-rank-index { color: var(--replica-muted); font: 12px Arial, sans-serif; }
.replica-options-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; margin-top: 4px; }
.replica-option { display: flex; align-items: center; justify-content: space-between; min-height: 24px; padding: 2px 5px; gap: 6px; border: 1px solid var(--replica-line); color: var(--replica-ink); background: var(--replica-soft); font-size: 12px; }
.replica-option .replica-option-value { color: var(--replica-link); text-align: right; font-family: Arial, sans-serif; font-variant-numeric: tabular-nums; }
.replica-monitor-foot { display: flex; align-items: center; gap: 15px; padding: 4px 5px; border: 1px solid var(--replica-line); border-top: 0; color: var(--replica-ink); background: var(--replica-head); font-size: 12px; }

/* Existing functional screens inherit the selected channel theme. */
.badge-demo, .badge-muted, .role-label, .log-action { color: var(--replica-ink); background: var(--replica-soft); border-color: var(--replica-line-soft); border-radius: 0; font-size: 11px; }
.badge-success { color: #237435; background: #f1f8ed; border-color: #b9d5b2; }
.badge-warning { color: #926b14; background: #fff7da; border-color: #dcc88d; }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin-bottom: 5px; }
.stat-card { min-height: 54px; padding: 4px 7px; background: var(--replica-surface); border-color: var(--replica-line); border-radius: 0; box-shadow: none; }
.stat-label { margin: 0; color: var(--replica-ink); font-size: 12px; }
.stat-value { color: var(--replica-link); font-size: 17px; }
.stat-value small, .stat-foot { color: var(--replica-muted); font-size: 10px; }
.stat-foot { margin-top: 1px; }
.dashboard-grid { grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 5px; margin-bottom: 5px; }
.bottom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.quick-action { background: var(--replica-surface); border-color: var(--replica-line-soft); }
.quick-action > span { color: var(--replica-ink); }
.quick-action small { color: var(--replica-muted); }
.quick-action > svg:first-child, .quick-action:nth-child(n) > svg:first-child { color: var(--replica-link); background: var(--replica-head); }
.notice-item, .activity-item { border-color: var(--replica-line-soft); }
.notice-item strong, .activity-item strong { color: var(--replica-ink); }
.notice-item .notice-date, .activity-item p, .activity-item time, .announcement-meta time, .announcement-content p { color: var(--replica-muted); }
.notice-tag { color: var(--replica-link); background: var(--replica-head); }
.activity-dot { background: var(--replica-nav); }
.chart-bars { border-color: var(--replica-line); background: repeating-linear-gradient(to top, transparent 0, transparent 39px, var(--replica-line-soft) 40px, transparent 41px); }
.chart-bars > .chart-column > .chart-bar { background: var(--replica-focus); }
.chart-column:last-child > .chart-bar { background: var(--replica-nav); }
.chart-column > .chart-value, .chart-column:last-child > .chart-value, .chart-column > .chart-label { color: var(--replica-muted); }
.profile-card, .profile-avatar, .detail-list, .detail-list > div, #profile-form > .form-actions { border-color: var(--replica-line); }
.profile-avatar { color: var(--replica-link); background: var(--replica-head); }
.profile-card > p, .detail-list dt { color: var(--replica-muted); }
.detail-list dd { color: var(--replica-ink); }
#profile-form > .form-actions { background: var(--replica-soft); }
.dialog { border-color: var(--replica-control-line); background: var(--replica-surface); border-radius: 0; }
.dialog-header { background: var(--replica-top); border-color: var(--replica-nav); padding: 5px 8px; }
.dialog-header h2 { color: #fff; font-size: 12px; }
.dialog-body { padding: 8px; }
.dialog-footer { padding: 5px 8px; background: var(--replica-soft); border-color: var(--replica-line); }
.login-screen { background: var(--replica-bg); }
.login-form { border-color: var(--replica-line); border-top-color: var(--replica-nav); background: var(--replica-surface); }
.login-form::before, .login-form h1, .login-form h2 { color: var(--replica-nav); }
.demo-credentials { border-color: var(--replica-line-soft); background: var(--replica-soft); }
.demo-credentials strong, .demo-credentials .mono { color: var(--replica-ink); }
.login-form > p, .login-form .login-note, .login-copyright { color: var(--replica-muted); }
.sim-summary, .sim-current-round, .sim-automation-panel, .sim-bet-filter-form, .sim-report-summary { color: var(--replica-ink); background: var(--replica-soft); border-color: var(--replica-line); }
.sim-summary strong, .sim-current-round strong, .sim-output, #sim-auto-countdown { color: var(--replica-link); }
.sim-output { border-color: var(--replica-line); background: var(--replica-soft); }
.sim-choice span { border-color: var(--replica-line); color: var(--replica-ink); background: var(--replica-surface); }
.sim-choice input:checked + span { background: var(--replica-nav); border-color: var(--replica-top); color: #fff; }
.sim-round-details, .sim-submit-row, .sim-open-round, .sim-automation-form { border-color: var(--replica-line); }
.sim-round-details dt, .sim-submit-row .muted, .sim-bet-filter-grid > label, .sim-date-label { color: var(--replica-muted); }
.sim-round-details dd, .sim-auto-check, .sim-auto-interval { color: var(--replica-ink); }
.sim-auto-check input { accent-color: var(--replica-nav); }
.sim-automation-status { background: var(--replica-stripe); }
.sim-auto-status-line, .sim-auto-times { color: var(--replica-muted); }
.sim-result-number { color: var(--replica-link); border-color: var(--replica-control-line); background: var(--replica-head); }
.sim-table tfoot td, .sim-table tfoot th { color: var(--replica-ink); background: var(--replica-head); }
.sim-dialog-account { color: var(--replica-ink) !important; border-color: var(--replica-line); }
.sim-console-grid { grid-template-columns: minmax(0, 1.65fr) minmax(265px, 1fr); }
.sim-automation-panel { grid-template-columns: minmax(340px, 1fr) minmax(300px, 1.15fr); }
.sim-bet-filter-grid { grid-template-columns: minmax(150px, 1.4fr) minmax(105px, .8fr) minmax(135px, 1.1fr) minmax(145px, 1fr) minmax(145px, 1fr) 80px; }
.sim-console-grid .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sim-summary { display: flex; flex-wrap: wrap; gap: 5px 22px; font-size: 12px; }
.sim-automation-form { border-right: 1px solid var(--replica-line); border-bottom: 0; }
.sim-date-label { width: auto; }
.sim-date-label > .input { width: 133px; }
.sim-scope-banner { flex-wrap: nowrap; min-height: 24px; padding: 3px 6px; margin-bottom: 4px; font-size: 11px; }
.sim-scope-banner > span { flex-basis: auto; padding: 0; }

/* Main replica application controls. */
[hidden] { display: none !important; }
.replica-header-link { border: 0; background: transparent; padding: 0; color: #fff; font-size: 12px; }
.replica-header-link:hover { text-decoration: underline; }
.replica-simulation-label { min-height: 20px; margin-bottom: 4px; padding: 2px 5px; border: 1px solid #d9c99b; background: #fff9df; color: #957943; font-size: 11px; }
.replica-login-portals { display: flex; justify-content: center; gap: 6px; margin: 12px 0 16px; }
.replica-login-portals .button { min-width: 98px; }
.replica-trade-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(350px, 1fr); gap: 5px; align-items: start; margin-top: 5px; }
.replica-trade-fields { display: flex; flex-wrap: wrap; gap: 5px 9px; margin-bottom: 7px; }
.replica-trade-fields > label { display: flex; align-items: center; gap: 4px; color: var(--replica-ink); font-size: 12px; }
.replica-trade-fields .input, .replica-trade-fields .select { width: 105px; }
.replica-trade-fields #bet-user { width: 195px; }
.replica-trade-fields #bet-rule { width: 165px; }
.replica-trade-fields output { color: var(--replica-link); min-width: 75px; }
.replica-selection-help { margin: 3px 0 5px; color: var(--replica-muted); font-size: 11px; }
.replica-selection-options { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 3px; }
.replica-selection-options.numbers { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.replica-selection-options > label { position: relative; display: block; cursor: pointer; }
.replica-selection-options input { position: absolute; width: 1px; height: 1px; clip: rect(0, 0, 0, 0); overflow: hidden; opacity: 0; }
.replica-selection-options span { display: flex; align-items: center; justify-content: center; min-height: 24px; padding: 2px 5px; border: 1px solid var(--replica-line); background: var(--replica-soft); color: var(--replica-ink); font-size: 12px; }
.replica-selection-options input:checked + span { background: var(--replica-nav); border-color: var(--replica-top); color: #fff; }
.replica-selection-options input:focus-visible + span { outline: 2px solid var(--replica-focus); outline-offset: 1px; }
.replica-selection-extra { display: inline-flex; align-items: center; gap: 5px; margin: 5px 10px 2px 0; }
.replica-selection-extra .input, .replica-selection-extra .select { width: 110px; }
.replica-pass-leg { display: flex; align-items: center; gap: 5px 10px; padding: 4px 0; border-bottom: 1px solid var(--replica-line-soft); }
.replica-pass-leg label { display: inline-flex; align-items: center; gap: 4px; }
.replica-pass-leg .select { width: 92px; }
.replica-pass-leg [data-leg-position] { width: 48px; }
.replica-draw-actions { display: flex; gap: 6px; margin-top: 7px; }
#draw-form > label { display: flex; flex-direction: column; gap: 4px; }
#auto-form { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; border-top: 1px solid var(--replica-line); }
#auto-form .replica-control-short { width: 65px; }
#auto-form .replica-form-error { flex-basis: 100%; }
.replica-modal { width: 685px; max-width: calc(100vw - 24px); }
.replica-permissions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.replica-permissions label { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; }
.replica-checkboxes { flex-wrap: wrap; gap: 5px 9px; }
.replica-special-ball { outline: 2px solid #d5a51b; outline-offset: 1px; margin-left: 4px; }
#monitor-previous .replica-number-chip { width: 19px; height: 19px; font-size: 11px; }
.replica-toolbar > label { display: inline-flex; align-items: center; gap: 4px; }
.replica-toolbar > label > .input, .replica-toolbar > label > .select { width: 135px; }
.replica-toolbar .replica-form-error { flex-basis: 100%; }

/* Configurable simulation rules and atomic batch preview. */
.replica-expansion-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 14px; padding: 5px 0; margin-bottom: 5px; border-top: 1px solid var(--replica-line); border-bottom: 1px solid var(--replica-line); }
.replica-expansion-toolbar label { display: inline-flex; align-items: center; gap: 5px; }
.replica-expansion-toolbar .select { width: 110px; }
.replica-expansion-toolbar .replica-control-short { width: 54px; }
.replica-group-editor { display: flex; flex-direction: column; gap: 5px; margin: 5px 0 7px; }
.replica-group-editor textarea { width: 100%; min-height: 104px; font: 12px/1.55 Arial, "SimSun", "宋体", serif; }
.replica-group-editor input { width: 100%; }
.replica-quote-modal { width: 930px; }
.replica-quote-items { max-height: 350px; overflow: auto; }
.replica-quote-items .replica-table-scroll { overflow: visible; }
.replica-quote-items .replica-table th { position: sticky; top: 0; z-index: 1; }
.replica-quote-items .replica-table td:nth-child(2) { min-width: 180px; }
.replica-quote-modal .replica-form-table > tbody > tr > th { width: 108px; }
.replica-override-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 3px 0; border-bottom: 1px solid var(--replica-line-soft); }
.replica-override-row:last-child { border-bottom: 0; }
.replica-override-row > span { flex: 1; min-width: 180px; }
#odds-table .replica-table td:nth-child(1) { width: 120px; }
#odds-table .replica-table td:nth-child(2), #odds-table .replica-table td:nth-child(3) { width: 190px; }
#odds-table .replica-table td:last-child { width: 245px; }
#config-content .replica-panel-body.replica-note { margin: 0; padding: 7px; line-height: 1.5; }
#commission-policy, #settlement-preview { margin-bottom: 0; }
.button[aria-disabled="true"] { opacity: .6; cursor: not-allowed; }
#allocation-summary .replica-summary { flex-wrap: wrap; }

/* Pending bet selection edits and immutable history. */
.replica-bet-edit-modal { width: 1000px; }
.replica-edit-metadata { margin-bottom: 7px; }
.replica-bet-edit-modal .replica-form-table > tbody > tr > th { width: 136px; }
.replica-bet-edit-modal textarea.input { width: 100%; min-height: 70px; height: auto; resize: vertical; }
.replica-edit-notice { margin: 7px 0; padding: 6px 8px; border: 1px solid #d9c99b; background: #fff9df; color: #715b28; font-size: 12px; line-height: 1.5; }
.replica-edit-comparison { margin: 7px 0; table-layout: fixed; }
.replica-edit-comparison th:first-child { width: 105px; }
.replica-edit-comparison td { overflow-wrap: anywhere; white-space: normal; }
.replica-edit-history { max-height: 50vh; overflow: auto; }
.replica-edit-history .replica-table-scroll { overflow: visible; }
.replica-edit-history .replica-table th { position: sticky; top: 0; z-index: 1; }
.replica-edit-history .wrap { white-space: pre-wrap; min-width: 165px; }
.replica-edit-history .replica-table td:first-child { width: 155px; }
.replica-edit-history .cell-sub { color: var(--replica-muted); margin-top: 4px; }
#edit-quote-expiry { min-height: 22px; padding: 3px 0; }
.replica-access-switch { display: inline-flex; align-items: center; gap: 6px; }
.replica-access-switch input { width: 13px; height: 13px; accent-color: var(--replica-nav); }
.replica-access-owner { display: inline-block; margin-left: 8px; padding: 1px 4px; border: 1px solid var(--replica-line); color: var(--replica-link); background: var(--replica-soft); font-size: 11px; }
.replica-bet-access-table td:nth-child(1), .replica-bet-access-table td:nth-child(2) { width: 24%; }
.replica-bet-access-table td:nth-child(3) { width: 28%; }
.replica-bet-access-table .replica-form-error { display: inline-block; padding-left: 7px; }

/* The entry gate contains only the safety-code form, before either login portal. */
.replica-entry-screen { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 100vh; padding: 24px 14px; }
.replica-entry-screen .login-form-panel { width: 370px; max-width: 100%; min-width: 0; min-height: 0; padding: 0; }
.replica-entry-screen .login-form { width: 100%; max-width: 100%; padding: 24px; }
.replica-entry-screen .login-form h2 { margin-bottom: 24px; }
.replica-entry-screen .input { height: 34px; font: 15px Arial, sans-serif; }
.replica-entry-screen .login-form > .button { min-height: 32px; }
.replica-entry-status { min-height: 18px; margin: 8px 0 0; color: var(--replica-link); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.replica-entry-settings { max-width: 740px; }
.replica-entry-settings .replica-form-table > tbody > tr > th { width: 145px; }
.replica-entry-settings .input { width: 350px; max-width: 100%; font-family: Arial, sans-serif; }
.replica-entry-settings .replica-note { margin-top: 5px; }
.replica-entry-candidate { display: flex; flex-direction: column; gap: 5px; margin: 8px 6px; padding: 9px; border: 1px solid #d9c99b; background: #fff9df; }
.replica-entry-candidate > label { font-weight: 700; }
.replica-entry-candidate .input { width: 100%; background: #fff; user-select: all; }
.replica-entry-settings > .replica-form-error, .replica-entry-settings > .replica-entry-status { padding-left: 7px; padding-right: 7px; }

@media print {
  html, body, .app-shell, .workspace, .page, .footer { width: auto; min-width: 0; max-width: none; background: #fff; }
  .workspace { padding-top: 0; }
  .topbar, .sidebar, .replica-toolbar, .replica-form-actions, .replica-game-switch { display: none !important; }
  .replica-table th, .replica-table td, .replica-number-table th, .replica-number-table td { border-color: #aaa; color: #000; }
  .replica-number-chip { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}