:root {
  color-scheme: light;
  --ink: #17221c;
  --ink-soft: #5f6d65;
  --line: #dde5df;
  --canvas: #f4f7f4;
  --card: #ffffff;
  --forest: #133f2d;
  --forest-2: #1d5b42;
  --leaf: #53b175;
  --leaf-soft: #e7f5eb;
  --gold: #c99236;
  --blue: #4d7fc7;
  --purple: #8b68bd;
  --danger: #bd4242;
  --danger-soft: #fff0ef;
  --shadow: 0 14px 36px rgba(25, 59, 39, .08);
  --radius: 16px;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
}

.commerce-test-identity-notice { display:flex; align-items:flex-start; flex-direction:column; gap:5px; margin:0 24px 16px; padding:13px 15px; border:1px solid #edcc83; border-radius:10px; color:#6f4c08; background:#fff8e7; }
.commerce-test-identity-notice[hidden] { display:none; }
.commerce-test-identity-notice strong { font-size:12px; }
.commerce-test-identity-notice span { font-size:10px; line-height:1.6; }
.commerce-test-identity-notice small { color:#866b36; font-size:9px; }

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-width: 320px; background: var(--canvas); }
body { margin: 0; color: var(--ink); background: var(--canvas); }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
a { color: inherit; text-decoration: none; }

.eyebrow {
  margin: 0 0 8px;
  color: var(--leaf);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.muted { color: var(--ink-soft); }
.nowrap { white-space: nowrap; }
.mono { font-family: Consolas, "Microsoft YaHei UI", monospace; font-size: 12px; }

.brand-mark {
  display: inline-grid;
  width: 40px;
  height: 40px;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 12px;
  color: #f7fff9;
  background: linear-gradient(145deg, #2f8d5f, #1a5139);
  box-shadow: inset 0 1px rgba(255,255,255,.16);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -.03em;
}
.brand-mark-large { width: 60px; height: 60px; border-radius: 17px; font-size: 18px; }

/* 登录 */
.login-body {
  min-height: 100vh;
  overflow-x: hidden;
  background:
    linear-gradient(rgba(37, 29, 24, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37, 29, 24, .045) 1px, transparent 1px),
    #f4efe8;
  background-size: 72px 72px;
}
.login-shell {
  position: relative;
  isolation: isolate;
  overflow: clip;
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  grid-template-columns: minmax(560px, 1.2fr) minmax(460px, .8fr);
}
.login-shell::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -130px;
  bottom: -150px;
  width: 430px;
  height: 430px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(247, 66, 55, .22), rgba(247, 66, 55, 0) 68%);
  pointer-events: none;
}
.login-brand {
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: flex;
  width: calc(100% + 190px);
  min-width: 0;
  flex-direction: column;
  justify-content: space-between;
  margin-right: -190px;
  padding: clamp(40px, 5vw, 78px) clamp(42px, 5.8vw, 104px) clamp(64px, 7vw, 112px);
  clip-path: polygon(0 0, 100% 0, 77% 100%, 0 100%);
  color: #fffdf8;
  background:
    radial-gradient(circle at 18% 78%, rgba(174, 39, 30, .48), transparent 34%),
    linear-gradient(135deg, #09090a 0%, #151516 56%, #0b0b0c 100%);
}
.login-brand::before,
.login-brand::after {
  content: "";
  position: absolute;
  pointer-events: none;
}
.login-brand::before {
  width: min(47vw, 620px);
  aspect-ratio: 1;
  left: clamp(60px, 8vw, 160px);
  top: 18%;
  border: clamp(42px, 4.2vw, 72px) solid rgba(255,255,255,.035);
  border-radius: 30%;
  transform: rotate(-.8deg);
  box-shadow: inset 0 0 70px rgba(255,255,255,.018), 0 0 90px rgba(0,0,0,.3);
}
.login-brand::after {
  left: 0;
  right: 17%;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, #f44336 0 7%, transparent 7% 34%, rgba(244,67,54,.55) 34% 47%, transparent 47%);
}
.login-brand > * { position: relative; z-index: 1; }
.login-brand-combo { display: flex; align-items: center; gap: 16px; }
.login-logo-frame {
  position: relative;
  overflow: hidden;
  display: block;
  width: 58px;
  height: 58px;
  flex: 0 0 auto;
  border: 1px solid rgba(22,22,23,.06);
  border-radius: 15px;
  background: #fffdfa;
  box-shadow: 0 10px 24px rgba(0,0,0,.1);
}
.login-logo-frame-large { width: 78px; height: 78px; border-radius: 21px; }
.login-logo-frame img {
  position: absolute;
  width: 142%;
  max-width: none;
  height: 142%;
  left: -21%;
  top: -21%;
  object-fit: contain;
}
.login-wordmark { display: grid; gap: 1px; line-height: 1; }
.login-wordmark strong {
  color: #181819;
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -.055em;
}
.login-wordmark strong span { color: #f44336; }
.login-wordmark small { color: #6f6a64; font-size: 12px; font-weight: 700; letter-spacing: .16em; }
.login-brand-combo-light .login-wordmark strong { color: #fff; }
.login-brand-combo-light .login-wordmark small { color: rgba(255,255,255,.7); }
.login-brand-combo-light .login-wordmark strong { font-size: 36px; }
.login-brand-combo-light .login-wordmark small { font-size: 13px; }
.login-brand-title { margin: clamp(80px, 15vh, 180px) 0 auto; }
.login-brand-title::before {
  content: "";
  display: block;
  width: 42px;
  height: 7px;
  margin-bottom: 18px;
  background: #f44336;
  box-shadow: 58px 8px 0 -2px rgba(244,67,54,.8), 86px -6px 0 -3px rgba(244,67,54,.65);
}
.login-brand-title p {
  margin: 0 0 18px;
  color: #f44336;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .13em;
}
.login-brand-title h1 {
  max-width: 700px;
  margin: 0;
  font-size: clamp(46px, 5vw, 78px);
  line-height: 1.08;
  letter-spacing: -.055em;
}
.login-card {
  position: relative;
  z-index: 2;
  align-self: center;
  width: min(500px, calc(100% - 72px));
  margin: 42px auto;
  padding: clamp(36px, 4vw, 54px);
  border: 1px solid rgba(72, 55, 43, .12);
  border-radius: 28px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 30px 80px rgba(54,39,30,.18), 0 7px 0 rgba(57,39,29,.08);
  backdrop-filter: blur(10px);
}
.login-card-divider { height: 1px; margin: 25px 0 32px; background: #ddd5ca; }
.login-card-kicker { margin: 0 0 10px; color: #f44336; font-size: 14px; font-weight: 900; }
.login-card h2 { margin: 0 0 7px; color: #171718; font-size: 42px; line-height: 1.12; letter-spacing: -.055em; }
.login-card > .muted { margin: 0 0 30px; color: #77716b; font-size: 14px; }
.form-stack { display: grid; gap: 20px; }
.form-stack label, .score-dialog label { display: grid; gap: 8px; color: #34433a; font-size: 13px; font-weight: 700; }
input, select, textarea { width: 100%; border: 1px solid #ced9d1; border-radius: 10px; color: var(--ink); background: white; outline: none; transition: border-color .18s, box-shadow .18s; }
input, select { height: 44px; padding: 0 13px; }
textarea { min-height: 92px; padding: 12px 13px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--leaf); box-shadow: 0 0 0 3px rgba(83,177,117,.14); }
.login-card .form-stack label { color: #262324; font-size: 14px; }
.login-card input {
  height: 54px;
  border-color: #d8d0c7;
  border-radius: 12px;
  color: #1b1919;
  background: #fcfaf7;
}
.login-card input:focus { border-color: #f44336; box-shadow: 0 0 0 3px rgba(244,67,54,.12); }
.login-card .button-primary { border-radius: 12px; background: #f44336; box-shadow: 0 10px 22px rgba(244,67,54,.2); }
.login-card .button-primary:hover { background: #da352c; }
.login-card .button-large { min-height: 56px; font-size: 16px; }
.login-safety { margin: 24px 0 0; color: #89827b; font-size: 11px; text-align: center; }

.button { min-height: 40px; padding: 0 16px; border: 1px solid transparent; border-radius: 10px; font-weight: 750; transition: transform .15s, box-shadow .15s, background .15s; }
.button:hover { transform: translateY(-1px); }
.button:disabled { cursor: not-allowed; opacity: .55; transform: none; }
.button-primary { color: white; background: var(--forest-2); box-shadow: 0 7px 16px rgba(24, 88, 61, .18); }
.button-primary:hover { background: var(--forest); }
.button-secondary { color: #33463a; border-color: var(--line); background: white; }
.button-danger-ghost { color: var(--danger); border-color: #ecc5c2; background: var(--danger-soft); }
.button-large { min-height: 50px; margin-top: 4px; }
.text-button { padding: 0; border: 0; color: #859188; background: transparent; font-size: 12px; }
.alert { padding: 11px 13px; border-radius: 9px; font-size: 13px; line-height: 1.5; }
.alert-error { margin: 0 0 18px; color: #982e2e; border: 1px solid #efcac7; background: var(--danger-soft); }
.alert-success { margin: 0 0 18px; color: #286a43; border: 1px solid #bfe0ca; background: #eef8f1; }

/* 后台框架 */
.app-body { min-height: 100vh; padding-left: 244px; }
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 20;
  display: flex;
  width: 244px;
  flex-direction: column;
  padding: 24px 16px 18px;
  color: rgba(255,255,255,.82);
  background: linear-gradient(180deg, #112f23 0%, #153d2c 100%);
  box-shadow: 8px 0 30px rgba(16, 51, 35, .08);
}
.sidebar-brand { display: flex; align-items: center; gap: 12px; padding: 0 8px 28px; }
.sidebar-brand strong { display: block; color: white; font-size: 15px; }
.sidebar-brand small { display: block; margin-top: 4px; color: rgba(255,255,255,.38); font-size: 9px; letter-spacing: .11em; }
.sidebar-context { display: grid; gap: 9px; margin: -10px 0 18px; padding: 12px; border: 1px solid rgba(255,255,255,.13); border-radius: 12px; background: rgba(255,255,255,.055); }
.sidebar-environment { display: flex; align-items: center; gap: 7px; }
.sidebar-environment strong { color: #ffe6a7; font-size: 12px; }
.environment-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #efb84c; box-shadow: 0 0 0 4px rgba(239,184,76,.14); }
.sidebar-current-game { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: baseline; gap: 3px 7px; }
.sidebar-current-game span { color: rgba(255,255,255,.48); font-size: 9px; }
.sidebar-current-game strong { overflow: hidden; color: white; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-current-game small { grid-column: 2; overflow: hidden; color: rgba(255,255,255,.42); font: 9px Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-context.production { border-color: rgba(255,151,151,.52); background: #8f2828; box-shadow: 0 8px 20px rgba(73,8,8,.25); }
.sidebar-context.production .sidebar-environment strong { color: white; font-size: 13px; }
.sidebar-context.production .environment-dot { background: #ffb1b1; box-shadow: 0 0 0 4px rgba(255,215,215,.18); }
.sidebar-nav { display: grid; gap: 5px; }
.nav-item { display: flex; min-height: 44px; align-items: center; gap: 11px; padding: 0 12px; border-radius: 10px; font-size: 13px; transition: background .16s, color .16s; }
.nav-item:hover:not(.disabled) { color: white; background: rgba(255,255,255,.07); }
.nav-item.active { color: white; background: rgba(87, 188, 122, .18); box-shadow: inset 3px 0 #65c483; }
.nav-item.disabled { cursor: default; color: rgba(255,255,255,.32); }
.nav-item small { margin-left: auto; padding: 2px 5px; border-radius: 5px; background: rgba(255,255,255,.07); font-size: 9px; }
.nav-icon { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; font-size: 11px; }
.sidebar-footer { margin-top: auto; padding: 18px 8px 0; border-top: 1px solid rgba(255,255,255,.08); }
.admin-chip { display: flex; align-items: center; gap: 10px; margin-bottom: 13px; }
.admin-chip strong, .admin-chip small { display: block; }
.admin-chip strong { color: white; font-size: 13px; }
.admin-chip small { margin-top: 3px; color: rgba(255,255,255,.42); font-size: 10px; }
.avatar-mini { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: #163e2c; background: #87d19f; font-weight: 900; }

.main-content { width: min(1600px, 100%); margin: 0 auto; padding: 34px clamp(22px, 3.2vw, 48px) 60px; }
.topbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.topbar h1 { margin: 0; font-size: 30px; letter-spacing: -.035em; }
.game-switcher { display: flex; align-items: center; gap: 10px; }
.game-switcher label { color: var(--ink-soft); font-size: 12px; font-weight: 700; }
.game-switcher select { width: 170px; background-color: white; }

.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.stat-card { position: relative; overflow: hidden; min-height: 132px; padding: 21px 22px; border: 1px solid #e1e8e3; border-radius: var(--radius); background: var(--card); box-shadow: 0 8px 22px rgba(29, 64, 42, .045); }
.stat-card::after { content: ""; position: absolute; top: 0; right: 0; width: 72px; height: 72px; border-radius: 0 0 0 72px; opacity: .12; background: currentColor; }
.stat-card strong { display: block; margin: 12px 0 5px; color: var(--ink); font-size: 28px; letter-spacing: -.035em; }
.stat-card small { color: #849087; font-size: 11px; }
.stat-label { color: #58665e; font-size: 12px; font-weight: 700; }
.accent-green { color: var(--leaf); }.accent-gold { color: var(--gold); }.accent-blue { color: var(--blue); }.accent-purple { color: var(--purple); }

.panel { border: 1px solid #dfe7e1; border-radius: var(--radius); background: white; box-shadow: var(--shadow); }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 24px 18px; }
.panel-heading h2 { margin: 0; font-size: 19px; letter-spacing: -.02em; }
.panel-heading p { margin: 7px 0 0; color: #7a8880; font-size: 12px; line-height: 1.6; }
.panel-collapse-toggle { display: inline-flex; min-width: 72px; min-height: 34px; align-items: center; justify-content: center; gap: 7px; flex: 0 0 auto; margin-left: auto; padding: 0 11px; border: 1px solid #d7e3da; border-radius: 9px; color: #37664a; background: #f7faf8; font-size: 11px; font-weight: 800; white-space: nowrap; }
.panel-collapse-toggle:hover { border-color: #9fc8ac; background: #eef7f1; }
.panel-collapse-toggle:focus-visible { outline: 3px solid rgba(83,177,117,.2); outline-offset: 2px; }
.collapse-chevron { display: inline-block; font-size: 14px; line-height: 1; transition: transform .18s ease; }
.collapsible-panel.is-collapsed > :not(.collapse-header) { display: none !important; }
.collapsible-panel.is-collapsed .collapse-chevron { transform: rotate(180deg); }
.panel.collapsible-panel.is-collapsed { overflow: hidden; }
.panel.collapsible-panel.is-collapsed > .panel-heading,
.panel.collapsible-panel.is-collapsed > .trend-toolbar { align-items: center; padding-top: 17px; padding-bottom: 17px; border-bottom: 0; }
.metric-section.collapsible-panel.is-collapsed { padding: 17px 19px; border: 1px solid #dfe7e1; border-radius: var(--radius); background: white; box-shadow: var(--shadow); }
.metric-section.collapsible-panel.is-collapsed > .section-heading { align-items: center; margin: 0; }
.heading-with-status { display: flex; align-items: center; gap: 10px; }
.live-pill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 999px; color: #318452; background: #eaf7ee; font-size: 10px; font-weight: 800; }
.live-pill i { width: 6px; height: 6px; border-radius: 50%; background: #4ab46e; box-shadow: 0 0 0 4px rgba(74,180,110,.13); }
.date-control { display: flex; align-items: center; gap: 9px; }
.date-control label { white-space: nowrap; color: #66746c; font-size: 12px; font-weight: 700; }
.date-control input { width: 146px; height: 38px; }
.history-picker { display: grid; grid-template-columns: auto 156px; align-items: center; gap: 4px 9px; }
.history-picker input { width: 156px; }
.history-picker small { grid-column: 1 / -1; color: #7c8a82; font-size: 10px; line-height: 1.4; text-align: right; white-space: nowrap; }
.lifetime-scope { display: inline-flex; min-width: 156px; min-height: 38px; align-items: center; justify-content: center; border: 1px solid #cfe2d5; border-radius: 10px; color: #2f6b48; background: #eff8f2; font-size: 12px; font-weight: 850; }
.period-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin: 0 24px 16px;
  padding: 4px;
  border: 1px solid #e1e9e3;
  border-radius: 12px;
  background: #f3f7f4;
}
.period-tab {
  display: inline-flex;
  width: 100%;
  min-width: 0;
  height: 38px;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  color: #53655b;
  background: transparent;
  font-size: 13px;
  font-weight: 750;
  white-space: nowrap;
}
.period-tab:hover { color: #244d35; background: rgba(255,255,255,.72); }
.period-tab.active {
  color: white;
  background: var(--forest-2);
  box-shadow: 0 4px 10px rgba(24, 88, 61, .18);
}
.period-summary { display: flex; justify-content: space-between; gap: 18px; padding: 12px 24px; color: #7a8880; background: #fafcfb; font-size: 11px; }

.table-wrap { width: 100%; overflow-x: auto; }
.data-table { width: 100%; min-width: 820px; border-collapse: collapse; }
.data-table th { padding: 12px 18px; color: #75837b; background: #f7faf8; font-size: 11px; font-weight: 800; text-align: left; white-space: nowrap; }
.data-table td { height: 66px; padding: 10px 18px; border-top: 1px solid #edf1ee; color: #36443c; font-size: 13px; vertical-align: middle; }
.data-table tbody tr:hover { background: #fbfdfb; }
.number-cell { text-align: right !important; }
.score-value { color: #143e2c; font-size: 16px; font-weight: 900; }
.action-cell { width: 92px; text-align: right !important; }
.row-action { min-height: 32px; padding: 0 11px; border: 1px solid #d8e4dc; border-radius: 8px; color: #2f6c48; background: white; font-size: 11px; font-weight: 750; }
.row-action:hover { border-color: #9bc7aa; background: #f1f9f3; }
.rank { display: inline-grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; color: #55635b; background: #f0f4f1; font-weight: 900; }
.rank.top-1 { color: #765313; background: #fff1c9; }.rank.top-2 { color: #59656d; background: #e9eef0; }.rank.top-3 { color: #815234; background: #f7e2d5; }
.streamer-cell { display: flex; min-width: 180px; align-items: center; gap: 11px; }
.streamer-avatar { display: grid; width: 36px; height: 36px; place-items: center; flex: 0 0 auto; overflow: hidden; border-radius: 11px; color: #225c3c; background: #e6f4e9; font-size: 13px; font-weight: 900; }
.streamer-avatar img { width: 100%; height: 100%; object-fit: cover; }
.streamer-cell strong, .streamer-cell small { display: block; }
.streamer-cell strong { max-width: 180px; overflow: hidden; color: #26342c; text-overflow: ellipsis; white-space: nowrap; }
.streamer-cell small { margin-top: 3px; color: #8a968e; font-size: 10px; }
.loading-state { padding: 28px; color: #829087; text-align: center; }
.empty-state { padding: 54px 24px; color: #7d8982; text-align: center; }
.empty-state strong, .empty-state span { display: block; }.empty-state strong { margin-bottom: 8px; color: #4b5b51; }.empty-state span { font-size: 12px; }

.score-dialog { width: min(560px, calc(100vw - 32px)); padding: 0; border: 0; border-radius: 18px; color: var(--ink); box-shadow: 0 30px 90px rgba(11, 39, 25, .28); }
.score-dialog::backdrop { background: rgba(10, 28, 19, .52); backdrop-filter: blur(3px); }
.score-dialog form { padding: 26px; }
.dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 20px; }
.dialog-heading h2 { margin: 0; font-size: 23px; }
.icon-button { width: 34px; height: 34px; border: 0; border-radius: 9px; color: #66736b; background: #f0f4f1; font-size: 23px; line-height: 1; }
.operation-scope { display: flex; align-items: center; gap: 7px; margin-bottom: 20px; padding: 11px 13px; border-radius: 10px; color: #607068; background: #f1f7f3; font-size: 12px; }
.operation-scope strong { color: #1f6841; }.operation-scope small { margin-left: auto; color: #819087; }
.score-dialog label { margin-top: 16px; }
.score-dialog label small { color: #8b978f; font-size: 10px; font-weight: 400; }
.dialog-actions { display: flex; align-items: center; gap: 9px; margin-top: 24px; }
.action-spacer { flex: 1; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 80; max-width: 380px; padding: 13px 16px; border-radius: 11px; color: white; background: #163e2c; box-shadow: 0 14px 34px rgba(15,52,36,.24); font-size: 13px; }

.audit-panel { overflow: hidden; }
.audience-section { margin-top: 18px; overflow: hidden; }

/* 数据总览 */
.overview-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.overview-header h1 { margin: 0; font-size: 30px; letter-spacing: -.035em; }
.environment-badge { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.environment-badge.development { color: #8a5a12; border: 1px solid #efd7aa; background: #fff7e7; }
.environment-badge.production { color: white; background: #b53737; box-shadow: 0 7px 18px rgba(181,55,55,.2); }
.project-selector { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 20px; margin-bottom: 24px; padding: 20px 22px; }
.selector-step { display: grid; grid-template-columns: 34px minmax(120px,.65fr) minmax(180px,1fr); align-items: center; gap: 12px; }
.selector-step label strong, .selector-step label small { display: block; }
.selector-step label strong { color: #304238; font-size: 13px; }.selector-step label small { margin-top: 4px; color: #8a978f; font-size: 10px; }
.selector-number { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; color: white; background: var(--forest-2); font-size: 12px; font-weight: 900; }
.selector-arrow { color: #9aaba0; font-size: 22px; }.selector-step select { height: 46px; }
.overview-empty { padding: 70px 24px; text-align: center; }.overview-empty h2 { margin: 18px 0 8px; }.overview-empty p { margin: 0; color: #7b8980; }
.empty-illustration { display: inline-grid; width: 62px; height: 62px; place-items: center; border-radius: 20px; color: #4a765b; background: #e8f3eb; font-size: 20px; font-weight: 900; }
.overview-title-row { display: flex; align-items: flex-end; justify-content: space-between; margin: 0 2px 18px; }.overview-title-row h2 { margin: 0; font-size: 25px; }.timezone-note { color: #79877f; font-size: 11px; }
.metric-section { margin-bottom: 22px; }.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 0 2px 11px; }.section-heading h2 { margin: 3px 0 0; font-size: 18px; }.section-heading p { max-width: 620px; margin: 0; color: #7c8981; font-size: 11px; line-height: 1.6; text-align: right; }.section-kicker { color: #4a9d68; font-size: 10px; font-weight: 850; letter-spacing: .12em; }
.metric-grid { display: grid; gap: 12px; }.metric-grid.four { grid-template-columns: repeat(4,minmax(0,1fr)); }.metric-grid.five { grid-template-columns: repeat(5,minmax(0,1fr)); }
.metric-card { position: relative; overflow: hidden; min-height: 116px; padding: 18px 19px; border: 1px solid #e1e8e3; border-radius: 14px; background: white; box-shadow: 0 7px 20px rgba(29,64,42,.04); }.metric-card::after { content:""; position:absolute; right:-20px; bottom:-28px; width:78px; height:78px; border-radius:50%; background:#e9f4ec; }.metric-card > * { position:relative; z-index:1; }.metric-card span { color:#5d6d63; font-size:11px; font-weight:750; }.metric-card strong { display:block; margin:10px 0 5px; color:#183e2a; font-size:27px; letter-spacing:-.035em; }.metric-card small { color:#89958d; font-size:10px; }.metric-card.primary { border-color:#bbd9c5; background:linear-gradient(145deg,#f4fbf6,#fff); }.metric-card.payment::after { background:#fbf0dc; }.metric-card.streamer::after { background:#e8eff9; }.metric-card.live { border-color:#a9d6b7; }.metric-card.live small { display:flex; align-items:center; gap:6px; }.metric-card.live i { width:7px; height:7px; border-radius:50%; background:#4caf6d; box-shadow:0 0 0 4px rgba(76,175,109,.13); }
.trend-panel { margin-top: 6px; overflow: hidden; }.trend-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding:22px 24px 18px; border-bottom:1px solid #e7ede8; }.trend-toolbar h2 { margin:0; font-size:20px; }.trend-toolbar p:not(.eyebrow) { margin:6px 0 0; color:#7c8981; font-size:11px; }.trend-controls { display:flex; align-items:center; gap:9px; }.trend-controls label { color:#66766c; font-size:11px; font-weight:750; }.trend-controls input { width:145px; height:38px; }
.compact-tabs { display:grid; grid-template-columns:repeat(3,42px); gap:3px; padding:3px; border:1px solid #dfe8e1; border-radius:10px; background:#f3f7f4; }.compact-tabs button { height:31px; border:0; border-radius:7px; color:#5d6d63; background:transparent; font-size:12px; font-weight:800; }.compact-tabs button.active { color:white; background:var(--forest-2); }
.overview-status { padding:10px 24px; color:#6f7f75; background:#fafcfb; font-size:11px; }.overview-status.error { color:#a33b3b; background:#fff4f2; }.overview-status.success { color:#34714c; }
.chart-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:18px; }.chart-card { min-width:0; padding:17px; border:1px solid #e3eae5; border-radius:13px; background:#fff; }.chart-card h3 { margin:0; font-size:14px; }.chart-card p { margin:5px 0 10px; color:#87938b; font-size:10px; }.trend-chart { width:100%; min-height:220px; }.trend-chart svg { display:block; width:100%; height:230px; overflow:visible; }.chart-grid-line { stroke:#e8eee9; stroke-width:1; }.chart-axis-value,.chart-axis-label { fill:#8a978f; font-family:"Microsoft YaHei UI",sans-serif; font-size:9px; }.chart-line { fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }.chart-area { opacity:.10; }.chart-dot { stroke:white; stroke-width:2; }

/* 积分排名 */
.rankings-topbar > div > p:last-child { margin:7px 0 0; color:#78867e; font-size:12px; }
.ranking-boundary { display:flex; align-items:center; gap:13px; margin-bottom:18px; padding:14px 16px; border:1px solid #cfe3d5; border-radius:13px; color:#315d43; background:#f0f8f2; }
.boundary-icon { display:grid; width:46px; height:34px; place-items:center; flex:0 0 auto; border-radius:9px; color:white; background:#2f7850; font-size:10px; font-weight:900; }
.ranking-boundary strong { font-size:13px; }.ranking-boundary p { margin:4px 0 0; color:#65806e; font-size:10px; line-height:1.5; }
.ranking-selector-panel { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:18px; padding:20px 22px; }
.ranking-selector-panel h2 { margin:0; font-size:19px; }.ranking-selector-panel p:not(.eyebrow) { margin:6px 0 0; color:#7a8880; font-size:11px; }
.ranking-selector-panel label { min-width:260px; }.ranking-selector-panel label > span { display:block; margin-bottom:6px; color:#66756c; font-size:10px; font-weight:800; }.ranking-selector-panel select { width:100%; height:44px; }
.ranking-workspace { overflow:hidden; }.readonly-badge { padding:5px 8px; border-radius:7px; color:#8b641e; background:#fff2d4; font-size:10px; font-weight:800; }
.row-action:disabled { cursor:not-allowed; color:#9aa49e; border-color:#e3e8e5; background:#f5f7f6; }

@media (max-width: 1180px) { .metric-grid.five { grid-template-columns:repeat(3,minmax(0,1fr)); }.chart-grid { grid-template-columns:1fr; }.trend-chart { min-height:200px; } }
@media (max-width: 820px) { .project-selector { grid-template-columns:1fr; gap:12px; }.selector-arrow { display:none; }.selector-step { grid-template-columns:32px minmax(105px,.6fr) minmax(150px,1fr); }.metric-grid.four,.metric-grid.five { grid-template-columns:repeat(2,minmax(0,1fr)); }.trend-toolbar { align-items:stretch; flex-direction:column; }.trend-controls { flex-wrap:wrap; }.section-heading { align-items:flex-start; flex-direction:column; gap:5px; }.section-heading p { text-align:left; }.overview-title-row { align-items:flex-start; flex-direction:column; gap:7px; } }
@media (max-width: 540px) { .overview-header { align-items:flex-start; }.environment-badge { min-height:30px; padding:0 9px; font-size:10px; }.project-selector { padding:16px; }.selector-step { grid-template-columns:30px 1fr; }.selector-step select { grid-column:1 / -1; }.metric-grid.four,.metric-grid.five { grid-template-columns:1fr 1fr; }.metric-card { min-height:104px; padding:15px; }.metric-card strong { font-size:23px; }.trend-controls input { width:135px; }.chart-grid { padding:12px; }.chart-card { padding:13px; } }
.environment-value { font-size: 20px !important; }
.gift-event-table { min-width: 1120px; }
.source-badge { display: inline-flex; padding: 4px 8px; border-radius: 999px; color: #246b43; background: #e9f6ed; font-size: 10px; font-weight: 800; }
.source-simulator { color: #7a5719; background: #fff3d5; }
.event-id-cell { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.record-count { padding: 6px 9px; border-radius: 8px; color: #6c7c73; background: #f1f5f2; font-size: 10px; }
.audit-table { min-width: 1120px; }
.audit-table td { height: 58px; font-size: 12px; }
.operation-badge { padding: 4px 7px; border-radius: 7px; color: #276944; background: #eaf6ed; font-size: 10px; font-weight: 800; white-space: nowrap; }
.cell-note { display: block; margin-top: 3px; color: #8c978f; font-size: 9px; }
.score-change { color: #234d35 !important; font-weight: 800; white-space: nowrap; }
.reason-cell { min-width: 190px; max-width: 320px; line-height: 1.5; }

/* 玩家付费搜索 */
.player-search-panel { margin-top: 18px; overflow: hidden; }
.global-gift-config { margin-bottom: 18px; overflow: hidden; }
.global-effect-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 0 24px 24px; }
.global-effect-card { min-width: 0; padding: 18px; border: 1px solid #dfe8e2; border-radius: 15px; background: #fafcfb; }
.global-effect-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.global-effect-card-heading h3 { margin: 0 0 5px; font-size: 18px; }
.global-effect-card-heading p { margin: 0; color: #64746b; font-size: 13px; line-height: 1.55; }
.fixed-rule-value { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 12px 14px; border-radius: 10px; background: #eef5f1; }
.fixed-rule-value span { color: #52635a; font-size: 12px; font-weight: 800; }
.fixed-rule-value strong { color: #125b40; }
.config-status { display: inline-flex; min-height: 30px; align-items: center; padding: 0 10px; border-radius: 999px; color: #7a6750; background: #f5eee4; font-size: 10px; font-weight: 850; white-space: nowrap; }
.config-status.active { color: #236a42; background: #e8f6ec; }
.global-gift-config-body { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(340px, 1.2fr); gap: 18px; padding: 0 24px 24px; }
.fixed-effect-summary { display: flex; min-height: 150px; flex-direction: column; justify-content: center; padding: 20px; border: 1px solid #cfe4d6; border-radius: 13px; background: linear-gradient(145deg, #eff9f2, #fff); }
.fixed-effect-summary span { color: #4c765b; font-size: 10px; font-weight: 850; letter-spacing: .1em; }
.fixed-effect-summary strong { margin: 9px 0 8px; color: #17472f; font-size: 21px; }
.fixed-effect-summary small { color: #6f8276; font-size: 11px; line-height: 1.7; }
.global-gift-form { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: 18px; border: 1px solid #e1e8e3; border-radius: 13px; background: #fafcfb; }
.global-gift-form label > span { display: block; margin-bottom: 7px; color: #4d5e54; font-size: 12px; font-weight: 800; }
.global-gift-form select { width: 100%; }
.current-gift { min-height: 20px; margin: 10px 0 14px; color: #617168; font-size: 11px; }
.current-gift strong { color: #255e3d; }
.global-gift-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.player-search-form { padding: 0 24px 22px; }
.player-search-form > label { display: block; margin-bottom: 7px; color: #4d5e54; font-size: 12px; font-weight: 800; }
.player-search-form > small { display: block; margin-top: 8px; color: #849087; font-size: 10px; }
.player-search-controls { display: grid; grid-template-columns: minmax(220px, 620px) auto; gap: 10px; justify-content: start; }
.player-search-controls .button { min-width: 112px; }
.search-status { min-height: 38px; padding: 10px 24px; color: #66766c; border-top: 1px solid #edf2ee; background: #fafcfb; font-size: 11px; }
.player-search-results { border-top: 1px solid #edf2ee; }
.player-result-table { min-width: 880px; }
.button-small { min-height: 32px; padding: 0 11px; font-size: 11px; }
.payment-value { color: #7a5719 !important; font-weight: 850; white-space: nowrap; }
.player-payment-detail { margin-top: 18px; overflow: hidden; scroll-margin-top: 18px; }
.payment-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 0 24px 18px; }
.payment-summary-grid article { min-width: 0; padding: 15px 16px; border: 1px solid #e3eae5; border-radius: 12px; background: #f9fbfa; }
.payment-summary-grid span { display: block; color: #718078; font-size: 10px; font-weight: 750; }
.payment-summary-grid strong { display: block; margin-top: 7px; color: #1b4d33; font-size: 17px; line-height: 1.35; overflow-wrap: anywhere; }
.detail-source-note { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 10px; margin: 0 24px 18px; padding: 11px 13px; border-radius: 10px; color: #718078; background: #f5f8f6; font-size: 10px; }
.source-legend-item { display: inline-flex; align-items: center; gap: 8px; }
.payment-detail-table { min-width: 1240px; }
.empty-table-cell { height: 90px !important; color: #7d8982 !important; text-align: center; }
.payment-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 15px 24px; border-top: 1px solid #e8eeea; color: #66766c; font-size: 11px; }
.payment-pagination .button { min-height: 34px; padding: 0 12px; font-size: 11px; }
.payment-pagination .button:disabled { cursor: not-allowed; opacity: .45; }

/* 付费礼物链路 */
.page-subtitle { margin: 7px 0 0; color: #77867d; font-size: 12px; }
.paid-boundary { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; padding: 15px 17px; border: 1px solid #edcf9f; border-radius: 14px; color: #6e4d17; background: #fff8e9; }
.paid-boundary-mark { display: grid; min-width: 48px; height: 32px; place-items: center; border-radius: 9px; color: white; background: #a66f20; font-size: 10px; font-weight: 900; }
.paid-boundary strong { display: block; font-size: 13px; }.paid-boundary p { margin: 3px 0 0; font-size: 11px; }
.paid-health-panel,.paid-chain-list,.paid-chain-detail { margin-bottom: 18px; overflow: hidden; scroll-margin-top: 18px; }
.paid-health-status { display: inline-flex; min-width: 82px; min-height: 32px; align-items: center; justify-content: center; border-radius: 999px; font-size: 11px; font-weight: 900; }
.paid-health-status.ok { color: #23683f; background: #e8f6ec; }.paid-health-status.warning { color: #8a6019; background: #fff2d3; }.paid-health-status.critical { color: #a23434; background: #fde8e6; }.paid-health-status.unavailable { color: #606d65; background: #edf1ee; }
.paid-health-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; padding: 0 24px 20px; }
.paid-health-grid article { min-width: 0; padding: 15px 16px; border: 1px solid #e1e8e3; border-radius: 12px; background: #fafcfb; }
.paid-health-grid span,.paid-original-summary span,.paid-grant-meta span { display: block; color: #718078; font-size: 10px; font-weight: 750; }
.paid-health-grid strong,.paid-original-summary strong,.paid-grant-meta strong { display: block; margin: 7px 0 4px; color: #1c4c33; font-size: 20px; overflow-wrap: anywhere; }
.paid-health-grid small,.paid-original-summary small,.paid-grant-meta small { display: block; color: #8a968e; font-size: 10px; line-height: 1.45; }
.paid-alert-list { display: flex; min-height: 44px; align-items: center; flex-wrap: wrap; gap: 7px; padding: 0 24px 20px; }
.paid-alert-badge { display: inline-flex; max-width: 360px; min-height: 28px; align-items: center; padding: 5px 9px; border-radius: 8px; color: #805b1c; background: #fff1cf; font-size: 10px; font-weight: 800; line-height: 1.35; }
.paid-alert-badge.critical { color: #9c3030; background: #fde7e4; }.paid-alert-empty { color: #849087; font-size: 11px; }
.paid-chain-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 0 24px 20px; }
.paid-chain-toolbar label > span:first-child { display: block; margin-bottom: 7px; color: #4f6056; font-size: 11px; font-weight: 800; }
.paid-chain-toolbar select { width: 210px; }.paid-event-search { width: min(620px,100%); }.paid-event-search label { display: block; }.paid-search-controls { display: grid; grid-template-columns: minmax(240px,1fr) auto; gap: 9px; }
.paid-chain-table { min-width: 1320px; }.paid-chain-table td { vertical-align: middle; }
.chain-status { display: inline-flex; min-height: 28px; align-items: center; padding: 4px 8px; border-radius: 8px; color: #626f67; background: #edf1ee; font-size: 10px; font-weight: 850; white-space: nowrap; }
.chain-status.acknowledged { color: #21683f; background: #e6f5eb; }.chain-status.pending,.chain-status.delivered_unacked,.chain-status.partially_acknowledged { color: #7b581b; background: #fff1d2; }.chain-status.no_target,.chain-status.expired_legacy { color: #9b3734; background: #fde8e5; }.chain-status.disposed { color: #53627b; background: #eaf0f7; }
.paid-alert-cell { max-width: 260px; }.paid-alert-cell .paid-alert-badge { margin: 2px; white-space: normal; }
.delivery-attempts { color: #345f47; }.delivery-attempts.high { color: #a14931; }.paid-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 24px; border-top: 1px solid #e7ede9; color: #718078; font-size: 11px; }
.paid-original-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding: 0 24px 18px; }
.paid-original-summary article,.paid-grant-meta article { min-width: 0; padding: 14px 15px; border: 1px solid #e2e9e4; border-radius: 11px; background: #fafcfb; }
.paid-original-summary strong,.paid-grant-meta strong { font-size: 15px; }
.paid-capability-note { margin: 0 24px 18px; padding: 13px 15px; border: 1px dashed #d6ded8; border-radius: 11px; color: #68766e; background: #f8faf9; }
.paid-capability-note strong { margin-right: 8px; color: #3c5144; font-size: 11px; }.paid-capability-note span { padding: 3px 6px; border-radius: 6px; color: #785d2b; background: #f7edd9; font-size: 9px; font-weight: 850; }.paid-capability-note p { margin: 6px 0 0; font-size: 10px; }
.paid-grant-list { display: grid; gap: 14px; padding: 0 24px 22px; }.paid-grant-card { overflow: hidden; border: 1px solid #dfe7e1; border-radius: 14px; background: white; }
.paid-grant-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; background: #f7faf8; }.paid-grant-heading h3 { margin: 3px 0; font-size: 15px; }.paid-grant-heading p { margin: 0; color: #7c8881; font-size: 9px; overflow-wrap: anywhere; }.paid-grant-amount { color: #205f3b; text-align: right; }.paid-grant-amount strong { display: block; font-size: 23px; }.paid-grant-amount small { display: block; max-width: 220px; margin-top: 3px; color: #73827a; font-size: 9px; font-weight: 700; line-height: 1.35; }
.paid-grant-meta { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; padding: 14px 18px; }.paid-grant-meta article { padding: 11px 12px; }.paid-grant-meta strong { font-size: 13px; }
.paid-delivery-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding: 12px 18px; border-top: 1px solid #e6ece8; }.paid-delivery-heading h4 { margin: 0; font-size: 12px; }.paid-delivery-heading small { max-width: 55%; color: #7d8a82; font-size: 9px; overflow-wrap: anywhere; }
.paid-delivery-table { min-width: 1260px; }.paid-delivery-table td { vertical-align: top; }.paid-no-delivery,.paid-no-effect { padding: 22px; color: #7b8780; background: #fafcfb; font-size: 11px; text-align: center; }.missing-field { color: #82662e; font-size: 10px; }
.paid-recovery-box { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 0 24px 24px; padding: 15px 17px; border: 1px solid #dfe5e1; border-radius: 12px; background: #f6f8f7; }.paid-recovery-box strong { font-size: 12px; }.paid-recovery-box p { margin: 4px 0 0; color: #78857d; font-size: 10px; }.paid-recovery-box button:disabled { cursor: not-allowed; opacity: .55; }

.commerce-boundary { display:flex; align-items:center; gap:14px; margin-bottom:18px; padding:15px 18px; border:1px solid #cfe4d6; border-radius:13px; color:#355b45; background:#f0f8f3; }.commerce-boundary strong { font-size:12px; }.commerce-boundary p { margin:4px 0 0; color:#68786e; font-size:10px; line-height:1.6; }
.permission-badge,.readonly-note { color:#6d5b35; background:#f8eed9; font-size:10px; font-weight:800; }.permission-badge { display:inline-flex; min-height:28px; align-items:center; padding:4px 9px; border-radius:8px; }.readonly-note { margin:14px 24px 22px; padding:11px 13px; border-radius:9px; }
.commerce-toolbar { display:flex; align-items:flex-end; gap:12px; padding:0 24px 18px; }.commerce-toolbar label { min-width:180px; }.commerce-toolbar label span,.commerce-player-search label span,.commerce-product-form label > span { display:block; margin-bottom:7px; color:#4f6056; font-size:11px; font-weight:800; }.commerce-toolbar select { width:100%; }
.commerce-product-table { min-width:1540px; }.commerce-product-table td,.commerce-inventory-table td,.commerce-log-table td { vertical-align:middle; }
.commerce-product-table td strong,.commerce-product-table td small { display:block; }.commerce-product-table td small { margin-top:4px; color:#758179; font-size:9px; }.commerce-key-cell { max-width:250px; overflow-wrap:anywhere; }.commerce-command-cell { white-space:pre-line; line-height:1.8; font-weight:700; }.commerce-active { color:#18734a; font-weight:800; }.commerce-inactive { color:#8a6a2d; font-weight:800; }.empty-cell { padding:24px !important; color:#7a877f; text-align:center; }.commerce-player-panel > #commerce-adjust-wallet { margin:14px 24px 22px; }
.commerce-product-form { padding:0 24px 24px; }.commerce-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.commerce-form-grid label { min-width:0; }.commerce-form-grid input,.commerce-form-grid select,.commerce-form-grid textarea { width:100%; }.commerce-form-grid textarea { resize:vertical; }.commerce-span-2 { grid-column:1 / -1; }.commerce-check { display:flex; align-items:center; align-self:end; min-height:42px; gap:9px; }.commerce-check input { width:auto; }.commerce-check span { margin:0 !important; }.commerce-form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:18px; }
.commerce-health-grid,.commerce-wallet-grid,.commerce-slots { display:grid; gap:10px; padding:0 24px 20px; }.commerce-health-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }.commerce-wallet-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }.commerce-slots { grid-template-columns:repeat(5,minmax(0,1fr)); }.commerce-health-grid article,.commerce-wallet-grid article,.commerce-slots article { min-width:0; padding:14px 15px; border:1px solid #e1e8e3; border-radius:11px; background:#fafcfb; }.commerce-health-grid span,.commerce-wallet-grid span,.commerce-slots span { display:block; color:#718078; font-size:10px; }.commerce-health-grid strong,.commerce-wallet-grid strong,.commerce-slots strong { display:block; margin-top:7px; color:#1f5f3c; font-size:18px; overflow-wrap:anywhere; }.commerce-wallet-grid small { display:block; margin-top:5px; color:#849088; font-size:9px; }
.commerce-player-search { display:grid; grid-template-columns:160px minmax(260px,1fr) auto; align-items:end; gap:10px; padding:0 24px 18px; }.commerce-player-search input,.commerce-player-search select { width:100%; }.commerce-player-identity { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; margin:0 24px 4px; padding:13px 15px; border-radius:10px; background:#f3f7f4; }.commerce-player-identity strong { font-size:14px; }.commerce-player-identity span,.commerce-player-identity small { color:#718078; font-size:10px; overflow-wrap:anywhere; }
.commerce-inventory-table { min-width:1020px; }.commerce-log-table { min-width:1280px; }.commerce-log-tabs { display:flex; gap:7px; padding:0 24px 16px; overflow-x:auto; }.commerce-log-tabs button { min-height:34px; padding:0 12px; border:1px solid #dbe4dd; border-radius:8px; color:#5f6e65; background:#f8faf9; font-size:10px; font-weight:800; white-space:nowrap; cursor:pointer; }.commerce-log-tabs button.active { color:white; border-color:#1c6644; background:#1c6644; }

@media (max-width: 1180px) {
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .paid-health-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .paid-grant-meta { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .commerce-wallet-grid,.commerce-slots { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width: 820px) {
  .login-body { background-size: 48px 48px; }
  .login-shell { grid-template-columns: 1fr; overflow: auto; }
  .login-brand {
    width: 100%;
    min-height: 286px;
    margin: 0;
    padding: 26px 24px 62px;
    clip-path: polygon(0 0, 100% 0, 100% 88%, 72% 100%, 0 94%);
  }
  .login-brand::before { width: 310px; left: 34%; top: 18px; border-width: 34px; }
  .login-brand::after { right: 0; }
  .login-logo-frame-large { width: 60px; height: 60px; border-radius: 17px; }
  .login-brand-combo-light .login-wordmark strong { font-size: 28px; }
  .login-brand-title { margin: 46px 0 0; }
  .login-brand-title::before { display: none; }
  .login-brand-title p { margin-bottom: 10px; font-size: 10px; }
  .login-brand-title h1 { font-size: clamp(34px, 8vw, 52px); }
  .login-card { width: min(500px, calc(100% - 32px)); margin: -4px auto 28px; padding: 34px 30px; }
  .app-body { padding: 0; }
  .sidebar { position: static; width: 100%; height: auto; padding: 14px 16px 10px; }
  .sidebar-brand { padding: 0 0 12px; }
  .sidebar-context { grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 12px; margin: 0 0 10px; padding: 9px 11px; }
  .sidebar-current-game { grid-template-columns: auto minmax(0,1fr); }
  .sidebar-current-game small { display: none; }
  .sidebar-nav { display: flex; overflow-x: auto; padding-bottom: 4px; }
  .nav-item { min-width: max-content; min-height: 38px; }
  .nav-icon, .nav-item small { display: none; }
  .sidebar-footer { position: absolute; top: 23px; right: 16px; display: block; margin: 0; padding: 0; border: 0; }
  .sidebar-footer .admin-chip { display: none; }
  .sidebar-footer .text-button { padding: 7px 10px; border: 1px solid rgba(255,255,255,.16); border-radius: 8px; color: rgba(255,255,255,.76); }
  .sidebar-brand { padding-right: 72px; }
  .main-content { padding: 22px 14px 40px; }
  .topbar { align-items: flex-start; }
  .topbar h1 { font-size: 25px; }
  .game-switcher { align-items: flex-end; flex-direction: column; }
  .game-switcher label { display: none; }
  .game-switcher select { width: 130px; }
  .panel-heading { padding: 18px; }
  .date-control { align-items: flex-end; flex-direction: column; gap: 5px; }
  .date-control input { width: 136px; }
  .history-picker { grid-template-columns: auto 150px; }
  .history-picker input, .lifetime-scope { width: 150px; min-width: 150px; }
  .ranking-workspace > .panel-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
  .ranking-workspace > .panel-heading > :first-child { grid-column: 1; grid-row: 1; min-width: 0; }
  .ranking-workspace > .panel-heading > .panel-collapse-toggle { grid-column: 2; grid-row: 1; align-self: start; }
  .ranking-workspace > .panel-heading > .date-control { grid-column: 1 / -1; grid-row: 2; width: 100%; align-items: center; flex-direction: row; justify-content: space-between; }
  .ranking-workspace .history-picker { width: 100%; grid-template-columns: auto minmax(0, 1fr); }
  .ranking-workspace .history-picker input,
  .ranking-workspace .lifetime-scope { width: 100%; min-width: 0; }
  .period-tabs { margin: 0 16px 14px; }
  .period-summary { padding: 11px 16px; }
  .dialog-actions { flex-wrap: wrap; }
  .action-spacer { display: none; }
  .dialog-actions .button { flex: 1 1 auto; }
  .ranking-selector-panel { align-items:stretch; flex-direction:column; gap:14px; }
  .ranking-selector-panel label { min-width:0; }
  .collapse-header > .panel-collapse-toggle { align-self: flex-end; }
  .payment-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 18px 18px; }
  .detail-source-note { margin: 0 18px 18px; }
  .global-gift-config-body { grid-template-columns: 1fr; padding: 0 18px 18px; }
  .global-effect-grid { grid-template-columns: 1fr; padding: 0 18px 18px; }
  .fixed-effect-summary { min-height: 124px; }
  .paid-chain-toolbar { align-items: stretch; flex-direction: column; padding: 0 18px 18px; }
  .paid-chain-toolbar select,.paid-event-search { width: 100%; }
  .paid-health-grid { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 0 18px 18px; }
  .paid-alert-list { padding: 0 18px 18px; }
  .paid-original-summary { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 0 18px 18px; }
  .paid-capability-note { margin: 0 18px 18px; }.paid-grant-list { padding: 0 18px 18px; }
  .paid-recovery-box { margin: 0 18px 18px; }
  .commerce-toolbar { align-items:stretch; flex-direction:column; padding:0 18px 18px; }.commerce-toolbar label { min-width:0; width:100%; }
  .commerce-product-form { padding:0 18px 18px; }.commerce-health-grid { grid-template-columns:repeat(2,minmax(0,1fr)); padding:0 18px 18px; }.commerce-wallet-grid,.commerce-slots { grid-template-columns:repeat(2,minmax(0,1fr)); padding:0 18px 18px; }
  .commerce-player-search { grid-template-columns:1fr 2fr; padding:0 18px 18px; }.commerce-player-search .button { grid-column:1 / -1; width:100%; }.commerce-player-identity { margin:0 18px 4px; }.commerce-log-tabs { padding:0 18px 16px; }
}

@media (max-width: 540px) {
  .login-brand { min-height: 246px; padding: 22px 20px 50px; }
  .login-logo-frame-large { width: 54px; height: 54px; border-radius: 15px; }
  .login-brand-combo { gap: 12px; }
  .login-brand-combo-light .login-wordmark strong { font-size: 25px; }
  .login-brand-combo-light .login-wordmark small { font-size: 11px; }
  .login-brand-title { margin-top: 38px; }
  .login-brand-title h1 { font-size: 34px; }
  .login-card { width: calc(100% - 24px); margin: -2px auto 16px; padding: 28px 20px 24px; border-radius: 22px; }
  .login-card .login-logo-frame { width: 48px; height: 48px; border-radius: 13px; }
  .login-card .login-wordmark strong { font-size: 25px; }
  .login-card-divider { margin: 20px 0 24px; }
  .login-card h2 { font-size: 34px; }
  .login-card > .muted { margin-bottom: 24px; }
  .login-safety { margin-top: 19px; font-size: 10px; }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .stat-card { min-height: 112px; padding: 16px; }
  .stat-card strong { font-size: 22px; }
  .stat-card small { display: none; }
  .panel-heading { gap: 12px; }
  .panel-heading p { display: none; }
  .panel-collapse-toggle { min-width: 68px; min-height: 32px; padding: 0 9px; }
  .metric-section.collapsible-panel.is-collapsed { padding: 15px 16px; }
  .period-tab { min-width: 0; padding: 0 8px; }
  .period-summary { flex-direction: column; gap: 4px; }
  .score-dialog form { padding: 21px; }
  .ranking-boundary { align-items:flex-start; }
  .player-search-form { padding: 0 18px 18px; }
  .player-search-controls { grid-template-columns: 1fr; }
  .player-search-controls .button { width: 100%; }
  .search-status { padding: 10px 18px; }
  .payment-summary-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .payment-summary-grid article { padding: 12px; }
  .payment-summary-grid strong { font-size: 14px; }
  .payment-pagination { justify-content: space-between; padding: 13px 16px; }
  .global-gift-actions .button { flex: 1 1 100%; }
  .global-effect-card { padding: 14px; }
  .global-effect-card-heading { flex-direction: column; }
  .fixed-effect-summary strong { font-size: 18px; }
  .paid-boundary { align-items: flex-start; }.paid-boundary p { line-height: 1.5; }
  .paid-health-grid { gap: 8px; }.paid-health-grid article { padding: 12px; }.paid-health-grid strong { font-size: 17px; }
  .paid-search-controls { grid-template-columns: 1fr; }.paid-search-controls .button { width: 100%; }
  .paid-original-summary { grid-template-columns: 1fr 1fr; gap: 8px; }.paid-original-summary article { padding: 11px; }
  .paid-grant-heading { align-items: flex-start; flex-direction: column; }.paid-grant-amount { text-align: left; }.paid-grant-amount strong { font-size: 20px; }
  .paid-grant-meta { grid-template-columns: 1fr 1fr; padding: 12px; }.paid-delivery-heading { align-items: flex-start; flex-direction: column; }.paid-delivery-heading small { max-width: 100%; }
  .paid-recovery-box { align-items: stretch; flex-direction: column; }.paid-recovery-box .button { width: 100%; }
  .paid-pagination { padding: 13px 16px; }
  .commerce-boundary { align-items:flex-start; }.commerce-boundary p { line-height:1.5; }
  .commerce-form-grid { grid-template-columns:1fr; }.commerce-span-2 { grid-column:auto; }.commerce-form-actions .button { flex:1 1 0; }
  .commerce-health-grid,.commerce-wallet-grid,.commerce-slots { grid-template-columns:1fr 1fr; gap:8px; }.commerce-health-grid article,.commerce-wallet-grid article,.commerce-slots article { padding:12px; }.commerce-health-grid strong,.commerce-wallet-grid strong,.commerce-slots strong { font-size:15px; }
  .commerce-player-search { grid-template-columns:1fr; }.commerce-player-search .button { grid-column:auto; }.commerce-player-identity { align-items:flex-start; flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}