:root {
  color-scheme: light;
  --bg: #f3f4f6;
  --surface: #ffffff;
  --surface-2: #f9fafb;
  --surface-3: #f3f4f6;
  --text: #111827;
  --muted: #6b7280;
  --line: #e5e7eb;
  --line-strong: #d1d5db;
  --primary: #4f46e5;
  --primary-hover: #4338ca;
  --primary-soft: #eef2ff;
  --success: #059669;
  --success-soft: #ecfdf5;
  --danger: #dc2626;
  --danger-soft: #fef2f2;
  --warning: #d97706;
  --warning-soft: #fffbeb;
  --info: #0284c7;
  --info-soft: #f0f9ff;
  --shadow: 0 1px 2px rgb(0 0 0 / 0.04), 0 1px 3px rgb(0 0 0 / 0.03);
  --table-row: #ffffff;
  --table-row-alt: #f4f6f9;
  --table-row-hover: #eef4fb;
  --sidebar: 160px;
  font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "SF Pro Text", "Helvetica Neue", system-ui, sans-serif;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0f172a;
  --surface: #111827;
  --surface-2: #172033;
  --surface-3: #1f2937;
  --text: #f3f4f6;
  --muted: #9ca3af;
  --line: #273449;
  --line-strong: #374151;
  --primary: #818cf8;
  --primary-hover: #a5b4fc;
  --primary-soft: #252b55;
  --success: #34d399;
  --success-soft: #123a32;
  --danger: #f87171;
  --danger-soft: #3d1f27;
  --warning: #fbbf24;
  --warning-soft: #3c3219;
  --info: #38bdf8;
  --info-soft: #13334a;
  --shadow: 0 1px 3px rgb(0 0 0 / 0.25);
  --table-row: #131722;
  --table-row-alt: #181d2c;
  --table-row-hover: #1e2c40;
}

* { box-sizing: border-box; }

/* Premium Dark Thin Scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, 0.30) transparent;
}
::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.28);
  border-radius: 999px;
  transition: background-color 0.2s ease;
}
::-webkit-scrollbar-thumb:hover { background: rgba(148, 163, 184, 0.48); }
::-webkit-scrollbar-thumb:active { background: rgba(186, 200, 219, 0.65); }
::-webkit-scrollbar-corner { background: transparent; }
.admin-scroll {
  overflow-y: auto;
  padding-right: 6px;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, 0.30) transparent;
}
.admin-scroll::-webkit-scrollbar { width: 4px; }
.admin-scroll::-webkit-scrollbar-track { background: transparent; }
.admin-scroll::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.28);
  border-radius: 999px;
}
.admin-scroll::-webkit-scrollbar-thumb:hover { background: rgba(148, 163, 184, 0.48); }
.admin-scroll::-webkit-scrollbar-thumb:active { background: rgba(186, 200, 219, 0.65); }
html { min-width: 1920px; background: var(--bg); }
html.is-modal-open,
html.is-modal-open body,
html:has(#modalLayer.open),
html:has(#modalLayer.open) body {
  overflow: hidden !important;
  overscroll-behavior: none;
}
body.is-modal-open {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
}
body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-size: 13px;
  font-weight: 450;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

.shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--sidebar) minmax(0, 1fr);
}
.sidebar {
  position: sticky; top: 0; align-self: start;
  height: 100vh;
  width: var(--sidebar); display: flex; flex-direction: column;
  background: var(--surface); border-right: 1px solid var(--line);
}
.logo-row {
  height: 64px; flex: 0 0 64px; display: flex; align-items: center;
  gap: 10px; padding: 0 8px; border-bottom: 1px solid var(--line);
}
.admin-logo {
  width: 100%;
  max-width: 132px;
  max-height: 40px;
  display: block;
  margin: 0 auto;
  object-fit: contain;
  object-position: center;
}
.logo-mark {
  width: 31px; height: 31px; display: grid; place-items: center;
  color: white; border-radius: 9px; font-size: 14px; font-weight: 800;
  background: linear-gradient(145deg, #6366f1, #4338ca);
  box-shadow: 0 4px 10px rgb(79 70 229 / .24);
}
.logo-copy strong { display: block; font-size: 15px; letter-spacing: -.2px; }
.logo-copy span { display: block; color: var(--muted); font-size: 10px; letter-spacing: .6px; }
.nav-scroll { flex: 1; overflow-y: auto; padding: 8px 6px 16px; }
.nav-group { margin-bottom: 3px; }
.nav-group-button, .nav-link {
  width: 100%; min-height: 36px; display: flex; align-items: center; gap: 10px;
  border: 0; border-radius: 7px; background: transparent; padding: 8px 10px;
  text-align: left; color: #374151; font-size: 12px;
}
[data-theme="dark"] .nav-group-button, [data-theme="dark"] .nav-link { color: #d1d5db; }
.nav-group-button:hover, .nav-link:hover { background: var(--surface-3); color: var(--text); }
.nav-icon { width: 18px; height: 18px; display: grid; place-items: center; flex: 0 0 18px; color: #6b7280; }
.nav-icon svg { width: 17px; height: 17px; stroke-width: 1.8; }
.nav-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chevron { width: 14px; height: 14px; transition: transform .18s ease; }
.nav-group.open .chevron { transform: rotate(90deg); }
.nav-children { display: none; padding: 2px 0 4px 18px; }
.nav-group.open > .nav-children { display: block; }
.nav-children .nav-link {
  position: relative; min-height: 31px; padding: 6px 10px 6px 17px; color: var(--muted); font-size: 12px;
}
.nav-children .nav-link::before {
  content: ""; position: absolute; left: 4px; top: 50%; width: 4px; height: 4px;
  border-radius: 999px; background: var(--line-strong); transform: translateY(-50%);
}
.nav-link.active { color: var(--primary); background: var(--primary-soft); font-weight: 600; }
.nav-children .nav-link.active::before { background: var(--primary); }
.sports-admin-footer {
  position: relative;
  z-index: 40;
  flex: 0 0 auto;
  padding: 6px;
  overflow: visible;
  border-top: 1px solid #173149;
}
.sports-admin-card {
  width: 100%;
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid #294a65;
  border-radius: 12px;
  padding: 7px 9px;
  color: #e7f0f8;
  background: linear-gradient(145deg, rgb(255 255 255 / .09), rgb(255 255 255 / .035));
  box-shadow: 0 4px 14px rgb(0 0 0 / .14), inset 0 1px rgb(255 255 255 / .04);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.sports-admin-card:hover {
  border-color: #3f718f;
  background: linear-gradient(145deg, rgb(255 255 255 / .13), rgb(255 255 255 / .055));
}
.sports-admin-avatar {
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  display: grid;
  place-items: center;
  border: 1px solid rgb(128 220 211 / .4);
  border-radius: 50%;
  color: #9ce9e2;
  background: #11374c;
  font-size: 9px;
  font-weight: 750;
  box-shadow: 0 2px 7px rgb(0 0 0 / .18);
}
.sports-admin-copy { min-width: 0; }
.sports-admin-copy strong,
.sports-admin-copy small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sports-admin-copy strong { font-size: 12px; font-weight: 650; }
.sports-admin-copy small { margin-top: 1px; color: #829bb0; font-size: 7px; letter-spacing: .35px; }
.sports-admin-footer .profile-menu {
  top: auto;
  right: 6px;
  bottom: calc(100% + 6px);
  left: 6px;
  min-width: 0;
  color: #e7f0f8;
  background: #0d2438;
  border-color: #294a65;
}
.sports-admin-footer .dropdown-item { color: #e7f0f8; }
.sports-admin-footer .dropdown-item:hover { background: rgb(255 255 255 / .08); }
.sports-admin-footer .dropdown-item.danger { color: #fca5a5; }
.avatar {
  width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 30px;
  border-radius: 50%; color: white; background: #64748b; font-size: 11px; font-weight: 700;
}
.drawer-backdrop { display: none; }

.main-app {
  min-width: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  margin-left: 0;
}
.top-stack { position: sticky; top: 0; z-index: 25; }
.topbar {
  height: 48px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 24px; background: var(--surface); border-bottom: 1px solid var(--line);
}
.topbar-left, .topbar-actions { display: flex; align-items: center; gap: 8px; }
.breadcrumb { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; }
.breadcrumb strong { color: var(--text); font-weight: 550; }
.icon-button {
  width: 32px; height: 32px; display: inline-grid; place-items: center;
  border: 1px solid transparent; border-radius: 7px; background: transparent; color: var(--muted);
}
.icon-button:hover { background: var(--surface-3); color: var(--text); }
.icon-button svg { width: 17px; height: 17px; }
.mobile-menu { display: none; }
.profile-wrap { position: relative; }
.profile-button {
  display: flex; align-items: center; gap: 8px; height: 34px; padding: 2px 7px 2px 3px;
  border: 0; border-radius: 8px; background: transparent;
}
.profile-button:hover { background: var(--surface-3); }
.profile-button .avatar { width: 28px; height: 28px; flex-basis: 28px; background: #4f46e5; }
.profile-button > span { font-size: 11px; font-weight: 550; }
.profile-menu, .action-menu {
  position: absolute; z-index: 50; display: none; min-width: 160px;
  padding: 5px; background: var(--surface); border: 1px solid var(--line);
  border-radius: 9px; box-shadow: 0 10px 25px rgb(0 0 0 / .12);
}
.profile-menu { top: 40px; right: 0; }
.profile-menu.open, .action-menu.open { display: block; }
.dropdown-item {
  width: 100%; display: flex; align-items: center; gap: 8px; border: 0;
  border-radius: 6px; background: transparent; padding: 8px 9px; text-align: left; font-size: 12px;
}
.dropdown-item:hover { background: var(--surface-3); }
.dropdown-item.danger { color: var(--danger); }
.info-strip {
  min-height: 88px; display: grid; grid-template-columns: repeat(12, minmax(82px, 1fr));
  padding: 12px 24px; background: var(--surface); border-bottom: 1px solid var(--line);
}
.info-item {
  min-width: 0; padding: 7px 13px; border-right: 1px solid var(--line);
}
.info-item:last-child { border: 0; }
.info-label { display: block; margin-bottom: 4px; color: var(--muted); font-size: 10px; white-space: nowrap; }
.info-value { display: block; font-size: 14px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.info-value.accent { color: var(--primary); }
.info-value.positive { color: var(--success); }
.info-value.negative { color: var(--danger); }

.content { flex: 1 0 auto; padding: 24px; }
.page-stage {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}
.page-loader {
  position: absolute;
  z-index: 40;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  background: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .15s ease, visibility .15s ease;
}
.page-loader.is-global { position: fixed; }
.page-loader[hidden] { display: none !important; }
.page-loader.is-on { opacity: 1; visibility: visible; }
.page-loader-mark {
  position: relative;
  display: grid;
  place-items: center;
  width: 100px;
  height: 100px;
}
.page-loader-mark img {
  display: block;
  width: 100px;
  height: 100px;
  object-fit: contain;
  filter: drop-shadow(0 0 12px color-mix(in srgb, var(--primary) 58%, transparent));
}
.page-loader.is-on .page-loader-mark img {
  animation: page-loader-logo 1.55s ease-in-out infinite;
}
.page-loader strong {
  position: relative;
  margin-top: 12px;
  color: var(--text);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .28em;
  text-indent: .28em;
  text-shadow: 0 1px 2px rgb(0 0 0 / .55), 0 0 12px color-mix(in srgb, var(--primary) 65%, transparent);
}
.page-loader small {
  position: relative;
  margin-top: 5px;
  color: var(--muted);
  font-size: 10px;
  letter-spacing: -.02em;
  text-shadow: 0 1px 2px rgb(0 0 0 / .5);
}
@keyframes page-loader-logo {
  0%, 100% { transform: scale(.93); filter: drop-shadow(0 0 8px color-mix(in srgb, var(--primary) 45%, transparent)); }
  50% { transform: scale(1.04); filter: drop-shadow(0 0 19px color-mix(in srgb, var(--primary) 82%, transparent)); }
}
@media (prefers-reduced-motion: reduce) {
  .page-loader.is-on .page-loader-mark img { animation: none !important; }
}
.admin-footer {
  min-height: 40px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: var(--surface);
  letter-spacing: .3px;
}
.admin-footer img {
  width: 18px;
  height: 18px;
  display: block;
  object-fit: contain;
}
.page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.page-title h1 { margin: 0; font-size: 20px; font-weight: 600; line-height: 28px; letter-spacing: -.3px; }
.page-title p { margin: 3px 0 0; color: #1f2937; font-size: 14px; }
[data-theme="dark"] .page-title p { color: #cbd5e1; }
.head-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 7px; }
.page-capture { min-width: 86px; }
.btn {
  min-height: 32px; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface);
  padding: 7px 12px; color: var(--text); font-size: 12px; line-height: 1;
}
.btn:hover { background: var(--surface-3); }
.btn-primary { border-color: var(--primary); background: var(--primary); color: white; padding: 8px 16px; }
.btn-primary:hover { border-color: var(--primary-hover); background: var(--primary-hover); }
.btn-danger { border-color: var(--danger); color: var(--danger); }
.btn-sm { min-height: 27px; padding: 5px 9px; font-size: 11px; border-radius: 6px; }
.btn svg { width: 14px; height: 14px; }
.card {
  background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow);
}
.card-titlebar {
  min-height: 49px; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 16px; border-bottom: 1px solid var(--line);
}
.card-titlebar h2 { margin: 0; font-size: 14px; font-weight: 600; }
.card-titlebar p { margin: 2px 0 0; color: var(--muted); font-size: 11px; }
.card-body { padding: 16px; }

.filter-bar {
  display: flex; align-items: end; flex-wrap: wrap; gap: 8px; margin-bottom: 12px;
  padding: 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 9px;
}
.field { display: grid; gap: 4px; min-width: 120px; }
.field.grow { flex: 1; min-width: 190px; }
.field label, .form-field label { color: var(--muted); font-size: 10px; font-weight: 550; }
.input, .select, .textarea {
  width: 100%; border: 1px solid var(--line-strong); border-radius: 6px;
  background: var(--surface); color: var(--text); font-size: 12px;
}
.input, .select { height: 30px; padding: 4px 9px; }
.textarea { min-height: 85px; padding: 8px 9px; resize: vertical; }
.input::placeholder, .textarea::placeholder { color: #9ca3af; }
.input:focus, .select:focus, .textarea:focus { border-color: var(--primary); outline: 2px solid rgb(79 70 229 / .12); }
.date-range { display: flex; align-items: center; gap: 5px; }
.date-range .input { width: 175px; }
.field-actions { display: flex; align-items: center; gap: 6px; }

.table-card { overflow: visible; }
.table-scroll { width: 100%; overflow-x: auto; border-radius: 10px; }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
th {
  height: 34px; padding: 8px 16px; background: var(--surface-3); border-bottom: 1px solid var(--line);
  color: var(--muted); font-size: 12px; font-weight: 500; text-align: left; white-space: nowrap;
}
td {
  height: 36px; padding: 4px 16px; border-bottom: 1px solid var(--line);
  color: var(--text); font-size: 12px; white-space: nowrap;
}
tbody tr:nth-child(odd) { background: var(--table-row); }
tbody tr:nth-child(even) { background: var(--table-row-alt); }
tbody tr:hover { background: var(--table-row-hover); }
tbody tr:last-child td { border-bottom: 0; }
.numeric { text-align: right; }
.center { text-align: center; }
.positive { color: var(--success) !important; }
.negative { color: var(--danger) !important; }
.muted { color: var(--muted) !important; }
.link { border: 0; background: none; padding: 0; color: var(--primary); font-weight: 550; }
.badge {
  display: inline-flex; align-items: center; justify-content: center; min-height: 20px;
  padding: 2px 7px; border-radius: 999px; background: var(--surface-3); color: var(--muted);
  font-size: 10px; font-weight: 600; white-space: nowrap;
}
.badge.success { background: var(--success-soft); color: var(--success); }
.badge.danger { background: var(--danger-soft); color: var(--danger); }
.badge.warning { background: var(--warning-soft); color: var(--warning); }
.badge.info { background: var(--info-soft); color: var(--info); }
.badge.primary { background: var(--primary-soft); color: var(--primary); }
.status-dot { width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: currentColor; }
.table-footer {
  min-height: 50px; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 14px; border-top: 1px solid var(--line);
}
.result-count { color: var(--muted); font-size: 11px; }
.pagination { display: flex; align-items: center; gap: 3px; }
.page-button {
  min-width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--surface); font-size: 11px;
}
.page-button:hover, .page-button.active { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); }
.row-actions { position: relative; display: inline-block; }
.action-menu { top: 30px; right: 0; min-width: 125px; }

.metric-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.metric-card { position: relative; min-height: 128px; padding: 17px; overflow: hidden; }
.metric-number {
  position: absolute; right: 10px; top: -12px; color: var(--surface-3);
  font-size: 72px; font-weight: 800; line-height: 1;
}
.metric-label { position: relative; color: var(--muted); font-size: 11px; }
.metric-value { position: relative; display: block; margin-top: 10px; font-size: 20px; font-weight: 700; letter-spacing: -.4px; }
.metric-meta { position: relative; margin-top: 9px; color: var(--muted); font-size: 10px; }
.dashboard-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 12px; }
.summary-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; }
.summary-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 0; border-bottom: 1px solid var(--line);
}
.summary-row:nth-last-child(-n+2) { border-bottom: 0; }
.summary-row:nth-child(odd) { padding-right: 18px; }
.summary-row:nth-child(even) { padding-left: 18px; border-left: 1px solid var(--line); }
.summary-row span { color: var(--muted); font-size: 11px; }
.summary-row strong { font-size: 13px; }
.activity-list { display: grid; }
.activity-item { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.activity-item:last-child { border: 0; }
.activity-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; background: var(--primary-soft); color: var(--primary); font-size: 10px; font-weight: 700; }
.activity-copy { min-width: 0; flex: 1; }
.activity-copy strong { display: block; font-size: 11px; font-weight: 550; }
.activity-copy span { color: var(--muted); font-size: 10px; }

.summary-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.summary-card { padding: 14px 16px; }
.summary-card span { color: var(--muted); font-size: 10px; }
.summary-card strong { display: block; margin-top: 5px; font-size: 17px; }
.delta { margin-left: 5px; font-size: 9px; font-weight: 600; }
.tabs, .segments {
  display: flex; align-items: center; gap: 3px; overflow-x: auto; scrollbar-width: none;
}
.tabs { padding: 0 16px; border-bottom: 1px solid var(--line); background: var(--surface); }
.tab {
  flex: 0 0 auto; min-height: 42px; border: 0; border-bottom: 2px solid transparent;
  background: transparent; padding: 10px 12px; color: var(--muted); font-size: 12px;
}
.tab.active { border-bottom-color: var(--primary); color: var(--primary); font-weight: 600; }
.segments { width: fit-content; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-3); }
.segment, .level-tab {
  min-height: 27px; border: 0; border-radius: 6px; background: transparent;
  padding: 5px 10px; color: var(--muted); font-size: 11px; white-space: nowrap;
}
.segment.active, .level-tab.active { background: var(--surface); color: var(--text); box-shadow: var(--shadow); font-weight: 600; }
.level-tabs-wrap { padding: 4px 16px 0; min-width: 0; container-type: inline-size; }
.level-tabs {
  display: grid;
  grid-template-columns: repeat(31, minmax(0, 1fr));
  gap: clamp(1px, 0.16cqw, 3px);
  width: 100%;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-3);
}
.level-tab {
  min-width: 0;
  padding: 5px 0;
  overflow: hidden;
  font-size: clamp(8px, 0.63cqw, 11px);
  text-align: center;
}
.settings-layout { display: grid; gap: 12px; min-width: 0; }
.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.settings-section { padding: 17px; }
.settings-section h3 { margin: 0 0 4px; font-size: 13px; font-weight: 600; }
.settings-section > p { margin: 0 0 16px; color: var(--muted); font-size: 11px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.form-field { display: grid; gap: 5px; }
.form-field.full { grid-column: 1 / -1; }
.form-field small { color: var(--muted); font-size: 10px; }
.input-suffix { position: relative; }
.input-suffix .input { padding-right: 36px; }
.input-suffix span { position: absolute; right: 10px; top: 50%; color: var(--muted); font-size: 11px; transform: translateY(-50%); }
.setting-row {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  min-height: 52px; padding: 10px 0; border-bottom: 1px solid var(--line);
}
.setting-row:last-child { border: 0; }
.setting-row strong { display: block; font-size: 12px; font-weight: 550; }
.setting-row p { margin: 2px 0 0; color: var(--muted); font-size: 10px; }
.switch {
  position: relative; width: 36px; height: 20px; min-width: 36px; min-height: 20px;
  flex: 0 0 36px; overflow: hidden; box-sizing: border-box; line-height: 0;
  border: 0; border-radius: 999px; background: #cbd5e1; padding: 0; transition: background .15s;
  font-size: 0 !important;
}
.switch::after {
  content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px;
  border-radius: 50%; background: white; box-shadow: 0 1px 2px rgb(0 0 0 / .2); transition: transform .15s;
  box-sizing: border-box;
}
.switch[aria-checked="true"] { background: var(--primary); }
.switch[aria-checked="true"]::after { transform: translateX(16px); }
.form-actions { display: flex; justify-content: flex-end; gap: 7px; padding-top: 16px; border-top: 1px solid var(--line); }

.fixture-tabs { margin-bottom: 12px; }
.fixture-list { display: grid; gap: 10px; }
.fixture-card { overflow: hidden; }
.fixture-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 9px 14px; background: var(--surface-3); border-bottom: 1px solid var(--line);
}
.league { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 600; }
.sport-dot { width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-size: 9px; }
.fixture-body { display: grid; grid-template-columns: 90px minmax(210px, .9fr) 1fr; align-items: center; gap: 16px; padding: 15px; }
.fixture-time { color: var(--muted); font-size: 11px; }
.fixture-time strong { display: block; color: var(--text); font-size: 12px; }
.teams { display: grid; gap: 7px; font-weight: 550; }
.odds { display: grid; grid-template-columns: repeat(3, minmax(90px, 1fr)); gap: 7px; }
.odd-pill {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  min-height: 38px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); padding: 7px 9px;
}
.odd-pill span { color: var(--muted); font-size: 10px; }
.odd-pill strong { color: var(--primary); font-size: 12px; }

.picker { display: grid; grid-template-columns: repeat(4, 1fr); min-height: 450px; overflow: hidden; }
.picker-column { min-width: 0; border-right: 1px solid var(--line); }
.picker-column:last-child { border: 0; }
.picker-title { padding: 12px 14px; border-bottom: 1px solid var(--line); background: var(--surface-3); font-size: 11px; font-weight: 600; }
.picker-search { padding: 9px; border-bottom: 1px solid var(--line); }
.picker-items { max-height: 380px; padding: 5px; overflow-y: auto; }
.picker-item {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  border: 0; border-radius: 6px; background: transparent; padding: 8px 9px; text-align: left; font-size: 11px;
}
.picker-item:hover, .picker-item.active { background: var(--primary-soft); color: var(--primary); }
.picker-item span:last-child { color: var(--muted); font-size: 9px; }
.picker-item .badge { margin-left: auto; }

.reconcile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.reconcile-card { padding: 18px; }
.reconcile-head { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.reconcile-head h3 { margin: 0; font-size: 13px; }
.reconcile-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.reconcile-values div { padding: 11px; border-radius: 7px; background: var(--surface-3); }
.reconcile-values span { display: block; color: var(--muted); font-size: 9px; }
.reconcile-values strong { display: block; margin-top: 4px; font-size: 13px; }

.profile-grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: 12px; }
.profile-summary { text-align: center; padding: 28px 20px; }
.profile-summary .avatar { width: 64px; height: 64px; margin: 0 auto 12px; font-size: 18px; background: var(--primary); }
.profile-summary h2 { margin: 0; font-size: 16px; }
.profile-summary p { margin: 4px 0 14px; color: var(--muted); font-size: 11px; }
.detail-list { margin-top: 18px; text-align: left; }
.detail-row { display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.detail-row:last-child { border: 0; }
.detail-row span { color: var(--muted); font-size: 11px; }
.detail-row strong { font-size: 11px; font-weight: 550; }

.login-page {
  position: relative;
  min-height: 100vh;
  background: #111827;
}
.login-visual {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding: 48px;
  color: white;
  background:
    radial-gradient(circle at 20% 20%, rgb(129 140 248 / .5), transparent 32%),
    radial-gradient(circle at 80% 85%, rgb(99 102 241 / .45), transparent 28%),
    #111827;
}
.login-visual::after {
  content: ""; position: absolute; inset: 0; opacity: .22;
  background-image: linear-gradient(rgb(255 255 255 / .1) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / .1) 1px, transparent 1px);
  background-size: 40px 40px;
}
.login-copyright { position: relative; z-index: 1; }
.login-copyright {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #dbe5f1;
  font-size: 11px;
  letter-spacing: .5px;
}
.login-copyright img { width: 20px; height: 20px; display: block; object-fit: contain; }
.login-form-wrap {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 48px 32px;
  overflow: visible;
}
.login-panel {
  width: 100%;
  max-width: 400px;
  padding: 40px 32px 22px;
  border-radius: 18px;
  background: var(--surface);
  box-shadow: 0 18px 48px rgb(0 0 0 / .38);
}
.login-form { width: 100%; }
.login-panel .login-copyright {
  justify-content: center;
  margin-top: 22px;
}
.login-form-logo {
  display: flex;
  justify-content: center;
  margin: 0 0 42px;
}
.login-form-logo img {
  width: min(210px, 78%);
  height: auto;
  display: block;
  object-fit: contain;
}
.login-form h2 { margin: 8px 0 7px; font-size: 22px; }
.login-form > p { margin: 0 0 25px; color: var(--muted); font-size: 12px; }
.login-form .form-field { margin-bottom: 14px; }
.login-form .input { height: 39px; }
.login-options { display: flex; justify-content: space-between; margin: 2px 0 20px; color: var(--muted); font-size: 11px; }
.check { display: flex; align-items: center; gap: 6px; }
.login-submit { width: 100%; height: 40px; margin-top: 8px; }
.login-otp {
  margin-top: 18px;
  padding: 14px 14px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}
.login-otp-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.login-otp-mark {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  border-radius: 8px;
  color: #fff;
  background: conic-gradient(from 180deg, #ea4335, #fbbc05, #34a853, #4285f4, #ea4335);
  font-size: 13px;
  font-weight: 800;
}
.login-otp-head strong { display: block; font-size: 12px; letter-spacing: -.02em; }
.login-otp-head p { margin: 2px 0 0; color: var(--muted); font-size: 11px; }
.login-otp-boxes {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 6px;
}
.login-otp-digit {
  width: 100%;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  text-align: center;
  font-size: 18px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.login-otp-digit:focus {
  outline: 2px solid var(--primary);
  outline-offset: 1px;
  border-color: var(--primary);
}
.login-form .admin-lang-switch {
  width: 100%;
  margin-top: 10px;
}
.login-form .admin-lang-trigger {
  width: 100%;
  max-width: none;
  height: 42px;
  justify-content: flex-start;
  gap: 10px;
  padding: 0 28px 0 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--text);
  background: var(--surface-2);
  font-size: 13px;
  font-weight: 750;
}
.login-form .admin-lang-trigger:hover,
.login-form .admin-lang-switch.is-open .admin-lang-trigger {
  color: var(--text);
  border-color: var(--primary);
  background: var(--surface);
}
.login-form .admin-lang-trigger::after {
  right: 14px;
  width: 6px;
  height: 6px;
}
.login-form .admin-lang-flag {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  box-shadow: 0 0 0 1px var(--line);
}
.login-form .admin-lang-name {
  display: block;
  max-width: none;
  flex: 1;
  text-align: left;
}
.login-form .admin-lang-menu {
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  bottom: auto;
  min-width: 0;
  width: 100%;
  max-width: none;
  padding: 6px;
  border-color: var(--line);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: 0 16px 36px rgb(0 0 0 / .2);
}
.login-form .admin-lang-menu:not([hidden]) {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.login-form .admin-lang-option {
  width: 100%;
  height: 36px;
  color: var(--text);
  font-size: 12px;
}
.login-form .admin-lang-option:hover,
.login-form .admin-lang-option.is-on {
  color: var(--primary);
  background: var(--primary-soft);
}
.demo-note { margin-top: 18px; padding: 10px 12px; border-radius: 7px; background: var(--primary-soft); color: var(--primary); font-size: 10px; }

.modal-layer { position: fixed; inset: 0; z-index: 80; display: none; place-items: center; padding: 18px; background: rgb(15 23 42 / .5); }
.modal-layer.open {
  display: grid;
  overflow: hidden;
  overscroll-behavior: none;
}
.modal {
  width: min(520px, 100%); max-height: calc(100vh - 36px); overflow-y: auto;
  background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 24px 48px rgb(0 0 0 / .2);
}
.modal.is-member-alert {
  width: min(400px, 100%);
}
.modal.is-member-alert .modal-body {
  padding: 22px 22px 10px;
}
.modal.is-member-alert .member-alert-msg {
  margin: 0;
  text-align: center;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.7;
  letter-spacing: -0.02em;
}
.modal.is-member-alert.is-delete-confirm #modalSave {
  color: #fff;
  border-color: #b42318;
  background: #d92d20;
}
.modal.is-member-alert.is-delete-confirm #modalSave:hover {
  background: #b42318;
}
.modal.is-member-alert.is-blocked .modal-foot .modal-close:not(#modalSave) {
  display: none;
}
.modal.is-ticket { width: min(392px, 100%); }
.modal.is-ip-history { width: min(680px, 100%); }
.modal.is-wd-sheet { width: min(720px, 100%); }
.modal.is-ip-history #modalSave { display: none; }
.modal.is-ip-history .modal-body { padding: 0; }
.modal.is-ip-history .modal-foot { background: var(--surface); }
.modal.is-acq-modal {
  width: min(520px, 100%);
}
.modal.is-acq-modal #modalSave { display: none; }
.modal.is-acq-modal .modal-head { padding: 16px 22px 13px; }
.modal.is-acq-modal .modal-head h2 {
  font-size: 15px;
  font-weight: 750;
  letter-spacing: -0.03em;
}
.modal.is-acq-modal .modal-body { padding: 14px 22px 8px; }
.modal.is-acq-modal .modal-foot {
  padding: 10px 22px 16px;
  background: var(--surface);
}
.acq-sheet { display: grid; gap: 16px; }
.acq-hero {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  align-items: start;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}
.acq-kicker {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.acq-hero strong,
.acq-hero time {
  display: block;
  margin-top: 2px;
  color: var(--text);
  font-size: 14px;
  font-weight: 750;
  letter-spacing: -0.03em;
}
.acq-hero time { font-variant-numeric: tabular-nums; font-weight: 650; }
.acq-hero small {
  display: block;
  margin-top: 1px;
  color: var(--muted);
  font-size: 12px;
}
.acq-state {
  align-self: start;
  margin-top: 16px;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border-radius: 999px;
  padding: 0 9px;
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
}
.acq-state.is-wait { color: var(--warning); background: var(--warning-soft); }
.acq-state.is-linked { color: var(--success); background: var(--success-soft); }
.acq-state.is-blocked { color: var(--danger); background: var(--danger-soft); }
.acq-flow {
  list-style: none;
  margin: 0;
  padding: 2px 2px 0 2px;
}
.acq-flow li {
  position: relative;
  padding: 0 0 14px 22px;
}
.acq-flow li:last-child { padding-bottom: 0; }
.acq-flow li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 6px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-soft);
}
.acq-flow li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 16px;
  bottom: 0;
  width: 1px;
  background: var(--line-strong);
}
.acq-flow li.is-end::before { background: var(--muted); box-shadow: 0 0 0 3px var(--surface-3); }
.acq-flow li.is-end.is-linked::before { background: var(--success); box-shadow: 0 0 0 3px var(--success-soft); }
.acq-step-label {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -0.02em;
}
.acq-step-value { display: block; margin-top: 2px; }
.acq-mono,
.acq-val.is-mono,
.acq-code,
.acq-val.is-code {
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.02em;
  word-break: break-all;
}
.acq-code,
.acq-val.is-code {
  font-weight: 750;
  letter-spacing: 0.02em;
}
.acq-bind {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--surface-2);
}
.acq-bind span { display: grid; gap: 2px; min-width: 0; }
.acq-bind small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.acq-bind b {
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  font-weight: 750;
  word-break: break-all;
}
.acq-bind i {
  flex: none;
  color: var(--muted);
  font-style: normal;
  font-weight: 700;
}
.acq-facts {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-top: 4px;
  border-top: 1px solid var(--line);
}
.acq-fact {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
}
.acq-fact dt {
  padding-top: 2px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 550;
  letter-spacing: -0.02em;
}
.acq-fact dd {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 0;
  min-width: 0;
}
.acq-val {
  min-width: 0;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  word-break: break-all;
}
.acq-val.is-empty { color: var(--muted); font-weight: 500; }
.acq-copy {
  width: 20px;
  height: 20px;
  flex: none;
  margin-top: 1px;
}
.acq-copy svg { width: 11px; height: 11px; }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 17px; border-bottom: 1px solid var(--line); }
.modal-head h2 { margin: 0; font-size: 15px; }
.modal-body { padding: 17px; }
.modal.is-ticket .modal-head { padding: 14px 16px 12px; }
.modal.is-ticket .modal-head h2 { font-size: 14px; font-weight: 700; letter-spacing: -0.02em; }
.modal.is-ticket .modal-body { padding: 16px; }
.modal-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 16px 16px;
  border-top: 1px solid var(--line);
}
.ticket-qty-button {
  min-width: 22px;
  height: 22px;
  border: 0;
  border-radius: 5px;
  padding: 0 5px;
  color: var(--info);
  background: var(--info-soft);
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.ticket-qty-button:hover { filter: brightness(0.96); }
.ticket-modal { display: grid; gap: 14px; }
.ticket-hero {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
}
.ticket-hero-user {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ticket-hero-user > div { display: grid; gap: 1px; min-width: 0; }
.ticket-hero-user > div span { color: var(--muted); font-size: 11px; }
.ticket-hero-delta {
  margin-left: auto;
  min-width: 88px;
  font-size: 20px;
  font-style: normal;
  font-weight: 750;
  text-align: right;
  color: #d05252;
  letter-spacing: -0.04em;
  font-variant-numeric: tabular-nums;
}
.ticket-hero[data-ticket-tone="take"] .ticket-hero-delta { color: #0284c7; }
.ticket-hero-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #d05252;
  background: #fff7f7;
}
.ticket-hero-icon svg { width: 17px; height: 17px; }
.ticket-hero[data-ticket-tone="take"] .ticket-hero-icon {
  color: #0284c7;
  background: #e0f2fe;
}
.ticket-hero-name { font-size: 13px; font-weight: 700; letter-spacing: -0.02em; }
.ticket-hero-stats {
  display: grid;
  grid-template-columns: 1fr 16px 1fr;
  align-items: center;
  gap: 8px;
}
.ticket-stat {
  display: grid;
  gap: 2px;
  min-height: 58px;
  padding: 8px 10px;
  border-radius: 9px;
  background: var(--surface);
}
.ticket-stat span { color: var(--muted); font-size: 10px; font-weight: 650; }
.ticket-stat strong,
.ticket-stat b {
  font-size: 20px;
  font-weight: 750;
  line-height: 1.1;
  letter-spacing: -0.04em;
  font-variant-numeric: tabular-nums;
}
.ticket-hero-arrow { color: var(--muted); text-align: center; font-size: 14px; }
.ticket-hero-stats em {
  min-width: 36px;
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
  text-align: right;
  color: #d05252;
  font-variant-numeric: tabular-nums;
}
.ticket-hero[data-ticket-tone="take"] .ticket-hero-stats em { color: #0284c7; }
.ticket-modes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  border-radius: 10px;
  background: var(--surface-3);
}
.ticket-mode {
  height: 34px;
  border: 0;
  border-radius: 8px;
  color: var(--muted);
  background: transparent;
  font-size: 13px;
  font-weight: 700;
}
.ticket-mode.active.is-give {
  color: #d05252;
  background: #fff7f7;
  box-shadow: var(--shadow);
}
.ticket-mode.active.is-take {
  color: #0284c7;
  background: #e0f2fe;
  box-shadow: var(--shadow);
}
.ticket-chips {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  width: 100%;
  gap: 4px;
}
.ticket-chips button {
  width: 100%;
  min-width: 0;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 4px;
  color: var(--muted);
  background: var(--surface-2);
  font-size: 11px;
  font-weight: 700;
}
.ticket-chips button:hover { color: var(--text); }
.ticket-chips button.active {
  color: #d05252;
  border-color: #f2d4d4;
  background: #fff7f7;
}
.ticket-modal:has([data-ticket-tone="take"]) .ticket-chips button.active {
  color: #0284c7;
  border-color: #bae6fd;
  background: #e0f2fe;
}
.ticket-field { display: grid; gap: 6px; }
.ticket-field > span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}
.ticket-field i { color: #9ca3af; font-size: 10px; font-style: normal; font-weight: 550; }
.ticket-stepper {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 40px;
  height: 40px;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface);
}
.ticket-stepper button {
  border: 0;
  color: var(--muted);
  background: var(--surface-2);
  font-size: 18px;
  line-height: 1;
}
.ticket-stepper button:hover { color: var(--text); background: var(--surface-3); }
.ticket-qty-input {
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  background: transparent;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  appearance: textfield;
}
.ticket-qty-input::-webkit-outer-spin-button,
.ticket-qty-input::-webkit-inner-spin-button { appearance: none; margin: 0; }
#modalSave.ticket-adjust-save {
  min-width: 88px;
  color: #d05252;
  border-color: #f2d4d4;
  background: #fff7f7;
}
#modalSave.ticket-adjust-save:hover { border-color: #e8b4b4; background: #fdecec; }
#modalSave.ticket-adjust-save.is-take {
  color: #0284c7;
  border-color: #bae6fd;
  background: #e0f2fe;
}
#modalSave.ticket-adjust-save.is-take:hover { border-color: #7dd3fc; background: #d6effc; }
[data-theme="dark"] .ticket-hero-icon { color: #fb7185; background: #3d1f27; }
[data-theme="dark"] .ticket-hero[data-ticket-tone="take"] .ticket-hero-icon { color: #7dd3fc; background: #16324c; }
[data-theme="dark"] .ticket-hero-delta,
[data-theme="dark"] .ticket-hero-stats em { color: #fb7185; }
[data-theme="dark"] .ticket-hero[data-ticket-tone="take"] .ticket-hero-delta,
[data-theme="dark"] .ticket-hero[data-ticket-tone="take"] .ticket-hero-stats em { color: #7dd3fc; }
[data-theme="dark"] .ticket-mode.active.is-give { color: #fb7185; background: #3d1f27; }
[data-theme="dark"] .ticket-mode.active.is-take { color: #7dd3fc; background: #16324c; }
[data-theme="dark"] .ticket-chips button.active {
  color: #fb7185;
  border-color: #63323e;
  background: #3d1f27;
}
[data-theme="dark"] .ticket-modal:has([data-ticket-tone="take"]) .ticket-chips button.active {
  color: #7dd3fc;
  border-color: #2a5a78;
  background: #16324c;
}
[data-theme="dark"] #modalSave.ticket-adjust-save {
  color: #fb7185;
  border-color: #63323e;
  background: #3d1f27;
}
[data-theme="dark"] #modalSave.ticket-adjust-save:hover {
  border-color: #7f3d4a;
  background: #4a2430;
}
[data-theme="dark"] #modalSave.ticket-adjust-save.is-take {
  color: #7dd3fc;
  border-color: #2a5a78;
  background: #16324c;
}
[data-theme="dark"] #modalSave.ticket-adjust-save.is-take:hover {
  border-color: #3b7aa0;
  background: #1c3f5c;
}
.toast-region {
  position: fixed;
  top: 46px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5000;
  width: min(480px, calc(100vw - 32px));
  pointer-events: none;
}
.toast-region > * { pointer-events: auto; min-width: 0; max-width: 100%; }
.app-alert {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 8px 12px;
  width: 100%;
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid transparent;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgb(15 23 42 / .14);
  animation: alert-in .22s ease;
}
.app-alert-icon {
  width: 22px;
  height: 22px;
  margin-top: 1px;
  display: grid;
  place-items: center;
}
.app-alert-icon svg { width: 22px; height: 22px; }
.app-alert-copy { min-width: 0; }
.app-alert-copy strong,
.app-alert-copy p {
  white-space: normal;
  overflow-wrap: anywhere;
}
.app-alert-copy strong {
  display: block;
  font-size: 13px;
  font-weight: 750;
  letter-spacing: -0.02em;
  line-height: 1.35;
}
.app-alert-copy p {
  margin: 3px 0 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  opacity: .82;
}
.app-alert-actions {
  grid-column: 2;
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  margin-top: 2px;
}
.app-alert-btn {
  height: 28px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: rgb(255 255 255 / .55);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.02em;
  cursor: pointer;
}
.app-alert-btn.is-primary { color: #fff; }
.app-alert.is-info { color: #1d4f7a; background: #e7f3fc; border-color: #c5e1f5; }
.app-alert.is-info .app-alert-icon { color: #3b82c4; }
.app-alert.is-info .app-alert-btn.is-primary { background: #3b82c4; }
.app-alert.is-success { color: #166534; background: #e7f6ee; border-color: #c5ead4; }
.app-alert.is-success .app-alert-icon { color: #22a06b; }
.app-alert.is-success .app-alert-btn.is-primary { background: #22a06b; }
.app-alert.is-warning { color: #92400e; background: #fbf3e0; border-color: #f0dfb4; }
.app-alert.is-warning .app-alert-icon { color: #d97706; }
.app-alert.is-warning .app-alert-btn.is-primary { background: #d97706; }
.app-alert.is-danger { color: #9f1239; background: #fde8e8; border-color: #f5c6c6; }
.app-alert.is-danger .app-alert-icon { color: #dc2626; }
.app-alert.is-danger .app-alert-btn.is-primary { background: #dc2626; }
[data-theme="dark"] .app-alert-btn { background: rgb(255 255 255 / .72); color: inherit; }
@keyframes alert-in { from { transform: translateY(-10px); opacity: 0; } }
.toast {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 10px 10px 10px 14px;
  border: 1px solid transparent;
  border-radius: 6px;
  box-shadow: 0 10px 28px rgb(15 23 42 / .12);
  animation: toast-in .22s ease;
}
.toast.is-out { animation: toast-out .16s ease forwards; }
.toast-ico {
  flex: none;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
}
.toast-ico svg { width: 18px; height: 18px; display: block; }
.toast-copy {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.02em;
}
.toast-copy b { font-weight: 750; margin-right: 4px; }
.toast-x {
  flex: none;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: inherit;
  opacity: .5;
  cursor: pointer;
}
.toast-x:hover { opacity: 1; background: rgb(0 0 0 / .06); }
.toast-x svg { width: 12px; height: 12px; display: block; margin: 0 auto; }
.toast.is-info { color: #1e4d7b; background: #e8f4fc; border-color: #b7daf3; }
.toast.is-info .toast-ico { color: #2f7fbe; }
.toast.is-warning { color: #8a5a10; background: #fbf6e6; border-color: #ead7a4; }
.toast.is-warning .toast-ico { color: #b8860b; }
.toast.is-error { color: #9f2c2c; background: #fdecec; border-color: #f3c2c2; }
.toast.is-error .toast-ico { color: #d64545; }
.toast.is-success { color: #1c6b3a; background: #e7f6ec; border-color: #b7e4c7; }
.toast.is-success .toast-ico { color: #1f8a4c; }
.toast.toast-ask {
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 10px 12px;
  padding: 12px 12px 12px 14px;
}
.toast-ask-copy { flex: 1 1 180px; min-width: 0; }
.toast-ask-copy b {
  display: block;
  margin: 0 0 2px;
  font-size: 13px;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.toast-ask-copy p {
  margin: 0;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.45;
}
.toast-ask-acts {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}
.toast-act {
  height: 28px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, currentColor 35%, transparent);
  border-radius: 5px;
  background: rgb(255 255 255 / .45);
  color: inherit;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: -0.02em;
  cursor: pointer;
}
.toast-act.is-primary { color: #fff; border-color: transparent; }
.toast.is-error .toast-act.is-primary { background: #d64545; }
.toast.is-warning .toast-act.is-primary { background: #b8860b; }
.toast.is-info .toast-act.is-primary { background: #2f7fbe; }
.toast.is-success .toast-act.is-primary { background: #1f8a4c; }
@keyframes toast-in { from { transform: translateY(-8px); opacity: 0; } }
@keyframes toast-out { to { transform: translateY(-6px); opacity: 0; } }

.empty { padding: 50px 20px; color: var(--muted); text-align: center; }
.empty strong { display: block; margin-bottom: 4px; color: var(--text); }

@media (max-width: 1280px) {
  .info-strip { grid-template-columns: repeat(6, minmax(92px, 1fr)); padding-block: 7px; }
  .info-item { padding-block: 4px; }
  .metric-grid { grid-template-columns: repeat(3, 1fr); }
  .metric-card:nth-child(n+4) { min-height: 112px; }
  .summary-cards { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 960px) {
  :root { --sidebar: 160px; }
  .sidebar { transform: none; box-shadow: none; }
  .drawer-backdrop, .mobile-menu { display: none; }
  .info-strip { grid-template-columns: repeat(4, minmax(100px, 1fr)); overflow-x: auto; }
  .dashboard-grid, .profile-grid { grid-template-columns: 1fr; }
  .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .settings-grid, .reconcile-grid { grid-template-columns: 1fr; }
  .fixture-body { grid-template-columns: 75px 1fr; }
  .odds { grid-column: 1 / -1; }
  .picker { grid-template-columns: repeat(2, 1fr); }
  .picker-column:nth-child(2) { border-right: 0; }
  .picker-column:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}

@media (max-width: 640px) {
  .topbar { padding: 0 12px; }
  .breadcrumb span, .profile-button > span:not(.avatar) { display: none; }
  .info-strip { min-height: 70px; grid-template-columns: repeat(12, 104px); padding: 8px 5px; }
  .info-item { padding: 4px 10px; }
  .content { padding: 16px 12px 28px; }
  .page-head { display: block; }
  .head-actions { justify-content: flex-start; margin-top: 12px; }
  .page-title p { font-size: 12px; }
  .metric-grid, .summary-cards { grid-template-columns: 1fr; }
  .metric-card { min-height: 105px; }
  .summary-list { grid-template-columns: 1fr; }
  .summary-row:nth-child(n) { padding-inline: 0; border-left: 0; }
  .filter-bar { align-items: stretch; }
  .field, .field.grow { flex: 1 1 100%; }
  .date-range .input { width: 100%; }
  .field-actions { width: 100%; }
  .field-actions .btn { flex: 1; }
  .table-footer { align-items: flex-start; flex-direction: column; }
  .settings-grid, .form-grid { grid-template-columns: 1fr; }
  .form-field.full { grid-column: auto; }
  .picker { grid-template-columns: 1fr; min-height: auto; }
  .picker-column { border-right: 0; border-bottom: 1px solid var(--line); }
  .picker-items { max-height: 220px; }
  .fixture-body { grid-template-columns: 1fr; }
  .odds { grid-column: auto; grid-template-columns: 1fr; }
  .reconcile-values { grid-template-columns: 1fr; }
  .login-form-wrap { min-height: 100vh; padding: 36px 28px; }
}

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

/* Screenshot-driven shared admin shell */
:root {
  --bg: #f7f8fa;
  --primary: #12304f;
  --primary-hover: #0b223b;
  --primary-soft: #edf3f8;
  --gold: #c79535;
}
body { font-size: 12px; background: var(--bg); }
.shell { width: 100%; min-width: 0; }
.main-app { width: auto; min-width: 0; }
.main-app { margin-left: 0; }
.content { padding: 12px 10px 16px; }

.sidebar {
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  transform: none;
  box-shadow: none;
}
.drawer-backdrop { display: none; }
.drawer-head {
  min-height: 56px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background: #071b30;
}
.drawer-head .logo-row { min-width: 0; flex: 1; height: 55px; justify-content: center; border-bottom: 0; padding-inline: 8px; }
.nav-scroll { padding: 6px 4px 14px; }
.nav-group-button, .nav-link {
  min-height: 31px;
  gap: 8px;
  padding: 5px 8px;
  font-size: 12px;
}
.nav-children { padding-left: 16px; }
.nav-children .nav-link { min-height: 28px; padding: 4px 7px 4px 14px; font-size: 12px; }

.top-stack {
  position: sticky;
  top: 0;
  z-index: 25;
  width: 100%;
  box-shadow: 0 2px 7px rgb(15 23 42 / .06);
}
.topbar {
  height: 35px;
  min-height: 35px;
  padding: 0 13px;
  color: #dbe7f2;
  background: #071b30;
  border-bottom: 1px solid #173149;
  overflow: visible;
}
.topbar-left { min-width: 0; flex: 1; gap: 5px; height: 100%; overflow: hidden; }
.topbar-actions { flex: 0 0 auto; gap: 2px; }
.sidebar { z-index: 30; }
.main-app .queue-counter,
.main-app .queue-counter span,
.main-app .queue-counter strong { font-size: 11px !important; }
.live-ops-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  margin-right: 8px;
  padding: 0 9px 0 8px;
  border: 1px solid rgb(255 92 90 / .34);
  border-radius: 999px;
  color: #ffe4e4;
  background:
    linear-gradient(180deg, rgb(255 255 255 / .06), transparent 58%),
    rgb(176 24 28 / .2);
  box-shadow: inset 0 1px rgb(255 255 255 / .1), 0 0 0 1px rgb(0 0 0 / .18);
  font-size: 10px !important;
  font-weight: 750;
  letter-spacing: -.01em;
  white-space: nowrap;
}
.live-ops-status b {
  color: #ffe8e8;
  font-size: 10px !important;
  font-weight: 750;
}
.live-ops-dot {
  position: relative;
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 28%, #ffc4c4, #ef4444 46%, #9f1239);
  box-shadow: 0 0 7px rgb(239 68 68 / .9);
}
.live-ops-dot::after {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgb(239 68 68 / .55);
  animation: live-ops-pulse 1.5s ease-out infinite;
}
@keyframes live-ops-pulse {
  0% { box-shadow: 0 0 0 0 rgb(239 68 68 / .5); opacity: 1; }
  70% { box-shadow: 0 0 0 6px rgb(239 68 68 / 0); opacity: 0; }
  100% { box-shadow: 0 0 0 0 rgb(239 68 68 / 0); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .live-ops-dot::after { animation: none; }
}
.vendor-balance {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  margin-right: 6px;
  padding: 0 8px;
  border: 1px solid #3a4a22;
  border-radius: 999px;
  color: #c5d0b4;
  font-size: 10px;
  font-weight: 600;
  white-space: nowrap;
}
.vendor-balance strong {
  color: #e8c15a;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
[data-live].is-hot,
[data-md-live].is-hot {
  animation: live-hot .55s ease;
}
@keyframes live-hot {
  0% { filter: brightness(1.45); }
  100% { filter: none; }
}
.operation-pills strong.is-hot {
  background: #6a7d88;
}
.topbar .icon-button {
  width: 28px;
  height: 28px;
  color: #dbe7f2;
  border-radius: 4px;
}
.topbar .icon-button:hover, .topbar .profile-button:hover, .global-menu-button:hover, .global-brand:hover {
  color: white;
  background: rgb(255 255 255 / .08);
}
.topbar .icon-button svg { width: 14px; height: 14px; }
.topbar .icon-button.topbar-tool {
  width: 27px;
  height: 27px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #dbe7f2;
}
.topbar .topbar-sound {
  width: 27px;
  height: 27px;
  margin-right: 2px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #56d8cc;
  border-radius: 4px;
  color: #fff;
  background: linear-gradient(145deg, #38cfc1, #16968d);
  box-shadow: 0 3px 9px rgb(0 0 0 / .22), inset 0 1px rgb(255 255 255 / .3);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.topbar .topbar-sound:hover {
  color: #fff;
  border-color: #79e5dc;
  background: linear-gradient(145deg, #4bdacc, #11857d);
  box-shadow: 0 4px 11px rgb(0 0 0 / .28), 0 0 0 2px rgb(72 211 199 / .12);
}
.topbar .topbar-sound.is-muted {
  border-color: #8a96a8;
  color: #e8edf4;
  background: linear-gradient(145deg, #66758a, #3d4754);
  box-shadow: 0 3px 9px rgb(0 0 0 / .22), inset 0 1px rgb(255 255 255 / .18);
}
.topbar .topbar-sound.is-muted:hover {
  color: #fff;
  border-color: #a3b0c2;
  background: linear-gradient(145deg, #758496, #323c48);
  box-shadow: 0 4px 11px rgb(0 0 0 / .28), 0 0 0 2px rgb(138 150 168 / .16);
}
.topbar .topbar-sound svg { width: 14px; height: 14px; }
.global-menu-button {
  width: 26px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 4px;
  color: #dbe7f2;
  background: transparent;
}
.global-menu-button svg { width: 15px; height: 15px; }
.global-brand {
  height: 31px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 0;
  border-radius: 4px;
  padding: 0 5px 0 2px;
  color: white;
  background: transparent;
}
.global-logo-mark {
  width: 19px;
  height: 21px;
  display: grid;
  place-items: center;
  color: #a9e4dc;
  font-size: 12px;
  font-weight: 800;
  transform: skew(-7deg);
  border: 1px solid #529b96;
  border-radius: 5px 2px;
}
.global-brand strong { font-size: 13px; letter-spacing: .3px; }
.global-divider { width: 1px; height: 18px; margin: 0 4px; background: #24405a; }
.queue-counters {
  min-width: 0;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.queue-counters::-webkit-scrollbar { display: none; }
.queue-cluster {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 100%;
  padding: 0 6px;
  border-left: 1px solid #24405a;
}
.queue-cluster:first-child { border-left: 0; padding-left: 0; }
.queue-counter {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 25px;
  margin: 0;
  padding: 0 3px 0 5px;
  border: 1px solid rgb(183 205 225 / .2);
  border-radius: 999px;
  color: #d4dfeb;
  background: rgb(255 255 255 / .055);
  font: inherit;
  font-size: 9px;
  white-space: nowrap;
  cursor: pointer;
}
.queue-counter:hover { background: rgb(255 255 255 / .08); }
.queue-counter.sub {
  color: #9fb3c6;
  background: rgb(255 255 255 / .03);
  border-color: rgb(183 205 225 / .12);
}
.queue-counter.is-alert {
  color: #fff;
  border-color: rgb(248 113 113 / .65);
  background: rgb(239 68 68 / .28);
  box-shadow: 0 0 0 1px rgb(239 68 68 / .18);
}
.queue-counter.is-alert:hover { background: rgb(239 68 68 / .36); }
.queue-counter.is-alert i { color: #fecaca; }
.queue-counter.is-alert strong {
  color: #fff;
  background: #ef4444;
}
.queue-counter.is-blue,
.queue-counter.is-blue.is-alert {
  color: #eaf3ff;
  border-color: rgb(59 130 246 / .88);
  background: rgb(37 99 235 / .28);
  box-shadow: 0 0 0 1px rgb(59 130 246 / .28);
}
.queue-counter.is-blue:hover,
.queue-counter.is-blue.is-alert:hover { background: rgb(37 99 235 / .38); }
.queue-counter.is-blue i,
.queue-counter.is-blue.is-alert i { color: #93c5fd; }
.queue-counter.is-blue strong,
.queue-counter.is-blue.is-alert strong {
  color: #fff;
  background: #2563eb;
}
.queue-counter i {
  width: 13px;
  height: 13px;
  display: inline-grid;
  place-items: center;
  color: #9fb7cb;
  font-style: normal;
}
.queue-counter i svg { width: 11px; height: 11px; stroke-width: 1.8; }
.queue-counter strong {
  min-width: 22px;
  height: 16px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  padding: 0 4px;
  color: #f5f8fb;
  background: rgb(255 255 255 / .13);
  font-size: 8px;
  font-weight: 650;
}
.queue-counter.sub strong { background: rgb(255 255 255 / .08); }
.topbar .profile-button {
  height: 30px;
  border: 1px solid rgb(183 205 225 / .18);
  border-radius: 999px;
  padding: 1px 3px;
  color: #e7eef5;
  background: rgb(255 255 255 / .055);
}
.topbar .profile-button .avatar {
  width: 23px;
  height: 23px;
  flex-basis: 23px;
  color: #31475d;
  background: white;
  font-size: 8px;
  box-shadow: 0 1px 3px rgb(0 0 0 / .16);
}
.topbar .profile-button > span { font-size: 9px; font-weight: 600; }
.admin-lang-switch {
  position: relative;
  z-index: 40;
  flex: 0 0 auto;
}
.admin-lang-trigger {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  max-width: 118px;
  padding: 0 18px 0 7px;
  border: 1px solid rgb(183 205 225 / .18);
  border-radius: 999px;
  color: #e7eef5;
  background: rgb(255 255 255 / .055);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1;
}
.admin-lang-trigger:hover,
.admin-lang-switch.is-open .admin-lang-trigger {
  color: #fff;
  border-color: rgb(136 226 220 / .35);
  background: rgb(255 255 255 / .1);
}
.admin-lang-trigger::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 7px;
  width: 5px;
  height: 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  opacity: .7;
  transform: translateY(-70%) rotate(45deg);
  transition: transform .16s ease;
}
.admin-lang-switch.is-open .admin-lang-trigger::after {
  transform: translateY(-20%) rotate(225deg);
}
.admin-lang-flag {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgb(255 255 255 / .18);
}
.admin-lang-name,
.admin-lang-option-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.admin-lang-name { max-width: 72px; }
.admin-lang-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 80;
  min-width: 148px;
  width: max-content;
  max-width: min(220px, 70vw);
  padding: 5px;
  border: 1px solid #294a65;
  border-radius: 10px;
  background: #10263c;
  box-shadow: 0 16px 32px rgb(0 0 0 / .38);
}
.admin-lang-menu[hidden] { display: none; }
.admin-lang-option {
  width: 100%;
  height: 32px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 9px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #d7e4ef;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.02em;
  text-align: left;
}
.admin-lang-option:hover,
.admin-lang-option.is-on {
  color: #88e2dc;
  background: rgb(70 192 183 / .14);
}
.queue-counter span {
  min-width: 0;
  max-width: 7.2em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html[data-admin-ui-lang]:not([data-admin-ui-lang="ko"]) .queue-counter span { max-width: 6.2em; }
html[data-admin-ui-lang]:not([data-admin-ui-lang="ko"]) .nav-label,
html[data-admin-ui-lang]:not([data-admin-ui-lang="ko"]) .page-title h1,
html[data-admin-ui-lang]:not([data-admin-ui-lang="ko"]) .ops-pill,
html[data-admin-ui-lang]:not([data-admin-ui-lang="ko"]) .ops-chip {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.profile-menu {
  top: 31px;
  color: var(--text);
  background: var(--surface);
}
.profile-menu .dropdown-item { color: var(--text); }
.profile-menu .dropdown-item.danger { color: var(--danger); }
.profile-wrap:hover .profile-menu { display: block; }

.operation-panel {
  position: relative;
  padding: 7px 14px 10px;
  color: #111827;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
}
[data-theme="dark"] .operation-panel { color: var(--text); background: var(--surface); }
.operation-panel-head {
  min-height: 33px;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
}
.operation-title { flex: 0 0 auto; font-size: 11px; font-weight: 700; }
.operation-tools { display: flex; align-items: center; flex: 0 0 auto; gap: 5px; }
.operation-shortcuts, .period-shortcuts {
  display: inline-flex;
  align-items: center;
  border: 1px solid #e5e7eb;
  border-radius: 3px;
  overflow: hidden;
  background: #fff;
}
.operation-shortcuts button, .period-shortcuts button {
  min-width: 33px;
  height: 23px;
  border: 0;
  border-right: 1px solid #e5e7eb;
  padding: 0 7px;
  color: #4b5563;
  background: white;
  font-size: 9px;
}
.operation-shortcuts button:last-child, .period-shortcuts button:last-child { border-right: 0; }
.operation-shortcuts button.active, .period-shortcuts button.active {
  color: #b7791f;
  background: #fff7e5;
  font-weight: 700;
}
.operation-date-range {
  display: flex;
  align-items: center;
  gap: 4px;
}
.operation-date-range label { display: block; }
.operation-date-range input {
  width: 148px;
  height: 24px;
  border: 1px solid #e5e7eb;
  border-radius: 3px;
  padding: 0 5px;
  color: #4b5563;
  background: white;
  font-size: 9px;
}
.date-separator { flex: 0 0 auto; color: #9ca3af; font-size: 9px; }
.operation-search, .users-search-button {
  height: 25px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 0;
  border-radius: 3px;
  padding: 0 10px;
  color: white;
  background: #0b2743;
  font-size: 9px;
  font-weight: 650;
}
.operation-search svg, .users-search-button svg { width: 11px; height: 11px; }
.operation-pills {
  min-width: 0;
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 1 1 auto;
  flex-wrap: nowrap;
  gap: 3px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}
.operation-pills::-webkit-scrollbar { display: none; }
.operation-pills > span {
  flex: 0 0 auto;
  height: 24px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 0 5px 0 6px;
  color: #6b7280;
  white-space: nowrap;
}
.operation-pills b { font-size: 8px; font-weight: 550; }
.operation-pills strong {
  min-width: 22px;
  height: 16px;
  display: grid;
  place-items: center;
  border-radius: 4px;
  padding: 0 6px;
  color: #edf2f5;
  background: #4a5c68;
  font-size: 9px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
[data-theme="dark"] .operation-pills strong {
  color: #e8eef2;
  background: #4e616c;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .06);
}
.operation-toggle {
  flex: 0 0 auto;
  height: 25px;
  border: 1px solid #e5e7eb;
  border-radius: 3px;
  padding: 0 9px;
  color: #4b5563;
  background: white;
  font-size: 9px;
}
.operation-expanded-content {
  display: grid;
  grid-template-columns: repeat(11, minmax(0, 1fr));
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  overflow: hidden;
}
.operation-group {
  min-width: 0;
  padding: 8px 8px 7px;
  border-right: 1px solid #e5e7eb;
}
.operation-group:last-child { border-right: 0; }
.operation-group h2 {
  margin: 0 0 6px;
  color: #4b5563;
  font-size: 8px;
  font-weight: 650;
}
.operation-group h2:has(.settle-help) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  height: 17px;
  min-height: 0;
}
.settle-help {
  position: relative;
  flex: none;
  width: 15px;
  height: 15px;
  margin: 0;
  padding: 0;
  border: 1px solid #b45309;
  border-radius: 50%;
  background: #f59e0b;
  color: #1c1403;
  font-size: 10px;
  font-weight: 800;
  line-height: 13px;
  text-align: center;
  cursor: help;
  box-shadow: 0 0 0 1px rgb(245 158 11 / .25);
}
.settle-help:hover,
.settle-help:focus-visible {
  background: #fbbf24;
  outline: none;
}
.settle-help.icon-tip::after {
  left: auto;
  right: 0;
  transform: none;
  width: max-content;
  max-width: min(540px, 72vw);
  white-space: normal;
  text-align: left;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  z-index: 80;
}
.settle-help.icon-tip::before {
  left: auto;
  right: 3px;
  transform: none;
  z-index: 80;
}
.operation-expanded-content:has(.settle-help:hover),
.operation-expanded-content:has(.settle-help:focus-visible) {
  overflow: visible;
  z-index: 30;
}
.operation-group:has(.settle-help:hover),
.operation-group:has(.settle-help:focus-visible) {
  position: relative;
  z-index: 31;
  overflow: visible;
}
.operation-metrics { display: grid; gap: 4px; }
.operation-metrics.split { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 8px; }
.operation-metric {
  min-width: 0;
  display: grid;
  grid-template-columns: 2px minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  min-height: 18px;
  color: #6b7280;
  font-size: 8px;
  white-space: nowrap;
}
.operation-metric-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.operation-metric strong { color: #374151; font-size: 8px; font-weight: 650; }
.operation-metric.is-shade {
  background: rgb(37 99 235 / .12);
  border-radius: 3px;
  padding: 1px 5px;
  margin-inline: -5px;
}
.metric-line { width: 2px; height: 9px; border-radius: 2px; background: #94a3b8; }
.metric-line.gold { background: #d59b28; }
.metric-line.green { background: #35b987; }
.metric-line.blue { background: #4b91d1; }
.metric-line.violet { background: #8b5fc2; }
.metric-line.red { background: #e66b6b; }
.operation-compact-content { display: none; }
.operation-collapsed .operation-panel { padding: 0; }
.operation-collapsed .operation-panel-head {
  position: absolute;
  z-index: 2;
  top: 5px;
  right: 10px;
  min-height: 25px;
}
.operation-collapsed .operation-title,
.operation-collapsed .operation-tools,
.operation-collapsed .operation-pills,
.operation-collapsed .operation-expanded-content { display: none; }
.operation-collapsed .operation-compact-content { display: block; }
.compact-summary-row {
  display: grid;
  padding-right: 54px;
  border-bottom: 1px solid #e5e7eb;
}
.compact-summary-row:last-child { border-bottom: 0; }
.compact-counter-row { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.compact-money-row { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.compact-pnl-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.compact-summary-row > div {
  min-width: 0;
  min-height: 34px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 4px 13px;
  border-right: 1px solid #e5e7eb;
}
.compact-summary-row > div:last-child { border-right: 0; }
.compact-summary-row > div.is-shade { background: rgb(37 99 235 / .12); }
.compact-summary-row span { overflow: hidden; color: #6b7280; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.compact-summary-row strong { margin-left: auto; color: #111827; font-size: 10px; }

.location-bar {
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 13px;
  color: #4b5563;
  background: #f1f2f4;
  border-bottom: 1px solid #e5e7eb;
}
.location-bar > strong { color: #374151; font-weight: 650; }
.location-path {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  color: #7b8491;
  white-space: nowrap;
}
.location-path a:hover { color: #12304f; }
.location-path b { color: #4d6d93; font-weight: 650; }

/* Dense member-list page */
.users-page { min-width: 0; }
.users-create {
  min-height: 26px;
  border-color: #bd8933;
  border-radius: 3px;
  padding: 5px 10px;
  color: white;
  background: #c79535;
  font-size: 9px;
}
.users-create:hover { background: #ad7a26; }
.users-filter-bar {
  display: flex;
  align-items: end;
  gap: 7px;
  padding: 9px;
  border: 1px solid var(--line);
  background: var(--surface);
}
.users-filter-bar > label { display: grid; gap: 3px; flex: 0 0 92px; }
.users-filter-bar > label > span, .users-period legend { color: var(--muted); font-size: 8px; }
.users-filter-bar .input, .users-filter-bar .select { height: 26px; border-radius: 3px; font-size: 9px; }
.users-period { min-width: 178px; margin: 0; padding: 0; border: 0; }
.users-period legend { margin-bottom: 3px; }
.users-filter-bar .users-date-range {
  flex: 0 0 348px;
  display: flex;
  align-items: end;
  gap: 4px;
}
.users-date-range label {
  min-width: 0;
  flex: 1;
  display: grid;
  gap: 3px;
}
.users-date-range label > span { color: var(--muted); font-size: 8px; }
.users-date-range .input { width: 100%; padding-inline: 5px; }
.users-date-range > .date-separator { height: 26px; display: grid; place-items: center; }
.users-filter-bar .users-keyword { flex: 1 1 220px; max-width: 360px; margin-left: auto; }
.users-search-button { flex: 0 0 auto; min-height: 26px; border-radius: 3px; padding: 0 13px; }
.users-status-bar {
  display: flex;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--surface);
}
.users-status-bar > span {
  flex: 1;
  min-width: 0;
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 6px 8px;
  border-right: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.users-status-bar > span:last-child { border-right: 0; }
.users-status-bar strong {
  color: var(--warning);
  font-size: 16px !important;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.users-status-bar > span.is-block { color: #c47a5a; }
.users-status-bar > span.is-block strong { color: #e06a32; }
.bulk-actions {
  min-height: 37px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--surface);
  white-space: nowrap;
}
.bulk-actions > span { margin-right: 3px; color: var(--muted); font-size: 11px; }
.bulk-page-size {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
}
.bulk-page-size .select { width: 78px; height: 28px; border-radius: 4px; }
.bulk-actions .btn {
  min-height: 28px;
  border-radius: 4px;
  padding: 5px 10px;
  color: #526477;
  background: var(--surface);
  border-color: var(--line-strong);
  font-size: 11px;
  font-weight: 600;
}
.bulk-actions .btn:hover {
  color: #12304f;
  border-color: #b8c7d5;
  background: #edf3f8;
}
.bulk-actions .btn.bulk-blue {
  color: #3d6a8c;
  border-color: #c5d5e3;
  background: #eef4f9;
}
.bulk-actions .btn.bulk-blue:hover {
  color: #1d4d73;
  border-color: #8eafc8;
  background: #dceaf4;
}
.bulk-actions .btn.bulk-green {
  color: #3d7a5a;
  border-color: #c5ddd0;
  background: #eef7f1;
}
.bulk-actions .btn.bulk-green:hover {
  color: #236344;
  border-color: #8fbfa4;
  background: #d7eee1;
}
.bulk-actions .btn.bulk-blue.is-active {
  color: #fff;
  border-color: #4b789f;
  background: #4b789f;
}
.bulk-actions .btn.bulk-green.is-active {
  color: #fff;
  border-color: #3f8a62;
  background: #4a9a6c;
}
.bulk-right-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
}
.users-csv,
.btn.csv-excel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 32px;
  padding: 0 12px;
  border: 0;
  border-radius: 5px;
  background: #4a76a8;
  color: #fff;
  font-weight: 600;
  box-shadow: none;
  white-space: nowrap;
}
.users-csv:hover,
.btn.csv-excel:hover { color: #fff; background: #3d6796; }
.users-csv svg,
.btn.csv-excel svg { width: 14px; height: 14px; stroke-width: 2; }
.bulk-red {
  color: #8b4a4a;
  border-color: #d7c4c4;
  background: #f7eeee;
}
.bulk-red:hover {
  color: #6b0000;
  border-color: #c45c5c;
  background: #f8d0d0;
}
.users-table-card { border-top: 0; border-radius: 0 0 5px 5px; box-shadow: none; overflow: visible; }
.users-table-scroll { overflow: visible !important; border-radius: 0; }
.users-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; }
.users-table .col-check { width: 2%; }
.users-table .col-parent { width: 7.4%; }
.users-table .col-account { width: 5.6%; }
.users-table .col-grade { width: 5.2%; }
.users-table .col-level { width: 2.8%; }
.users-table .col-settings { width: 7.2%; }
.users-table .col-memo { width: 4.6%; }
.users-table .col-money { width: 6.7%; }
.users-table .col-point { width: 6.7%; }
.users-table .col-io { width: 5.5%; }
.users-table .col-iopnl { width: 4.5%; }
.users-table .col-bet { width: 5.2%; }
.users-table .col-betpnl { width: 4.5%; }
.users-table .col-fee { width: 4.8%; }
.users-table .col-coupon,
.users-table .col-rolling,
.users-table .col-ref { width: 2.1%; }
.users-table .ticket-qty-cell { padding-inline: 2px; }
.users-table .col-recent { width: 5.8%; }
.users-table .col-ip { width: 7.8%; }
.users-table .col-status { width: 3.6%; }
.users-table .col-manage { width: 3.8%; }
.plist-table .col-parent { width: 10%; }
.plist-table .col-account { width: 7%; }
.plist-table .col-code { width: 6.2%; }
.plist-table .col-grade { width: 5.4%; }
.plist-table .col-level { width: 3.2%; }
.plist-table .col-io { width: 6.4%; }
.plist-table .col-iopnl { width: 5.2%; }
.plist-table .col-bet { width: 6%; }
.plist-table .col-betpnl { width: 5%; }
.plist-table .col-lose { width: 4%; }
.plist-table .col-losepay { width: 7.4%; }
.plist-table .col-fee { width: 4.6%; }
.plist-table .col-rollpay { width: 7.4%; }
.plist-table .col-manage { width: 7.2%; }
.content:has(.plist-page) .page-head { align-items: center; }
.plist-head-search { flex-wrap: nowrap; }
.plist-head-search > label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.plist-head-search .select {
  width: 88px;
  height: 32px;
  border-radius: 4px;
  font-size: 12px;
}
.plist-head-search .plist-keyword {
  flex: 0 1 240px;
  max-width: 240px;
  margin-left: 0;
}
.plist-head-search .plist-keyword .input {
  width: 220px;
  height: 32px;
  font-size: 12px;
}
.plist-head-search .users-search-button {
  min-height: 32px;
  height: 32px;
  padding: 0 14px;
}
.plist-page .plist-grade-bar {
  border-top: 1px solid var(--line);
}
.plist-grade-bar > button {
  flex: 1 1 0;
}
.plist-toolbar { min-height: 36px; }
.plist-expand,
.plist-collapse {
  min-height: 26px;
  padding: 4px 12px;
  font-size: 11px;
  font-weight: 700;
}
.plist-help {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 26px;
  padding: 3px 10px 3px 4px;
  border: 1px solid #f59e0b;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(245, 158, 11, .28), rgba(245, 158, 11, .1));
  color: #fde68a;
  font-size: 11px;
  font-weight: 800;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, .2), 0 0 14px rgba(245, 158, 11, .22);
}
.plist-help i {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #f59e0b;
  color: #1c1406;
  font-style: normal;
  font-weight: 900;
}
.plist-help-pop {
  position: absolute;
  top: calc(100% + 8px);
  left: auto;
  right: 0;
  z-index: 40;
  display: none;
  width: max-content;
  max-width: min(280px, calc(100vw - 24px));
  padding: 8px 10px;
  border: 1px solid #f59e0b;
  border-radius: 10px;
  background: #1a1408;
  color: #fff7e6;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
  text-align: left;
  white-space: normal;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .4);
  pointer-events: none;
}
.plist-help-pop::before {
  content: "";
  position: absolute;
  right: 18px;
  bottom: 100%;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-bottom-color: #f59e0b;
}
.plist-toolbar,
.plist-toolbar .bulk-right-actions {
  overflow: visible;
}
.plist-help:hover .plist-help-pop,
.plist-help:focus-visible .plist-help-pop { display: block; }
.plist-lose small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}
.plist-row.is-fold { cursor: pointer; }
.plist-table td {
  height: auto;
  min-height: 52px;
  vertical-align: middle;
}
.plist-parent {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 36px;
}
.plist-fold {
  flex: none;
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  background: var(--surface);
  cursor: pointer;
  line-height: 0;
}
.plist-fold::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin: 0;
  border-left: 4px solid var(--muted);
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
}
.plist-fold.is-on::before {
  margin: 0;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 4px solid var(--text);
  border-bottom: 0;
}
.plist-fold.is-leaf {
  border-color: transparent;
  background: transparent;
  cursor: default;
}
.plist-fold.is-leaf::before { display: none; }
.plist-row.is-depth-1 td { background: rgb(22 140 255 / .04); }
.plist-row.is-depth-2 td { background: rgb(251 191 36 / .05); }
.plist-row.is-depth-3 td { background: rgb(52 211 153 / .04); }
.plist-row.is-depth-4 td { background: rgb(167 139 250 / .05); }
.plist-row.is-depth-5 td { background: rgb(148 163 184 / .05); }
.plist-row.is-open td { background: var(--primary-soft); }
.plist-lose {
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.plist-lose b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 22px;
  border-radius: 4px;
  padding: 0 7px;
  color: #fbbf24;
  background: rgb(251 191 36 / .12);
  font-size: 12px;
  font-weight: 800;
}
.plist-pay {
  min-width: 118px;
  white-space: normal !important;
  overflow: visible;
}
.plist-pay-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 20px;
  margin-top: 3px;
  padding: 2px 7px;
  border-radius: 4px;
  background: rgb(148 163 184 / .10);
}
.plist-pay-line:first-child { margin-top: 0; }
.plist-pay-line em {
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 750;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.plist-pay-line b {
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.plist-pay.is-lose .plist-pay-line.is-own b { color: #fbbf24; }
.plist-pay.is-lose .plist-pay-line.is-down b { color: #fde68a; }
.plist-pay.is-roll .plist-pay-line.is-own b { color: #7dd3fc; }
.plist-pay.is-roll .plist-pay-line.is-down b { color: #86efac; }
.plist-dash {
  color: var(--muted);
  font-weight: 700;
}
.plist-manage {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 28px;
  vertical-align: middle;
}
.plist-empty td {
  height: 160px;
  color: var(--muted);
  text-align: center;
}
.plist-table td.account-cell { text-align: center; }
.plist-table td.writer-cell { text-align: center; }
.plist-table th.parent-head { text-align: center; }
.plist-table .writer-inner { justify-content: center; }
.plist-table .writer-copy { text-align: center; }
.plist-table td.plist-grade { text-align: center; }
.plist-table td.plist-code {
  text-align: center;
  color: var(--muted);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.plist-table .manage-cell .mini-action {
  vertical-align: middle;
}
.plist-lose-edit {
  min-height: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0 8px;
  border: 1px solid rgb(251 191 36 / .38);
  border-radius: 4px;
  background: rgb(251 191 36 / .14);
  color: #fbbf24;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -0.03em;
  white-space: nowrap;
  line-height: 1;
  vertical-align: middle;
}
.plist-lose-edit:hover {
  border-color: #fbbf24;
  background: rgb(251 191 36 / .22);
  color: #fde68a;
}
.modal.is-plist-lose { width: min(560px, calc(100vw - 48px)); }
.modal.is-plist-lose .modal-head { padding: 16px 18px 12px; }
.modal.is-plist-lose .modal-head h2 {
  font-size: 16px;
  font-weight: 750;
  letter-spacing: -0.03em;
}
.modal.is-plist-lose .modal-body { padding: 4px 18px 16px; }
.plist-lose-form {
  display: grid;
  gap: 12px;
}
.plist-lose-hero {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 12px 12px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}
.plist-lose-hero strong {
  display: block;
  font-size: 14px;
  font-weight: 750;
  letter-spacing: -0.03em;
}
.plist-lose-hero small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}
.plist-lose-lead {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.plist-lose-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.plist-lose-meta span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 8px 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  background: var(--surface);
  font-size: 10px;
  font-weight: 650;
}
.plist-lose-meta b {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.plist-lose-field {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.plist-lose-kinds {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.plist-lose-kind-label {
  flex: 0 0 100%;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.plist-lose-kind {
  height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.plist-lose-kind.is-on {
  border-color: #fbbf24;
  background: rgb(251 191 36 / .18);
  color: #fde68a;
  box-shadow: 0 0 0 1px rgb(251 191 36 / .35);
}
.plist-lose-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.plist-lose-step {
  height: 46px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--text);
  font-size: 18px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
  cursor: pointer;
}
.plist-lose-step:hover:not(:disabled) {
  border-color: rgb(251 191 36 / .55);
  background: rgb(251 191 36 / .10);
}
.plist-lose-step.is-on {
  border-color: #fbbf24;
  background: rgb(251 191 36 / .18);
  color: #fbbf24;
  box-shadow: 0 0 0 1px rgb(251 191 36 / .35);
}
.plist-lose-step:disabled {
  opacity: 0.32;
  cursor: not-allowed;
}
.plist-lose-field .input {
  height: 42px;
  text-align: center;
  font-size: 20px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}
[data-theme="light"] .plist-lose-edit {
  border-color: #f3d39a;
  background: #fff7e6;
  color: #b45309;
}
[data-theme="light"] .plist-lose-edit:hover {
  border-color: #d4a017;
  background: #fef3c7;
  color: #92400e;
}
.plist-table td.fee-cell {
  position: relative;
  overflow: visible;
  text-align: center;
}
.users-table td.fee-cell {
  position: relative;
  overflow: visible;
  text-align: center;
}
.users-table tbody tr:hover .fee-cell { z-index: 90; }
.plist-fee-detail {
  position: relative;
  display: inline-flex;
  justify-content: center;
}
.plist-fee-btn {
  min-height: 22px;
  height: 22px;
  padding: 0 10px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
}
.plist-fee-pop {
  position: fixed;
  z-index: 240;
  display: none;
  width: max-content;
  max-width: min(560px, calc(100vw - 24px));
  padding: 12px 14px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: 0 16px 36px rgb(15 23 42 / .28);
  pointer-events: none;
}
.plist-fee-detail.is-open .plist-fee-pop { display: none; }
.plist-fee-pop.is-float { display: block; z-index: 4000; }
.plist-fee-pop[hidden] { display: none !important; }
.plist-fee-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(84px, 1fr));
  gap: 8px 12px;
}
.plist-fee-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.plist-fee-item em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.plist-fee-item b {
  width: 100%;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--surface-2);
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
[data-theme="dark"] .plist-fee-pop {
  border-color: #2d3a4b;
  background: #1c2430;
  box-shadow: 0 16px 36px rgb(0 0 0 / .42);
}
[data-theme="dark"] .plist-fee-item b {
  border-color: #334155;
  background: #151c27;
}
.plist-table td.account-cell strong,
.plist-table td.account-cell small { display: block; }
[data-theme="dark"] .plist-row.is-depth-1 td { background: rgb(22 140 255 / .05); }
[data-theme="dark"] .plist-row.is-depth-2 td { background: rgb(251 191 36 / .06); }
[data-theme="dark"] .plist-row.is-depth-3 td { background: rgb(52 211 153 / .06); }
[data-theme="dark"] .plist-row.is-depth-4 td { background: rgb(167 139 250 / .07); }
[data-theme="dark"] .plist-row.is-depth-5 td { background: rgb(148 163 184 / .06); }
[data-theme="dark"] .plist-row.is-open td { background: rgb(22 140 255 / .10); }
[data-theme="dark"] .plist-lose b {
  color: #fbbf24;
  background: rgb(251 191 36 / .16);
}
[data-theme="light"] .plist-lose b {
  color: #b45309;
  background: #fef3c7;
}
[data-theme="light"] .plist-pay-line { background: #f1f5f9; }
[data-theme="light"] .plist-pay.is-lose .plist-pay-line.is-own b { color: #b45309; }
[data-theme="light"] .plist-pay.is-lose .plist-pay-line.is-down b { color: #92400e; }
[data-theme="light"] .plist-pay.is-roll .plist-pay-line.is-own b { color: #0369a1; }
[data-theme="light"] .plist-pay.is-roll .plist-pay-line.is-down b { color: #047857; }
[data-theme="light"] .plist-roll { color: #047857 !important; }
.deleted-members-table .col-reason { width: 6.2%; }
.deleted-members-table .col-operator { width: 5.2%; }
.deleted-members-table .col-date { width: 7.2%; }
.users-table.deleted-members-table .col-status { width: 4.2%; }
.users-table.deleted-members-table .col-manage { width: 10.5%; }
.deleted-restore {
  min-height: 26px;
  height: 26px;
  padding: 0 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.deleted-reason-cell { overflow: visible; position: relative; z-index: 2; }
.users-table tbody tr:hover .deleted-reason-cell { z-index: 90; }
.deleted-reason-btn {
  position: relative;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 0 8px;
  color: #52606d;
  background: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
  white-space: nowrap;
}
.deleted-reason-btn:hover {
  color: #12304f;
  border-color: #b8c7d5;
  background: #edf3f8;
}
.deleted-reason-btn.icon-tip::after {
  left: auto;
  right: 0;
  transform: none;
  width: max-content;
  max-width: 280px;
  padding: 8px 10px;
  white-space: pre-wrap;
  text-align: left;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: -0.03em;
}
.deleted-reason-btn.icon-tip::before {
  left: auto;
  right: 18px;
  transform: none;
}
[data-theme="dark"] .deleted-reason-btn {
  color: #c9d5e2;
  border-color: var(--line);
  background: var(--surface-2);
}
[data-theme="dark"] .deleted-reason-btn:hover {
  color: #fff;
  border-color: #46617b;
  background: #243044;
}
.users-table th {
  height: auto;
  min-height: 38px;
  overflow: hidden;
  padding: 8px 5px;
  color: var(--muted);
  background: var(--surface-3);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  line-height: 1.3;
  white-space: normal;
  word-break: keep-all;
}
.users-table td {
  height: 52px;
  overflow: hidden;
  padding: 6px 5px;
  color: var(--text);
  font-size: 11px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}
.users-table .check-column { padding-inline: 4px; }
.users-table input[type="checkbox"] { width: 13px; height: 13px; accent-color: #c79535; }
.users-table td.writer-cell { overflow: visible; }
.users-table td.ip-cell,
.plist-table td.ip-cell,
.access-log-table td.ip-cell,
.online-users-table td.ip-cell,
.pending-ip,
.all-ip-ip,
.md-field-ip {
  overflow: visible;
}
.users-table td.ip-cell {
  text-align: center;
}
.users-table td.ip-cell .ip-history-button {
  margin-inline: auto;
}
.writer-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  max-width: 100%;
}
.writer-copy { min-width: 0; }
.writer-cell strong, .account-cell button, .recent-cell strong { display: block; font-size: 11px; font-weight: 700; }
.writer-cell small, .account-cell small, .recent-cell small { display: block; color: var(--muted); font-size: 10px; line-height: 1.35; }
.parent-tree-help {
  position: relative;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  color: #d08a1a;
  cursor: help;
}
.parent-tree-help svg { width: 12px; height: 12px; display: block; stroke-width: 2.2; }
.parent-tree-help.icon-tip::after {
  left: 0;
  transform: none;
  z-index: 130;
  max-width: none;
  padding: 6px 9px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -0.03em;
  white-space: nowrap;
  text-align: left;
  line-height: 1.2;
}
.parent-tree-help.icon-tip::before {
  left: 6px;
  transform: none;
  z-index: 130;
}
.parent-tree-help:focus.icon-tip::after,
.parent-tree-help:focus.icon-tip::before,
.parent-tree-help:focus-visible.icon-tip::after,
.parent-tree-help:focus-visible.icon-tip::before { opacity: 1; }
.users-table thead { position: relative; z-index: 1; }
.users-table th.parent-head { overflow: visible; }
.io-head { white-space: nowrap; }
.head-count {
  display: inline;
  margin-left: 1px;
  color: #8b95a5;
  font-size: 9px;
  font-weight: 650;
  letter-spacing: -0.04em;
}
.users-table th.is-sortable,
th.is-sortable { overflow: visible; }
.users-sort {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin: 0;
  border: 0;
  padding: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.users-sort:hover { color: var(--text); }
.users-sort.is-active { color: var(--text); }
.users-sort-mark {
  display: inline-grid;
  flex: none;
  grid-template-rows: 5px 5px;
  align-items: center;
  justify-items: center;
  gap: 2px;
  width: 10px;
  height: 13px;
}
.users-sort-mark i {
  display: block;
  width: 0;
  height: 0;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.users-sort-mark .is-up {
  border-bottom: 5px solid #8ea0b8;
  opacity: .7;
}
.users-sort-mark .is-down {
  border-top: 5px solid #8ea0b8;
  opacity: .7;
}
.users-sort:hover .users-sort-mark .is-up {
  opacity: .95;
  border-bottom-color: #d7e6fb;
}
.users-sort:hover .users-sort-mark .is-down {
  opacity: .95;
  border-top-color: #d7e6fb;
}
.users-sort[aria-sort="ascending"] .users-sort-mark .is-up,
.users-sort[aria-sort="descending"] .users-sort-mark .is-down {
  opacity: 1;
  filter: drop-shadow(0 0 4px rgba(103, 232, 249, .85));
}
.users-sort[aria-sort="ascending"] .users-sort-mark .is-up {
  border-bottom-color: #67e8f9;
}
.users-sort[aria-sort="descending"] .users-sort-mark .is-down {
  border-top-color: #67e8f9;
}
.users-sort[aria-sort="ascending"] .users-sort-mark .is-down,
.users-sort[aria-sort="descending"] .users-sort-mark .is-up {
  opacity: .22;
}
[data-theme="light"] .users-sort-mark .is-up { border-bottom-color: #64748b; }
[data-theme="light"] .users-sort-mark .is-down { border-top-color: #64748b; }
[data-theme="light"] .users-sort:hover .users-sort-mark .is-up { border-bottom-color: #334155; }
[data-theme="light"] .users-sort:hover .users-sort-mark .is-down { border-top-color: #334155; }
[data-theme="light"] .users-sort[aria-sort="ascending"] .users-sort-mark .is-up { border-bottom-color: #0284c7; }
[data-theme="light"] .users-sort[aria-sort="descending"] .users-sort-mark .is-down { border-top-color: #0284c7; }
.head-help {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 12px;
  height: 12px;
  margin-left: 3px;
  color: #d08a1a;
  vertical-align: -1px;
  cursor: help;
}
.head-help svg { width: 11px; height: 11px; display: block; stroke-width: 2.2; }
.head-help-tip {
  position: absolute;
  left: 50%;
  top: calc(100% + 5px);
  z-index: 8;
  display: none;
  min-width: max-content;
  transform: translateX(-50%);
  padding: 5px 8px;
  border-radius: 4px;
  color: #fff;
  background: #1f2937;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: 0 6px 16px rgb(15 23 42 / .28);
  pointer-events: none;
}
.head-help-tip::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 0;
  height: 0;
  border: 4px solid transparent;
  border-bottom-color: #1f2937;
  transform: translateX(-50%);
}
.head-help:hover .head-help-tip,
.head-help:focus .head-help-tip,
.head-help:focus-visible .head-help-tip { display: block; }
.account-cell button { margin: 0 auto; color: #2865a0; }
.users-table td.account-cell,
.users-table td.manage-cell,
.users-table td.money-cell,
.users-table td.memo-cell,
.users-table td.deleted-reason-cell {
  overflow: visible;
}
.users-table .badge { min-height: 20px; padding: 2px 7px; border-radius: 4px; font-size: 10px; }
.users-table .user-status-button {
  border: 0;
  cursor: pointer;
  font-weight: 700;
}
.users-table .user-status-button:hover { filter: brightness(0.96); }
.users-table .badge.hq { color: #10233a; background: #9eb6ce; }
.users-table .badge.office { color: #12324d; background: #c5def3; }
.users-table .badge.master { color: #3a2200; background: #f3d39a; }
.users-table .badge.agent { color: #0f3b3c; background: #9fe1dc; }
.users-table .badge.shop { color: #12351f; background: #bfe8c9; }
.users-table .badge.member { color: #3a1730; background: #edc6df; }
.member-settings {
  overflow: hidden;
  white-space: nowrap;
}
.member-setting-button {
  min-width: 26px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 1px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  padding: 0 5px;
  color: #52606d;
  background: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
}
.member-setting-button:hover {
  color: #12304f;
  border-color: #b8c7d5;
  background: #edf3f8;
}
.member-setting-button.is-both.is-on,
.member-setting-button.is-both.is-on:hover {
  color: #8a5a00;
  border-color: #e0c36a;
  background: #f8e7b0;
}
.member-setting-button.is-caution.is-on,
.member-setting-button.is-caution.is-on:hover {
  color: #9f1239;
  border-color: #fda4af;
  background: #ffe4e6;
}
.member-setting-button.is-voidbet.is-on,
.member-setting-button.is-voidbet.is-on:hover {
  color: #0f766e;
  border-color: #5eead4;
  background: #ccfbf1;
}
.memo-cell { overflow: visible; }
.memo-button {
  position: relative;
  max-width: 100%;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 0 8px;
  color: #52606d;
  background: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
.memo-button.has-memo { color: #8a6a2a; border-color: #e0d3a8; background: #f7f1de; }
.memo-button:hover {
  color: #12304f;
  border-color: #b8c7d5;
  background: #edf3f8;
}
.money-cell { white-space: nowrap; overflow: visible; }
.money-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.money-cell strong {
  display: inline-block;
  min-width: 8ch;
  margin: 0;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.money-pm {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  border: 1px solid #f2d4d4;
  border-radius: 4px;
  padding: 0;
  color: #d05252;
  background: #fff7f7;
  font-size: 12px;
  font-weight: 750;
  line-height: 16px;
  letter-spacing: -0.04em;
}
.money-pm:hover { filter: brightness(0.96); }
.tiny-balance {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  border: 1px solid #f2d4d4;
  border-radius: 4px;
  padding: 0;
  color: #d05252;
  background: #fff7f7;
  font-size: 12px;
  line-height: 16px;
}
.tiny-balance.minus { border-color: #bae6fd; color: #0284c7; background: #e0f2fe; }
.split-value { line-height: 1.35; }
.split-value span {
  display: block;
  min-width: 0;
  color: #1689c4;
  font-variant-numeric: tabular-nums;
}
.split-value span:last-child { color: #e45c5c; }
.split-io em {
  margin-left: 1px;
  color: #8b95a5;
  font-size: 10px;
  font-style: normal;
  font-weight: 650;
}
.split-io span:last-child em { color: #c49a9a; }
.bet-rate-grid {
  display: inline-grid;
  align-items: center;
  justify-content: center;
  gap: 2px;
}
.bet-rate-row {
  display: flex;
  align-items: center;
  justify-content: center;
}
.bet-rate {
  display: inline-flex;
  align-items: center;
  gap: 1px;
  margin: 0 1px;
  color: #596575;
}
.bet-rate i {
  width: 14px;
  height: 14px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  color: white;
  font-style: normal;
  font-weight: 700;
  font-size: 7px;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .22);
}
.bet-rate b {
  min-width: 0;
  text-align: left;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.bet-rate-1 i { background: #5796e8; }
.bet-rate-2 i { background: #50bd8d; }
.bet-rate-3 i { background: #8f73d4; }
.fee-cell { white-space: nowrap; }
.ip-cell { white-space: nowrap; font-variant-numeric: tabular-nums; }
.access-dup-cell { text-align: center; }
.access-dup,
.access-kind {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 1px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 800;
}
.access-dup {
  color: #e11d48;
  background: #fff1f2;
}
.access-kind-cell { text-align: center; }
.access-kind.is-login {
  color: #16a34a;
  background: #dcfce7;
}
.access-kind.is-relogin {
  color: #2563eb;
  background: #dbeafe;
}
.access-kind.is-logout {
  color: #64748b;
  background: #e2e8f0;
}
[data-theme="dark"] .access-dup {
  color: #fb7185;
  background: #3d1f27;
}
[data-theme="dark"] .access-kind.is-login {
  color: #4ade80;
  background: #163226;
}
[data-theme="dark"] .access-kind.is-relogin {
  color: #7dd3fc;
  background: #163044;
}
[data-theme="dark"] .access-kind.is-logout {
  color: #94a3b8;
  background: #2a3340;
}
.access-log-page .head-actions .access-ip-manage-btn {
  min-height: 36px;
  padding: 8px 16px;
  font-weight: 700;
  letter-spacing: -0.02em;
  box-shadow: 0 8px 18px rgb(59 130 246 / .28);
}
.access-log-table { table-layout: fixed; width: 100%; }
.access-log-table .access-col-no { width: 2.8%; }
.access-log-table .access-col-parent { width: 8%; }
.access-log-table .access-col-account { width: 7.6%; }
.access-log-table .access-col-grade { width: 4.8%; }
.access-log-table .access-col-level { width: 3.2%; }
.access-log-table .access-col-settings { width: 8.2%; }
.access-log-table .access-col-memo { width: 4.2%; }
.access-log-table .access-col-domain { width: 18.6%; }
.access-log-table .access-col-ip { width: 9.4%; }
.access-log-table .access-col-dup { width: 3.6%; }
.access-log-table .access-col-device { width: 8.6%; }
.access-log-table .access-col-recent { width: 8%; }
.access-log-table .access-col-kind { width: 5%; }
.access-log-table .access-col-count { width: 4.2%; }
.access-log-table .access-col-manage { width: 3.8%; }
.access-log-table .access-no { color: var(--muted); font-variant-numeric: tabular-nums; }
.access-log-table .access-domain-cell {
  overflow: visible;
  font-variant-numeric: tabular-nums;
  text-align: left;
}
.access-domain-wrap {
  position: relative;
  display: block;
  width: 0;
  min-width: 100%;
  max-width: 100%;
  outline: none;
  cursor: default;
}
.access-domain {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.access-domain-wrap::after,
.access-domain-wrap::before {
  position: absolute;
  left: 0;
  z-index: 140;
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s ease;
}
.access-domain-wrap::after {
  content: attr(data-domain);
  top: calc(100% + 8px);
  max-width: min(420px, 70vw);
  padding: 6px 9px;
  border-radius: 4px;
  color: #fff;
  background: #1f2937;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -0.02em;
  line-height: 1.35;
  white-space: normal;
  word-break: break-all;
  text-align: left;
  box-shadow: 0 6px 16px rgb(15 23 42 / .28);
}
.access-domain-wrap::before {
  content: "";
  top: calc(100% + 1px);
  border: 4px solid transparent;
  border-bottom-color: #1f2937;
}
.access-domain-wrap:hover::after,
.access-domain-wrap:hover::before,
.access-domain-wrap:focus-visible::after,
.access-domain-wrap:focus-visible::before { opacity: 1; }
.access-log-table .access-count {
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.access-device {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.access-device i {
  width: 14px;
  height: 14px;
  flex: none;
}
.access-device.is-pc i { color: #94a3b8; }
.access-device.is-mobile i { color: #38bdf8; }
.access-device b { color: #e11d48; font-weight: 700; }
[data-theme="dark"] .access-device.is-pc i { color: #cbd5e1; }
[data-theme="dark"] .access-device.is-mobile i { color: #7dd3fc; }
.ip-history-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  white-space: nowrap;
}
.ip-flag,
.ip-flag-slot {
  flex: none;
  width: 16px;
  height: 12px;
  min-width: 16px;
  min-height: 12px;
}
.ip-flag {
  display: inline-block;
  object-fit: cover;
  object-position: center;
  border-radius: 2px;
  background: #1e293b;
  box-shadow: 0 0 0 1px rgb(15 23 42 / .28);
  image-rendering: auto;
  vertical-align: middle;
}
.ip-flag-slot {
  display: inline-block;
  border-radius: 2px;
  background: rgb(148 163 184 / .2);
}
.ip-history-text { font-variant-numeric: tabular-nums; }
.ip-history-ip {
  white-space: nowrap;
}
.ip-history-ip .ip-flag,
.ip-history-ip .ip-flag-slot {
  display: inline-block;
  margin-right: 6px;
  vertical-align: middle;
}
.md-field .ip-history-button {
  min-height: 26px;
  padding: 0 8px 0 6px;
  border: 1px solid #93c5fd;
  border-radius: 6px;
  color: #1d4ed8;
  background: #eff6ff;
  font-size: 12px;
  font-weight: 700;
}
[data-theme="dark"] .md-field .ip-history-button {
  color: #bfdbfe;
  border-color: #2563eb;
  background: #1e3a5f;
}
.access-log-table .ip-history-button,
.all-ip-table .ip-history-button,
.users-table .ip-history-button,
.ref-list-table .ip-history-button,
.pending-ip .ip-history-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid #93c5fd;
  border-radius: 6px;
  color: #1d4ed8;
  background: #eff6ff;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 1px 2px rgb(37 99 235 / .12);
}
[data-theme="dark"] .access-log-table .ip-history-button,
[data-theme="dark"] .all-ip-table .ip-history-button,
[data-theme="dark"] .users-table .ip-history-button,
[data-theme="dark"] .ref-list-table .ip-history-button,
[data-theme="dark"] .pending-ip .ip-history-button {
  color: #bfdbfe;
  border-color: #2563eb;
  background: #1e3a5f;
  box-shadow: 0 1px 2px rgb(37 99 235 / .28);
}
.access-log-table .ip-history-button:hover,
.access-log-table .ip-history-button:focus-visible,
.all-ip-table .ip-history-button:hover,
.all-ip-table .ip-history-button:focus-visible,
.users-table .ip-history-button:hover,
.users-table .ip-history-button:focus-visible,
.ref-list-table .ip-history-button:hover,
.ref-list-table .ip-history-button:focus-visible,
.pending-ip .ip-history-button:hover,
.pending-ip .ip-history-button:focus-visible {
  color: #fff;
  background: #365fa8;
  border-color: #365fa8;
}
[data-theme="dark"] .access-log-table .ip-history-button:hover,
[data-theme="dark"] .access-log-table .ip-history-button:focus-visible,
[data-theme="dark"] .all-ip-table .ip-history-button:hover,
[data-theme="dark"] .all-ip-table .ip-history-button:focus-visible,
[data-theme="dark"] .users-table .ip-history-button:hover,
[data-theme="dark"] .users-table .ip-history-button:focus-visible,
[data-theme="dark"] .pending-ip .ip-history-button:hover,
[data-theme="dark"] .pending-ip .ip-history-button:focus-visible {
  background: #3b82f6;
  border-color: #3b82f6;
}
.ip-history-button:hover,
.ip-history-button:focus-visible { color: var(--primary); }
.ip-history-table { width: 100%; }
.ip-history-table th {
  height: 34px;
  padding: 8px 12px;
  color: var(--muted);
  background: var(--surface-3);
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}
.ip-history-table td {
  height: 38px;
  padding: 6px 12px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.ip-history-table tr.is-current td { color: var(--text); }
.ip-history-ip { font-weight: 650; }
.modal.is-all-ip { width: min(920px, calc(100vw - 48px)); }
.modal.is-all-ip #modalSave { display: none; }
.modal.is-all-ip .modal-body {
  display: flex;
  flex-direction: column;
  padding: 0;
  max-height: min(72vh, 640px);
}
.modal.is-all-ip .modal-foot { background: var(--surface); }
.all-ip-modal {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
.all-ip-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
}
.all-ip-search { position: relative; flex: 1; min-width: 0; }
.all-ip-search .nav-search-icon {
  position: absolute;
  top: 50%;
  left: 10px;
  width: 14px;
  transform: translateY(-50%);
  color: var(--muted);
}
.all-ip-search .input { padding-left: 30px; }
.all-ip-count { color: var(--muted); font-size: 12px; white-space: nowrap; }
.all-ip-scroll {
  flex: 1;
  min-height: 280px;
  overflow: auto;
}
.all-ip-table { width: 100%; }
.all-ip-table th,
.all-ip-table td {
  height: auto;
  min-height: 40px;
  padding: 10px 12px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  overflow: visible;
}
.all-ip-table th {
  color: var(--muted);
  background: var(--surface-3);
  font-weight: 700;
}
.all-ip-parent small {
  display: block;
  color: var(--muted);
}
.all-ip-table .all-ip-domain {
  max-width: 280px;
  overflow: visible;
  text-align: left;
  font-variant-numeric: tabular-nums;
}
.all-ip-ip { font-variant-numeric: tabular-nums; }
.all-ip-table td.numeric { text-align: center; font-variant-numeric: tabular-nums; font-weight: 700; }
.all-ip-empty {
  padding: 28px 16px;
  color: var(--muted);
  text-align: center;
}
.fee-rate-grid {
  display: inline-grid;
  grid-template-columns: repeat(2, max-content);
  align-items: center;
  justify-content: center;
  gap: 1px 3px;
}
.fee-rate {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin: 0;
  color: #596575;
  font-size: 10px;
}
.fee-rate i {
  width: 16px;
  height: 16px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  color: white;
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .22);
}
.fee-rate b { font-size: 10px; font-weight: 650; }
.fee-rate-1 i { background: #e6a13f; }
.fee-rate-2 i { background: #5796e8; }
.fee-rate-3 i { background: #50bd8d; }
.fee-rate-4 i { background: #8f73d4; }
.manage-cell { text-align: center !important; white-space: nowrap; overflow: visible; position: relative; z-index: 2; }
.users-table tbody tr { position: relative; z-index: 1; }
.users-table tbody tr:hover { z-index: 80; }
.users-table tbody tr:hover .manage-cell,
.users-table tbody tr:hover .money-cell,
.users-table tbody tr:hover .writer-cell,
.users-table tbody tr:hover .memo-cell { z-index: 90; }
.mini-action {
  position: relative;
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  margin: 0 1px;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 0;
  background: linear-gradient(#fff, #f8fafc);
  color: #526477;
  line-height: 0;
  box-shadow: 0 1px 2px rgb(15 23 42 / .05);
}
.mini-action:hover {
  border-color: #b8c7d5;
  color: #12304f;
  background: #edf3f8;
  box-shadow: 0 2px 5px rgb(15 23 42 / .08);
}
.mini-action-delete {
  color: #8b0000;
  border-color: #e4bcbc;
  background: #fdecec;
}
.mini-action-delete:hover {
  color: #6b0000;
  border-color: #c45c5c;
  background: #f8d0d0;
}
.mini-action svg { width: 11px; height: 11px; display: block; margin: auto; stroke-width: 1.8; }
.tiny-balance,
.money-pm,
.md-live-refresh { position: relative; }
.icon-tip::after,
.icon-tip::before {
  position: absolute;
  left: 50%;
  z-index: 120;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%);
  transition: opacity .12s ease;
}
.icon-tip::after {
  content: attr(data-tip);
  top: calc(100% + 8px);
  bottom: auto;
  padding: 5px 8px;
  border-radius: 4px;
  color: #fff;
  background: #1f2937;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: 0 6px 16px rgb(15 23 42 / .28);
}
.icon-tip::before {
  content: "";
  top: calc(100% + 1px);
  bottom: auto;
  border: 4px solid transparent;
  border-bottom-color: #1f2937;
}
.icon-tip:hover::after,
.icon-tip:hover::before,
.icon-tip:focus-visible::after,
.icon-tip:focus-visible::before { opacity: 1; }
.manage-cell .icon-tip::after {
  left: auto;
  right: 0;
  transform: none;
}
.manage-cell .icon-tip::before {
  left: auto;
  right: 7px;
  transform: none;
}
.users-table-footer {
  min-height: 42px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  padding: 6px 9px;
  border-top: 1px solid var(--line);
  background: var(--surface);
}
.users-table-footer > span { color: var(--muted); font-size: 11px; }
.users-table-footer > label {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
}
.users-table-footer .select { width: 72px; height: 28px; border-radius: 4px; font-size: 11px; }
.users-table-footer .page-button { min-width: 28px; height: 28px; border-radius: 4px; font-size: 11px; }
.users-table-footer .page-button.active { color: white; border-color: #0b2743; background: #0b2743; }

/* Screenshot-matched online-user list */
.online-users-page { min-width: 0; }
.online-users-card { overflow: hidden; border-radius: 4px; box-shadow: none; }
.online-users-toolbar {
  min-height: 39px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 12px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}
.online-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  min-width: 0;
  flex: 1 1 720px;
}
.online-tabs button {
  min-width: 0;
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 10px;
  color: #5c6f86;
  background: var(--surface);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.online-tabs button:hover {
  color: #12304f;
  border-color: #b8c7d5;
  background: #edf3f8;
}
.online-tabs button.active {
  color: white;
  background: #365fa8;
  border-color: #365fa8;
}
.online-live-status {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  color: var(--muted);
  white-space: nowrap;
}
.online-tab-count {
  color: var(--muted);
  font-size: 11px;
}
.online-tab-count strong { color: var(--text); font-weight: 700; }
.online-live-status strong {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #2aab95;
  font-weight: 650;
}
.online-live-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #35c6ab;
  box-shadow: 0 0 0 3px rgb(53 198 171 / .12);
}
.online-empty-row td {
  height: 88px;
  color: var(--muted);
  font-size: 13px;
}
[data-theme="dark"] .online-tabs button {
  color: #c9d5e2;
  border-color: var(--line);
  background: var(--surface-2);
}
[data-theme="dark"] .online-tabs button:hover {
  color: #fff;
  border-color: #46617b;
  background: #243247;
}
[data-theme="dark"] .online-tabs button.active {
  color: #fff;
  background: #365fa8;
  border-color: #365fa8;
}
.online-kick-selected {
  min-height: 26px !important;
  padding: 0 10px !important;
  color: #fff !important;
  background: #ef6b57 !important;
  border-color: #ef6b57 !important;
  font-size: 11px !important;
  font-weight: 800;
}
.online-kick-selected:hover { filter: brightness(1.06); }
.online-table-wrap { width: 100%; overflow-x: auto; }
.online-users-table { width: 100%; table-layout: auto; }
.online-users-table th {
  height: 31px;
  padding: 6px 8px;
  color: var(--muted);
  background: var(--surface-3);
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
}
.online-users-table td {
  height: 45px;
  padding: 6px 8px;
  text-align: center;
  vertical-align: middle;
}
.online-users-table .check-column { width: 34px; padding-inline: 4px; }
.online-users-table td.writer-cell { overflow: visible; }
.online-users-table .writer-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.online-users-table .badge.hq { color: #10233a; background: #9eb6ce; }
.online-users-table .badge.office { color: #12324d; background: #c5def3; }
.online-users-table .badge.master { color: #3a2200; background: #f3d39a; }
.online-users-table .badge.agent { color: #0f3b3c; background: #9fe1dc; }
.online-users-table .badge.shop { color: #12351f; background: #bfe8c9; }
.online-users-table .badge.member { color: #3a1730; background: #edc6df; }
.online-member-settings { min-width: 108px; }
.online-users-table td.online-casino-cell {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  white-space: nowrap;
}
.online-device-cell { white-space: nowrap; }
.online-bet-values span { display: block; color: #338ddd; line-height: 1.25; }
.online-bet-values span:last-child { color: #ea6161; }
.online-manage { white-space: nowrap; }
.online-action {
  min-height: 23px;
  margin: 0 2px;
  border: 0;
  border-radius: 3px;
  padding: 4px 8px;
  color: white;
  font-weight: 650;
  font-size: 11px;
}
.online-action.warning { background: #e9a92b; }
.online-action.warning:hover { background: #cf9020; }
.online-action.danger { background: #e84e4e; }
.online-action.danger:hover { background: #cf3c3c; }
.online-action.block { background: #2f3b4a; }
.online-action.block:hover { background: #1f2937; }
[data-theme="dark"] .online-action.block { background: #334155; }

@media (max-width: 1100px) {
  .operation-pills b { display: none; }
  .operation-pills > span { padding-inline: 4px; border: 0; }
  .operation-expanded-content { grid-template-columns: repeat(11, minmax(0, 1fr)); }
  .users-filter-bar { flex-wrap: wrap; }
  .users-filter-bar .users-keyword { flex: 1 1 calc(50% - 5px); max-width: none; margin-left: 0; }
}

@media (max-width: 700px) {
  :root { --sidebar: 160px; }
  .drawer-head .logo-row { padding-inline: 9px; }
  .logo-copy span { display: none; }
  .nav-icon { display: none; }
  .nav-children { padding-left: 8px; }
  .topbar { height: 36px; min-height: 36px; padding-inline: 6px; }
  .global-divider { display: none; }
  .queue-counter { padding-inline: 6px; }
  .queue-counter.sub { display: none; }
  .topbar .profile-button > span:not(.avatar),
  .admin-lang-name { display: none; }
  .admin-lang-trigger { padding-right: 16px; max-width: 42px; }
  .location-bar { padding-inline: 7px; }
  .location-path a, .location-path span { display: none; }
  .operation-panel { padding: 5px 7px 7px; }
  .operation-panel-head { flex-wrap: wrap; align-items: center; gap: 5px; }
  .operation-title { width: calc(100% - 48px); }
  .operation-tools { order: 3; width: 100%; flex-wrap: wrap; }
  .operation-date-range { width: 100%; }
  .operation-date-range label { min-width: 0; flex: 1; }
  .operation-date-range input { width: 100%; }
  .operation-pills { order: 2; margin-left: auto; }
  .operation-pills > span:nth-child(n+5) { display: none; }
  .operation-toggle { position: absolute; top: 5px; right: 7px; }
  .operation-expanded-content {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .operation-collapsed .operation-toggle { top: 4px; right: 5px; }
  .compact-counter-row { grid-template-columns: repeat(11, 82px); overflow-x: auto; }
  .compact-money-row { grid-template-columns: repeat(10, 88px); overflow-x: auto; }
  .compact-summary-row { padding-right: 46px; }
  .compact-summary-row > div { padding-inline: 8px; }
  .content { padding: 10px 7px 24px; }
  .users-filter-bar { align-items: stretch; }
  .users-filter-bar > label,
  .users-filter-bar .users-date-range,
  .users-filter-bar .users-keyword { flex: 1 1 calc(50% - 5px); max-width: none; }
  .users-period { flex: 1 1 100%; }
  .users-filter-bar .users-date-range { flex-basis: 100%; }
  .users-search-button { flex: 1 1 100%; justify-content: center; }
  .users-status-bar { flex-wrap: wrap; }
  .users-status-bar > span { flex: 1 1 25%; }
  .users-table-footer { grid-template-columns: 1fr auto; }
  .users-table-footer .pagination { grid-column: 1 / -1; grid-row: 1; justify-self: center; }
}

/* Unified admin content typography; sidebar navigation and logos retain their scale. */
.main-app,
.main-app * {
  font-size: 11px !important;
}
.main-app .global-logo-mark { font-size: 12px !important; }
.main-app .global-brand strong { font-size: 13px !important; }

/* Permanent navy navigation matching the global header. */
.sidebar,
.drawer-head {
  color: #dbe7f2;
  background: #071b30;
  border-color: #173149;
}
.sidebar .nav-group-button,
.sidebar .nav-link,
.sidebar .nav-children .nav-link,
[data-theme="dark"] .sidebar .nav-group-button,
[data-theme="dark"] .sidebar .nav-link {
  color: #b9c8d8;
  font-size: 12px;
}
.sidebar .nav-icon { color: #7f98b0; }
.sidebar .nav-group-button:hover,
.sidebar .nav-link:hover {
  color: #fff;
  background: rgb(255 255 255 / .07);
}
.sidebar .nav-link.active {
  color: #88e2dc;
  background: rgb(70 192 183 / .14);
}
.sidebar .nav-children .nav-link { color: #91a6bb; }
.sidebar .nav-children .nav-link::before { background: #496279; }
.sidebar .nav-children .nav-link.active::before { background: #65d2ca; }

.nav-search {
  position: relative;
  padding: 8px 8px 6px;
  border-bottom: 1px solid #173149;
  background: #071b30;
}
.nav-search-icon {
  position: absolute;
  top: 50%;
  left: 16px;
  width: 13px;
  height: 13px;
  color: #7f98b0;
  transform: translateY(-50%);
  pointer-events: none;
}
.nav-search-icon svg { width: 13px; height: 13px; stroke-width: 1.8; }
.nav-search input {
  width: 100%;
  height: 28px;
  border: 1px solid #1e3a52;
  border-radius: 6px;
  padding: 0 8px 0 28px;
  color: #dbe7f2;
  background: #0b2743;
  font-size: 12px;
}
.nav-search input::placeholder { color: #6f8aa3; }
.nav-search input:focus { outline: 0; border-color: #3f718f; }
.nav-section {
  margin: 12px 10px 4px;
  color: #6f8aa3;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .7px;
}
.nav-section:first-child { margin-top: 2px; }
.nav-group.nested { margin: 0; }
.nav-group.nested > .nav-group-button {
  min-height: 26px;
  padding: 3px 8px;
  color: #7f98b0;
  font-size: 12px;
}
.nav-group.nested > .nav-children { padding-left: 12px; }
.hidden-by-search { display: none !important; }
.org-layout {
  display: grid;
  grid-template-columns: minmax(0, 40%) minmax(0, 60%);
  gap: 12px;
  align-items: start;
}
.org-tree-card,
.org-settle-card { min-width: 0; padding: 16px 18px 12px; }
.org-tree-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.org-tree-toolbar h2 { margin: 0 0 4px; font-size: 15px; }
.org-tree-toolbar p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.org-tree-toolbar strong { color: var(--text); font-size: 13px; white-space: nowrap; }
.org-tree-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex: 0 0 auto;
}
.org-move-help {
  position: relative;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 1px solid #f59e0b;
  border-radius: 50%;
  background: #f59e0b;
  color: #1c1406;
  font-weight: 900;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, .25), 0 0 12px rgba(245, 158, 11, .28);
  cursor: help;
}
.org-move-help i { font-style: normal; font-size: 13px; line-height: 1; }
.org-move-help-pop {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 30;
  display: none;
  width: max-content;
  max-width: min(340px, 70vw);
  padding: 8px 10px;
  border: 1px solid #f59e0b;
  border-radius: 10px;
  background: #1a1408;
  color: #fff7e6;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.5;
  text-align: left;
  white-space: normal;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .4);
}
.org-move-help:hover .org-move-help-pop,
.org-move-help:focus-visible .org-move-help-pop { display: block; }
.org-tree-legend {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}
.org-tree-chips { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.org-tree-expand { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; }
.org-tree-expand .btn { min-height: 24px; padding: 4px 10px; }
.org-tree-depth .select {
  width: 96px;
  height: 24px;
  min-height: 24px;
  padding: 0 22px 0 8px;
  font-size: 11px;
  font-weight: 650;
}
.org-tree-depth .select:invalid,
.org-tree-depth .select option[value=""] {
  color: #94a3b8;
}
[data-theme="dark"] .org-tree-depth .select:invalid,
[data-theme="dark"] .org-tree-depth .select option[value=""] {
  color: #8b97a8;
}
.org-tree-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 20px;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.org-tree-chip b {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.org-tree-chip.hq { color: #dceaf8; background: #16324c; }
.org-tree-chip.office { color: #12324d; background: #c5def3; }
.org-tree-chip.master { color: #3a2200; background: #f3d39a; }
.org-tree-chip.agent { color: #0f3b3c; background: #9fe1dc; }
.org-tree-chip.shop { color: #12351f; background: #bfe8c9; }
.org-tree-chip.member { color: #3a1730; background: #edc6df; }
.org-tree-search {
  position: relative;
  margin-bottom: 12px;
}
.org-tree-search-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  width: 14px;
  height: 14px;
  color: var(--muted);
  transform: translateY(-50%);
  pointer-events: none;
}
.org-tree-search-icon svg { width: 14px; height: 14px; }
.org-tree-search input {
  width: 100%;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px 0 32px;
  color: var(--text);
  background: var(--surface-2);
  font-size: 12px !important;
}
.org-tree-search input::placeholder { color: var(--muted); }
.org-tree-search input:focus {
  outline: 0;
  border-color: #3f718f;
  box-shadow: 0 0 0 3px rgb(70 192 183 / .16);
}
.org-tree-empty {
  margin: 0;
  padding: 28px 12px;
  color: var(--muted);
  text-align: center;
}
.org-tree-row.is-match {
  box-shadow: inset 0 0 0 1px #46c0b7;
}
.org-tree-list { list-style: none; margin: 0; padding: 0; }
.org-tree-list .org-tree-list {
  margin: 2px 0 6px 12px;
  padding-left: 14px;
  border-left: 1px dashed var(--line);
}
.org-tree-item { margin: 0; }
.org-tree-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 34px;
  margin: 2px 0;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 4px 8px;
  overflow: hidden;
  background: color-mix(in srgb, var(--surface) 88%, #0a1a2b 12%);
  cursor: pointer;
}
.org-tree-row.hq { background: #0c2238; color: #e7f0f8; }
.org-tree-row.office { background: color-mix(in srgb, var(--surface) 80%, #1d4a72 20%); }
.org-tree-item[draggable="true"] { cursor: grab; }
.org-tree-item[draggable="true"]:active { cursor: grabbing; }
.org-tree-row.master { background: color-mix(in srgb, var(--surface) 82%, #8a5a12 18%); }
.org-tree-row.agent { background: color-mix(in srgb, var(--surface) 84%, #0f6b66 16%); }
.org-tree-row.shop { background: color-mix(in srgb, var(--surface) 86%, #1f5a34 14%); }
.org-tree-row.member { background: color-mix(in srgb, var(--surface) 88%, #5a2044 12%); }
.org-tree-row.is-dragging { opacity: 0.45; cursor: grabbing; }
.org-tree-row.is-drop-target,
.org-tree-row.is-selected {
  border-color: #3b82f6;
  box-shadow: inset 0 0 0 1px #3b82f6;
}
.org-tree-row.is-drop-blocked {
  border-color: #e11d48;
  box-shadow: inset 0 0 0 1px #e11d48;
}
.org-tree-toggle {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--text);
  background: transparent;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
}
.org-tree-toggle.spacer { visibility: hidden; pointer-events: none; }
.org-tree-grip {
  display: inline-flex;
  flex: 0 0 16px;
  width: 16px;
  color: var(--muted);
}
.org-tree-grip svg { width: 14px; height: 14px; }
.org-tree-chip { flex: 0 0 auto; }
.org-tree-copy {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 0;
  overflow: hidden;
  font-size: 12px;
}
.org-tree-copy strong { font-size: 12px; flex: 0 0 auto; }
.org-tree-meta {
  color: var(--muted);
  font-size: 11px;
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.org-roll {
  flex: 0 0 auto;
  min-width: 0;
  margin-left: 8px;
}
.org-tree-actions .org-roll { margin-left: 0; }
.org-rate-check {
  flex: 0 0 auto;
  min-height: 20px;
  height: 20px;
  padding: 0 8px;
  font-size: 10px;
}
.org-roll-line {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 11px;
}
.org-tree-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  margin-left: auto;
}
.org-condition-edit {
  min-height: 22px;
  padding: 2px 8px;
  font-size: 10px;
  white-space: nowrap;
}
.org-tree-status {
  flex: 0 0 auto;
  color: #8ec49a;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.org-tree-status.is-stop { color: #f87171; }
.org-tree-settle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1;
  white-space: nowrap;
}
.org-tree-settle.is-done {
  color: #bbf7d0;
  border-color: #166534;
  background: #14532d;
}
.org-tree-settle.is-wait {
  color: #fde68a;
  border-color: #a16207;
  background: #422006;
}
.org-tree-settle.is-lose {
  color: #bfdbfe;
  border-color: #1d4ed8;
  background: #1e3a5f;
}
.org-tree-settle.is-pnl {
  color: #e2e8f0;
  border-color: #475569;
  background: #1e293b;
}
.org-tree-settle.is-pnl.is-plus {
  color: #bbf7d0;
  border-color: #166534;
  background: #14532d;
}
.org-tree-settle.is-pnl.is-minus {
  color: #fecaca;
  border-color: #991b1b;
  background: #450a0a;
}
.org-tree-settle.is-hold {
  color: #e2e8f0;
  border-color: #334155;
  background: #1e293b;
}
.org-condition-lead {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.org-condition-form .input[readonly] { color: var(--muted); background: var(--surface-2); }
.org-tree-hover-tip {
  position: fixed;
  z-index: 80;
  max-width: min(420px, calc(100vw - 24px));
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 8px 10px;
  color: var(--text);
  background: var(--surface);
  box-shadow: var(--shadow);
  font-size: 12px;
  line-height: 1.45;
  pointer-events: none;
}
.org-settle-card { padding: 14px 16px 18px; }
.org-settle-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.org-settle-dates {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}
.org-settle-dates label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 11px;
}
.org-settle-dates .input { min-height: 36px; width: 148px; }
.org-settle-query {
  min-height: 36px;
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
  padding: 8px 18px;
}
.org-settle-query:hover { border-color: #1d4ed8; background: #1d4ed8; color: #fff; }
.org-deposit-panel,
.org-settle-board {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px 16px 8px;
  background: var(--surface-2);
}
.org-deposit-panel { margin-bottom: 12px; }
.org-deposit-panel h3,
.org-settle-board-head h3 {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
}
.org-deposit-chart { display: block; width: 100%; height: 168px; }
.org-deposit-chart text { fill: var(--muted); font-size: 11px; }
.org-settle-board-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.org-settle-board-head span { margin-left: 8px; color: var(--muted); font-size: 12px; font-weight: 500; }
.org-settle-board-head b { color: var(--muted); font-size: 11px; font-weight: 600; }
.org-settle-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 10px 0 12px;
}
.org-settle-kpis article {
  display: grid;
  gap: 4px;
  border-radius: 12px;
  padding: 12px 10px;
  background: #eef4fb;
  text-align: center;
}
.org-settle-kpis span { color: var(--muted); font-size: 11px; }
.org-settle-kpis strong { font-size: 15px; font-weight: 800; letter-spacing: -0.02em; }
.org-settle-table-wrap { overflow-x: auto; }
.org-settle-table { width: 100%; border-collapse: collapse; }
.org-settle-table th,
.org-settle-table td {
  padding: 9px 6px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}
.org-settle-table .numeric { text-align: center; }
.org-settle-table thead th { color: var(--muted); font-weight: 600; }
.org-settle-table tfoot th,
.org-settle-table tfoot td { border-bottom: 0; font-weight: 800; }
.org-settle-empty { margin: 24px 0; color: var(--muted); text-align: center; }
[data-theme="dark"] .org-settle-kpis article { background: #173044; }
[data-theme="dark"] .org-tree-row.hq { color: #e7f0f8; }
@media (max-width: 1180px) {
  .org-layout { grid-template-columns: 1fr; }
  .org-tree-wrap { max-height: 420px; }
  .org-settle-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .org-tree-toolbar,
  .org-settle-toolbar { flex-direction: column; align-items: stretch; }
}

/* Theme-safe overrides for the screenshot-driven operation and member panels. */
[data-theme="dark"] .operation-panel,
[data-theme="dark"] .users-filter-bar,
[data-theme="dark"] .bulk-actions,
[data-theme="dark"] .users-table-card,
[data-theme="dark"] .users-table-footer {
  color: var(--text);
  background: var(--surface);
  border-color: var(--line);
}
[data-theme="dark"] .operation-shortcuts,
[data-theme="dark"] .period-shortcuts,
[data-theme="dark"] .operation-shortcuts button,
[data-theme="dark"] .period-shortcuts button,
[data-theme="dark"] .operation-date-range input,
[data-theme="dark"] .operation-toggle {
  color: var(--text);
  background: var(--surface-2);
  border-color: var(--line);
}
[data-theme="dark"] .operation-shortcuts button.active,
[data-theme="dark"] .period-shortcuts button.active {
  color: var(--warning);
  background: var(--warning-soft);
}
[data-theme="dark"] .operation-date-range input,
[data-theme="dark"] .users-date-range input {
  color-scheme: dark;
}
[data-theme="dark"] .operation-expanded-content,
[data-theme="dark"] .operation-group,
[data-theme="dark"] .operation-pills > span,
[data-theme="dark"] .compact-summary-row,
[data-theme="dark"] .compact-summary-row > div {
  border-color: var(--line);
}
[data-theme="dark"] .operation-group h2,
[data-theme="dark"] .operation-metric,
[data-theme="dark"] .operation-pills > span,
[data-theme="dark"] .compact-summary-row span,
[data-theme="dark"] .users-filter-bar > label > span,
[data-theme="dark"] .users-period legend,
[data-theme="dark"] .users-date-range label > span,
[data-theme="dark"] .bulk-actions > span,
[data-theme="dark"] .bulk-page-size,
[data-theme="dark"] .users-table-footer > span {
  color: var(--muted);
}
[data-theme="dark"] .operation-metric strong,
[data-theme="dark"] .compact-summary-row strong {
  color: var(--text);
}
[data-theme="dark"] .operation-metric.is-shade,
[data-theme="dark"] .compact-summary-row > div.is-shade {
  background: rgb(56 189 248 / .16);
}
[data-theme="dark"] .location-bar {
  color: var(--muted);
  background: var(--surface-2);
  border-color: var(--line);
}
[data-theme="dark"] .location-bar > strong { color: var(--text); }
[data-theme="dark"] .location-path { color: var(--muted); }
[data-theme="dark"] .location-path a:hover,
[data-theme="dark"] .location-path b { color: #8fc3ed; }
[data-theme="dark"] .users-table th {
  color: var(--muted);
  background: var(--surface-3);
  border-color: var(--line);
}
[data-theme="dark"] .head-count { color: #8b97a8; }
[data-theme="dark"] .head-help,
[data-theme="dark"] .parent-tree-help { color: #f0b44a; }
[data-theme="dark"] .head-help-tip {
  color: #f8fafc;
  background: #0f172a;
  box-shadow: 0 8px 20px rgb(0 0 0 / .45);
}
[data-theme="dark"] .head-help-tip::before { border-bottom-color: #0f172a; }
[data-theme="dark"] .users-table td,
[data-theme="dark"] .users-table-footer {
  border-color: var(--line);
}
[data-theme="dark"] .bulk-actions .btn,
[data-theme="dark"] .member-setting-button,
[data-theme="dark"] .memo-button,
[data-theme="dark"] .mini-action {
  color: #c9d5e2;
  border-color: var(--line);
  background: var(--surface-2);
  box-shadow: none;
}
[data-theme="dark"] .memo-button.has-memo {
  color: #e0c36a;
  border-color: #5a4a24;
  background: #2a2616;
}
[data-theme="dark"] .bulk-actions .btn:hover,
[data-theme="dark"] .member-setting-button:hover,
[data-theme="dark"] .memo-button:hover,
[data-theme="dark"] .mini-action:hover {
  color: #fff;
  border-color: #46617b;
  background: #243247;
}
[data-theme="dark"] .bulk-actions .btn.bulk-blue {
  color: #93c5fd;
  border-color: #2f4d6a;
  background: #1c2f44;
}
[data-theme="dark"] .bulk-actions .btn.bulk-blue:hover,
[data-theme="dark"] .bulk-actions .btn.bulk-blue.is-active {
  color: #fff;
  border-color: #4b789f;
  background: #3d6d96;
}
[data-theme="dark"] .bulk-actions .btn.bulk-green {
  color: #86efac;
  border-color: #2f5a42;
  background: #1c3327;
}
[data-theme="dark"] .bulk-actions .btn.bulk-green:hover,
[data-theme="dark"] .bulk-actions .btn.bulk-green.is-active {
  color: #fff;
  border-color: #3f8a62;
  background: #2f6d4c;
}
[data-theme="dark"] .member-setting-button.is-both.is-on,
[data-theme="dark"] .member-setting-button.is-both.is-on:hover {
  color: #fbbf24;
  border-color: #854d0e;
  background: #3f2e10;
}
[data-theme="dark"] .member-setting-button.is-caution.is-on,
[data-theme="dark"] .member-setting-button.is-caution.is-on:hover {
  color: #fb7185;
  border-color: #9f1239;
  background: #3f1d27;
}
[data-theme="dark"] .member-setting-button.is-voidbet.is-on,
[data-theme="dark"] .member-setting-button.is-voidbet.is-on:hover {
  color: #99f6e4;
  border-color: #0f766e;
  background: #134e4a;
}
[data-theme="dark"] .bulk-actions .bulk-red {
  color: #d4a0a8;
  border-color: #5a353c;
  background: #2a1c20;
}
[data-theme="dark"] .bulk-actions .bulk-red:hover {
  color: #fb7185;
  border-color: #7f1d1d;
  background: #3b1518;
}
[data-theme="dark"] .bulk-actions .users-csv {
  color: white;
  border-color: #426f98;
  background: #4b789f;
}
[data-theme="dark"] .bulk-actions .users-csv:hover {
  color: white;
  background: #3c678d;
}
[data-theme="dark"] .bulk-actions .users-create {
  color: white;
  border-color: #bd8933;
  background: #c79535;
}
[data-theme="dark"] .bulk-actions .users-create:hover {
  color: white;
  background: #ad7a26;
}
[data-theme="dark"] .mini-action-delete {
  color: #e11d48;
  border-color: #7f1d1d;
  background: #3b1518;
}
[data-theme="dark"] .mini-action-delete:hover {
  color: #fb7185;
  border-color: #be123c;
  background: #4c0519;
}
[data-theme="dark"] .tiny-balance,
[data-theme="dark"] .money-pm { color: #fb7185; background: #3d1f27; border-color: #63323e; }
[data-theme="dark"] .tiny-balance.minus { color: #7dd3fc; background: #16324c; border-color: #2a5a78; }

.ops-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ops-subcard { padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2, var(--surface-3)); }
.ops-subcard h3 { margin: 0 0 10px; font-size: 13px; }
.ops-hint { margin: 8px 0 0; color: var(--muted); font-size: 11px; }
.ops-lead { margin: 0 0 14px; color: var(--muted); font-size: 12px; }
.ops-pad { padding: 16px; }
.ops-pad h3 { margin: 0 0 12px; font-size: 14px; }
.ops-switch-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; }
.ops-pills, .ops-tabs, .ops-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ops-pills { margin-bottom: 14px; }
.ops-pill, .ops-tab, .ops-chip {
  min-height: 32px; border: 1px solid var(--line-strong); border-radius: 999px;
  background: var(--surface); padding: 6px 12px; color: var(--muted); font-size: 12px;
}
.ops-tab { border-radius: 8px 8px 0 0; border-bottom: 2px solid transparent; }
.ops-tabs { border-bottom: 1px solid var(--line); margin-bottom: 14px; }
.ops-pill.active, .ops-chip.active, .ops-tab.active {
  border-color: var(--primary); background: var(--primary-soft); color: var(--primary); font-weight: 700;
}
.ops-tabs.faint .ops-tab { opacity: .45; }
.ops-kv { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 42px; }
.ops-kv-input { max-width: 180px; text-align: right; }
.ops-time { display: flex; align-items: center; gap: 6px; max-width: 220px; }
.ops-card-foot { display: flex; justify-content: flex-end; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.ops-charge-grid { display: grid; grid-template-columns: 1.1fr 1.1fr .9fr; gap: 12px; }
.ops-charge-grid.is-2 { grid-template-columns: 1fr 1fr; align-items: start; }
.ops-charge-side { display: grid; gap: 12px; }
.ops-time i {
  color: var(--muted);
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.ops-note {
  display: flex; justify-content: space-between; gap: 16px; margin: 12px 0;
  padding: 14px 16px; border: 1px solid #93c5fd; border-radius: 12px; background: #eff6ff; color: #1e3a8a;
}
[data-theme="dark"] .ops-note { border-color: #1e4b8c; background: #10243f; color: #bfdbfe; }
.ops-note.danger { border-color: #fca5a5; background: #fef2f2; color: #7f1d1d; }
[data-theme="dark"] .ops-note.danger { border-color: #7f1d1d; background: #3b1515; color: #fecaca; }
.ops-note ul { margin: 6px 0 0; padding-left: 18px; }
.ops-note li { margin: 3px 0; font-size: 12px; line-height: 1.45; }
.ops-sites { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 12px; }
.ops-group-list { display: grid; gap: 6px; margin: 10px 0 12px; }
.ops-group {
  display: flex; justify-content: space-between; width: 100%;
  border: 0; border-radius: 8px; background: transparent; padding: 9px 10px; color: var(--text);
}
.ops-group.active { background: var(--primary-soft); color: var(--primary); font-weight: 700; }
.ops-add-wide { width: calc(100% - 24px); margin: 8px 12px 12px; }
.ops-inline, .ops-inline-switch { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ops-inline .btn, .ops-inline .select, .ops-inline .ops-search { white-space: nowrap; flex: 0 0 auto; }
.ops-sites .card-titlebar { align-items: flex-start; flex-wrap: wrap; }
.ops-search { position: relative; min-width: 220px; }
.ops-search span { position: absolute; left: 8px; top: 8px; color: var(--muted); }
.ops-search svg { width: 14px; height: 14px; }
.ops-search .input { padding-left: 28px; }
.ops-theme { display: inline-block; width: 54px; height: 32px; border-radius: 6px; background: #1f2937; }
.ops-theme-gold { background: linear-gradient(135deg, #1a1208, #c9a227); }
.ops-theme-violet { background: linear-gradient(135deg, #1b1028, #7c3aed); }
.ops-theme-dark { background: linear-gradient(135deg, #0b1220, #334155); }
.ops-theme-light { background: linear-gradient(135deg, #e5e7eb, #ffffff); border: 1px solid var(--line); }
.ops-stat-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.ops-stat-row.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ops-stat { padding: 16px; }
.ops-stat span { color: var(--muted); font-size: 12px; }
.ops-stat strong { display: block; margin: 6px 0 4px; font-size: 22px; }
.ops-stat small { color: var(--muted); font-size: 11px; }
.ops-back { border: 0; background: transparent; color: var(--muted); margin-bottom: 8px; padding: 0; }
.ops-site-hero { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.ops-site-hero h1 { margin: 0; font-size: 22px; }
.ops-site-hero p { margin: 4px 0 0; color: var(--muted); }
.ops-meta-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.ops-meta-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ops-meta { padding: 12px 14px; }
.ops-meta span { display: block; color: var(--muted); font-size: 11px; }
.ops-meta strong { display: block; margin-top: 4px; font-size: 13px; }
.ops-site-body { display: grid; grid-template-columns: 180px minmax(0, 1fr) 260px; gap: 12px; }
.ops-side-nav { display: grid; padding: 8px; }
.ops-side-nav button { text-align: left; border: 0; border-radius: 8px; background: transparent; padding: 10px; color: var(--text); }
.ops-side-nav button.active { background: var(--primary-soft); color: var(--primary); font-weight: 700; }
.ops-side-nav button.danger { color: var(--danger); }
.ops-logo-row { display: flex; align-items: center; gap: 12px; }
.ops-logo-row img { height: 36px; background: #0b1220; padding: 6px 10px; border-radius: 8px; }
.ops-site-shot {
  min-height: 120px; display: grid; place-items: center; border-radius: 10px;
  background: linear-gradient(160deg, #0b1220, #1f2937); color: #f5e6b8; text-align: center; font-size: 12px;
}
.ops-copy-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ops-copy-row code { font-size: 11px; }
.ops-quick, .ops-help .ops-quick {
  width: 100%; display: flex; text-align: left; margin: 4px 0;
  border: 1px solid var(--line); border-radius: 8px; background: var(--surface); padding: 9px 10px;
}
.ops-timeline { margin: 0; padding-left: 18px; }
.ops-timeline li { margin: 8px 0; }
.ops-timeline span { display: block; color: var(--muted); font-size: 11px; }
.ops-levels {
  display: grid;
  grid-template-columns: 1.45fr repeat(30, minmax(0, 1fr));
  gap: 0;
  min-width: 0;
  container-type: inline-size;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.ops-levels button {
  min-width: 0;
  min-height: 38px;
  padding: 0 2px;
  overflow: hidden;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--muted);
  font-size: clamp(10px, 1.25cqw, 12px);
  font-weight: 650;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.ops-levels button.is-all { font-weight: 800; color: var(--text); }
.ops-levels button.active {
  border-bottom-color: var(--info);
  color: var(--info);
  font-weight: 800;
  background: var(--info-soft);
}
.ops-level-label { margin: 10px 0 12px; font-size: 13px; font-weight: 700; }
.ops-link, .ops-linkish { border: 0; background: transparent; color: var(--primary); }
.ops-bonus { margin-bottom: 12px; }
.ops-bonus-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px 0; }
.ops-bonus table { width: 100%; }
.ops-pct { display: flex; align-items: center; gap: 4px; }
.ops-pct .input { max-width: 72px; }

.cb-nav {
  margin-bottom: 12px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.cb-game-tabs {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  gap: 0;
  margin: 0;
  overflow: auto;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
.cb-game-tabs button {
  flex: 0 0 auto;
  min-height: 42px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  padding: 0 18px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  white-space: nowrap;
}
.cb-game-tabs button.active {
  border-bottom-color: var(--text);
  color: var(--text);
  background: transparent;
  font-weight: 800;
}
.cb-levels {
  display: grid;
  grid-template-columns: 1.2fr repeat(30, minmax(0, 1fr));
  gap: 0;
  min-width: 0;
  container-type: inline-size;
}
.cb-levels button {
  min-width: 0;
  min-height: 38px;
  padding: 0 2px;
  overflow: hidden;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: clamp(10px, 1.2cqw, 12px);
  font-weight: 650;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.cb-levels button.is-all { font-weight: 800; }
.cb-levels button.active {
  color: var(--info);
  font-weight: 800;
  background: transparent;
}
.cb-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin: 12px 0;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.cb-toolbar strong { display: block; font-size: 13px; }
.cb-toolbar p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.cb-toolbar-actions { display: flex; gap: 8px; flex: 0 0 auto; }
.cb-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.cb-kpis article { padding: 12px 14px; }
.cb-kpis span { color: var(--muted); font-size: 11px; }
.cb-kpis strong { display: block; margin-top: 4px; font-size: 18px; font-weight: 800; }
.cb-kpis .info { color: var(--info); }
.cb-kpis .gold { color: #e0c36a; }
.cb-kpis .muted { color: var(--muted); font-weight: 700; }
.cb-board { display: grid; gap: 12px; }
.cb-cat { padding: 0; overflow: visible; }
.cb-cat-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-2);
}
.cb-cat-head h3 { margin: 0; font-size: 14px; }
.cb-cat-head p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.cb-cat-head span { color: var(--muted); font-size: 11px; font-weight: 700; }
.cb-rules {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
}
.cb-cat[data-count="2"] .cb-rules { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cb-rule {
  min-width: 0;
  padding: 16px;
  border-right: 1px solid var(--line);
  background: var(--surface);
}
.cb-rule:last-child { border-right: 0; }
.cb-rule.is-idle { opacity: .62; }
.cb-rule-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.cb-rule-head b { display: block; font-size: 13px; }
.cb-rule-head p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.cb-rule-flags { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.cb-active { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; }
.cb-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px 10px;
  align-items: end;
}
.cb-ignore {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
}
.cb-na { color: var(--muted); font-size: 11px; }
.cb-msg {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}
.cb-msg-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.cb-msg-head strong { display: block; font-size: 12px; }
.cb-msg-head p { margin: 2px 0 0; color: var(--muted); font-size: 10px; }
.cb-msg-body { display: none; gap: 8px; margin-top: 10px; }
.cb-msg.is-on .cb-msg-body { display: grid; }
.cb-msg-text { resize: vertical; min-height: 72px; }
.cb-tokens { display: flex; flex-wrap: wrap; gap: 6px; }
.cb-tokens button {
  min-height: 24px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface);
  padding: 0 8px;
  color: var(--info);
  font-size: 10px;
  font-weight: 700;
}
.cb-msg-preview {
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--surface-3);
}
.cb-msg-preview span { color: var(--muted); font-size: 10px; }
.cb-msg-preview p { margin: 6px 0 0; font-size: 12px; line-height: 1.5; white-space: pre-wrap; }
.cb-msg-actions { display: flex; justify-content: flex-end; gap: 8px; }
@media (max-width: 1280px) {
  .cb-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cb-rules, .cb-cat[data-count="2"] .cb-rules { grid-template-columns: 1fr; }
  .cb-rule { border-right: 0; border-bottom: 1px solid var(--line); }
  .cb-rule:last-child { border-bottom: 0; }
  .cb-rule-head, .cb-rule-flags { flex-wrap: wrap; }
}
.ops-hot-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.ops-hot-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 12px; }
.ops-hot-list, .ops-hot-order, .ops-vendor-list, .ops-pos-list { display: grid; }
.ops-hot-item, .ops-hot-order li, .ops-vendor-list label, .ops-pos-list li {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line);
}
.ops-hot-item div, .ops-hot-order li div { flex: 1; min-width: 0; }
.ops-hot-item small, .ops-sub { display: block; color: var(--muted); font-size: 11px; }
.ops-thumb { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; color: white; font-weight: 800; }
.ops-empty { min-height: 220px; display: grid; place-content: center; text-align: center; color: var(--muted); }
.ops-hot-order { margin: 0; padding: 0; list-style: none; }
.ops-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.ops-pos-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 12px; }
.ops-check-all { display: flex; gap: 8px; margin: 10px 0; font-size: 12px; }
.ops-vendor-list label { justify-content: flex-start; }
.ops-vendor-list span { margin-left: auto; color: var(--muted); font-size: 11px; }
.ops-pos-list { margin: 0; padding: 0; list-style: none; }
.ops-pos-tools { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.ops-grip { color: var(--muted); }
.ops-grip svg { width: 14px; height: 14px; }
.av-page {
  max-width: 860px;
}
.av-hero {
  padding: 28px 32px 24px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
}
.av-top {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 28px;
}
.av-mark {
  width: 46px;
  height: 46px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(160deg, #4aa3e0, #1d4f73);
  color: #f4fbff;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.06em;
}
.av-top strong {
  display: block;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0.04em;
}
.av-top p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.av-status {
  margin-left: auto;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.av-status.is-ok {
  background: rgb(52 211 153 / .16);
  color: #34d399;
}
.av-status.is-bad {
  background: rgb(251 113 133 / .16);
  color: #fb7185;
}
.av-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.av-metric {
  min-height: 84px;
  display: grid;
  align-content: center;
  justify-items: center;
  padding: 8px 10px;
  border-radius: 12px;
  background: var(--surface-2, var(--surface-3));
}
.av-metric span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}
.av-metric strong {
  margin-top: 8px;
  font-size: 28px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.04em;
  line-height: 1.1;
}
.av-metric strong.is-flat { color: var(--text); }
.av-meta {
  margin: 22px 0 0;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
[data-theme="dark"] .av-hero { background: #121a28; border-color: #243044; }
[data-theme="dark"] .av-metric { background: #0f1622; }
.ops-point-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.ops-verify-head { padding: 12px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.ops-verify-head span, .ops-point-kpis span { color: var(--muted); font-size: 11px; }
.ops-verify-head strong, .ops-point-kpis strong { display: block; margin-top: 4px; font-size: 18px; }
.pos, .ops-point-kpis .pos, .ops-verify-head .pos { color: var(--success); }
.neg, .ops-point-kpis .neg, .ops-verify-head .neg { color: var(--danger); }
.ops-subhead { margin: 16px 0 8px; color: var(--muted); font-size: 12px; }
.ops-error-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.ops-error-kpi { padding: 14px; border-color: #fecaca; background: #fff7f7; }
[data-theme="dark"] .ops-error-kpi { border-color: #7f1d1d; background: #2a1212; }
.ops-error-kpi.quiet { border-color: var(--line); background: var(--surface); }
.ops-error-kpi span { color: var(--muted); font-size: 11px; }
.ops-error-kpi strong { display: block; margin-top: 6px; color: #b91c1c; font-size: 20px; }
.ops-error-kpi.quiet strong { color: var(--text); font-size: 14px; }
.ops-event-tabs { display: grid; gap: 0; }
.ops-rolling { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 12px; }
.ops-row-tools { display: flex; align-items: center; gap: 6px; }
.ops-ol { margin: 0; padding-left: 18px; color: var(--muted); font-size: 12px; }
.ops-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.ops-flow span { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-3); font-size: 12px; }

.lobby-maint-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.lobby-maint-kpi { padding: 12px 14px; }
.lobby-maint-kpi span { color: var(--muted); font-size: 11px; }
.lobby-maint-kpi strong { display: block; margin-top: 4px; font-size: 22px; font-weight: 800; }
.lobby-maint-kpi .danger { color: var(--danger); }
.lobby-maint-kpi .warning { color: var(--warning); }
.lobby-maint-kpi .success { color: var(--success); }
.lobby-maint-kpi .info { color: var(--info); }
.lobby-maint {
  display: grid;
  grid-template-columns: 300px 300px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.lobby-maint-work {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 12px;
  align-items: start;
  min-width: 0;
}
.lobby-maint-menu-head,
.lobby-maint-editor-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.lobby-maint-menu-head h2,
.lobby-maint-editor-head h2 { margin: 0; font-size: 14px; }
.lobby-maint-menu-head p,
.lobby-maint-editor-head p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.lobby-maint-menu-card,
.lobby-maint-editor,
.lobby-maint-preview-card { padding: 16px; }
.lobby-menu-preview {
  display: grid;
  gap: 8px;
  max-height: 560px;
  overflow: auto;
  padding: 14px;
  border-radius: 16px;
  background: #0b1220;
}
.lobby-menu-mark {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  color: #d7ecfb;
  background: #1a3a55;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: -.04em;
}
.lobby-maint-inherit {
  margin: 0 0 12px;
  padding: 8px 10px;
  border-radius: 8px;
  color: #e0b84a;
  background: #2a2616;
  font-size: 11px;
}
.lobby-menu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  border: 1.5px solid #3d7eb3;
  border-radius: 12px;
  padding: 0 12px;
  color: #e8eef5;
  background: linear-gradient(#141d30, #101827);
  box-shadow: inset 0 0 12px rgb(70 150 210 / .12);
  text-align: left;
}
.lobby-menu-item i { display: grid; place-items: center; color: #8ec6ef; }
.lobby-menu-item i svg { width: 16px; height: 16px; }
.lobby-menu-item > span { flex: 1; min-width: 0; font-size: 13px; font-weight: 700; line-height: 1.25; }
.lobby-menu-item > svg { width: 14px; height: 14px; color: #7aa3c7; }
.lobby-menu-item.is-selected {
  border-color: #7ec3f0;
  background: #17324a;
  box-shadow: 0 0 0 1px rgb(126 195 240 / .25);
}
.lobby-menu-item.is-active { border-color: #c45c5c; }
.lobby-menu-item.is-scheduled { border-color: #c9a24a; }
.lobby-menu-tag {
  padding: 2px 7px;
  border-radius: 6px;
  color: #7ee0d0;
  background: #16343d;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
}
.lobby-menu-item .badge { margin-left: 0; }
.lobby-maint-modes,
.lobby-maint-presets { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.lobby-maint-modes button,
.lobby-maint-presets button {
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 10px;
  color: var(--text);
  background: var(--surface-2);
  font-size: 11px;
  font-weight: 650;
}
.lobby-maint-modes button.active {
  border-color: var(--warning);
  color: var(--warning);
  background: var(--warning-soft);
}
.lobby-maint-times { margin-bottom: 12px; }
.lobby-maint-preview-card { min-height: 100%; }
.lobby-maint-phone {
  max-width: 240px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid #1e334c;
  border-radius: 22px;
  background: #070f1c;
  color: #d7e3ef;
  box-shadow: 0 16px 30px rgb(0 0 0 / .35);
}
.lobby-maint-phone-bar {
  display: flex;
  justify-content: center;
  gap: 4px;
  padding: 10px 0 4px;
}
.lobby-maint-phone-bar span { width: 6px; height: 6px; border-radius: 50%; background: #2a425c; }
.lobby-maint-phone-brand {
  padding: 4px 0 10px;
  color: #f0c45c;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .14em;
  text-align: center;
}
.lobby-maint-phone-body {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 8px 18px 22px;
  text-align: center;
}
.lobby-maint-phone-body i { color: #e0b84a; }
.lobby-maint-phone-body i svg { width: 28px; height: 28px; }
.lobby-maint-phone-body strong { font-size: 15px; }
.lobby-maint-phone-body em { color: #8ec6ef; font-style: normal; font-size: 12px; }
.lobby-maint-phone-body p { margin: 0; color: #9fb1c4; font-size: 11px; line-height: 1.55; }
.lobby-maint-window,
.lobby-maint-remain {
  display: block;
  padding: 6px 8px;
  border-radius: 8px;
  background: #122033;
  font-size: 10px;
}
.lobby-maint-remain { color: #e0b84a; }
.lobby-maint-cs {
  min-height: 32px;
  margin-top: 4px;
  border: 0;
  border-radius: 8px;
  padding: 0 14px;
  color: #081018;
  background: #e0b84a;
  font-size: 11px;
  font-weight: 800;
}
.lobby-maint-phone[data-status="normal"] .lobby-maint-phone-body i { color: #34d399; }
.lobby-maint-presets button:hover {
  border-color: var(--line-strong);
  background: var(--surface-3);
}
@media (max-width: 1180px) {
  .lobby-maint,
  .lobby-maint-kpis,
  .ops-charge-grid, .ops-sites, .ops-hot-grid, .ops-pos-grid, .ops-rolling, .ops-site-body, .ops-error-kpis, .ops-meta-row, .ops-stat-row, .ops-hot-filters {
    grid-template-columns: 1fr;
  }
  .lobby-maint {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .lobby-maint-work {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .lobby-maint {
    grid-template-columns: 1fr;
  }
}

.coupon-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.coupon-kpis .lobby-maint-kpi { padding: 14px 16px; }
.lobby-maint-kpi .gold { color: #e0c36a; }
.lobby-maint-kpi .muted { color: var(--muted); }
.coupon-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  padding: 0 4px;
  border-bottom: 1px solid var(--line);
}
.coupon-tab {
  min-height: 40px;
  border: 0;
  border-bottom: 2px solid transparent;
  padding: 0 16px;
  color: var(--muted);
  background: transparent;
  font-size: 12px;
  font-weight: 650;
}
.coupon-tab.active {
  border-bottom-color: var(--info);
  color: var(--info);
}
.coupon-work {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr) 360px;
  gap: 16px;
  align-items: start;
}
.coupon-pane {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 16px;
  align-items: start;
}
.coupon-catalog,
.coupon-edit-card,
.coupon-preview-card,
.coupon-work > .card,
.coupon-pane > .card,
.coupon-tabs + .card {
  min-height: 100%;
  padding: 18px 20px 20px;
}
.coupon-catalog-head,
.coupon-editor-head,
.coupon-preview-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.coupon-catalog-head h2,
.coupon-editor-head h2,
.coupon-preview-head h2 { margin: 0; font-size: 14px; }
.coupon-catalog-head p,
.coupon-editor-head p,
.coupon-preview-head p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.coupon-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  white-space: nowrap;
  color: var(--muted);
  cursor: pointer;
}
.coupon-search { display: block; margin-bottom: 14px; }
.coupon-catalog-list { display: grid; gap: 10px; }
.coupon-catalog-item {
  display: grid;
  grid-template-columns: 72px 1fr auto;
  grid-template-rows: auto auto;
  column-gap: 10px;
  row-gap: 2px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
  color: var(--text);
  background: var(--surface-2);
  text-align: left;
}
.coupon-catalog-item b {
  grid-row: 1 / 3;
  align-self: center;
  color: #7dd3fc;
  font-size: 13px;
}
.coupon-catalog-item.mint b { color: #6ee7b7; }
.coupon-catalog-item.navy b { color: #93c5fd; }
.coupon-catalog-item span { grid-column: 2; grid-row: 1; font-size: 12px; font-weight: 700; }
.coupon-catalog-item small { grid-column: 2; grid-row: 2; color: var(--muted); font-size: 10px; }
.coupon-catalog-item .badge { grid-column: 3; grid-row: 1 / 3; align-self: center; }
.coupon-catalog-item.is-selected {
  border-color: #7ec3f0;
  background: #17324a;
}
.coupon-form { padding: 0; gap: 16px; }
.coupon-code-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
}
.coupon-mission-meter { margin-top: 16px; }
.coupon-member {
  overflow: hidden;
  border: 1px solid #1e334c;
  border-radius: 14px;
  padding: 16px;
  background: #0c121c;
  color: #d7e3ef;
}
.coupon-m-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}
.coupon-m-kpis article {
  border: 1px solid #24364c;
  border-radius: 10px;
  padding: 12px;
  background: #141c28;
}
.coupon-m-kpis i { color: #7dd3fc; }
.coupon-m-kpis i svg { width: 16px; height: 16px; }
.coupon-m-kpis span { display: block; margin: 4px 0 2px; color: #8ea3b8; font-size: 10px; }
.coupon-m-kpis strong { font-size: 16px; }
.coupon-m-progress { grid-column: 1 / -1; }
.coupon-m-progress em { display: block; margin: 2px 0 6px; font-style: normal; font-size: 12px; font-weight: 700; }
.coupon-m-bar {
  height: 6px;
  overflow: hidden;
  border-radius: 99px;
  background: #1d334c;
}
.coupon-m-bar i { display: block; height: 100%; background: #38bdf8; }
.coupon-m-progress small { display: block; margin-top: 6px; color: #8ea3b8; font-size: 10px; }
.coupon-m-register {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
  border: 1px solid #24364c;
  border-radius: 10px;
  padding: 10px;
  background: #141c28;
}
.coupon-m-register strong { font-size: 12px; }
.coupon-m-register > div { display: flex; gap: 6px; }
.coupon-m-register input {
  flex: 1;
  height: 28px;
  border: 1px solid #2a455f;
  border-radius: 6px;
  padding: 0 8px;
  color: #8ea3b8;
  background: #0c121c;
  font-size: 11px;
}
.coupon-m-register button {
  height: 28px;
  border: 0;
  border-radius: 6px;
  padding: 0 10px;
  color: #052033;
  background: #38bdf8;
  font-size: 11px;
  font-weight: 700;
}
.coupon-m-register aside { color: #8ea3b8; font-size: 10px; }
.coupon-m-register aside b { display: block; margin-bottom: 4px; color: #7dd3fc; }
.coupon-m-register p { margin: 0; }
.coupon-m-tabs { display: flex; gap: 8px; margin-bottom: 10px; }
.coupon-m-tabs span { color: #8ea3b8; font-size: 11px; }
.coupon-m-tabs .is-on { color: #7dd3fc; font-weight: 700; }
.coupon-m-list { display: grid; gap: 8px; }
.coupon-m-card {
  display: grid;
  grid-template-columns: 88px 1fr;
  overflow: hidden;
  border: 1px solid #24364c;
  border-radius: 10px;
  background: #141c28;
}
.coupon-m-face {
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 6px;
  padding: 12px 10px;
  border-right: 3px solid #38bdf8;
}
.coupon-m-card.mint .coupon-m-face { border-right-color: #34d399; }
.coupon-m-card.navy .coupon-m-face { border-right-color: #60a5fa; }
.coupon-m-face strong { font-size: 15px; font-weight: 800; }
.coupon-m-card.mint .coupon-m-face strong { color: #6ee7b7; }
.coupon-m-card.navy .coupon-m-face strong { color: #93c5fd; }
.coupon-m-card.sky .coupon-m-face strong { color: #7dd3fc; }
.coupon-m-face em { color: #8ea3b8; font-style: normal; font-size: 9px; line-height: 1.3; }
.coupon-m-body { display: grid; gap: 2px; padding: 10px; }
.coupon-m-body b { font-size: 12px; }
.coupon-m-body span,
.coupon-m-body small { color: #8ea3b8; font-size: 10px; }
.coupon-m-body button {
  margin-top: 6px;
  height: 26px;
  border: 0;
  border-radius: 6px;
  color: #052033;
  background: #38bdf8;
  font-size: 11px;
  font-weight: 700;
}
.coupon-m-empty { color: #8ea3b8; font-size: 12px; }
.coupon-m-history { margin-top: 10px; border: 1px solid #24364c; border-radius: 10px; background: #141c28; }
.coupon-m-history header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  border-bottom: 1px solid #24364c;
  font-size: 11px;
}
.coupon-m-history em { color: #8ea3b8; font-style: normal; }
.coupon-m-history table { width: 100%; }
.coupon-m-history th,
.coupon-m-history td { padding: 6px 8px; color: #9fb4c8; font-size: 9px; }
.coupon-m-history th { color: #7b91a6; }
@media (max-width: 1280px) {
  .coupon-kpis,
  .coupon-work,
  .coupon-pane,
  .promo-work { grid-template-columns: 1fr; }
}

.promo-kpis { margin-bottom: 16px; }
.promo-tabs { gap: 8px; margin-bottom: 16px; padding: 0 4px; }
.promo-tabs .coupon-tab { padding: 0 16px; }
.promo-work {
  display: grid;
  grid-template-columns: 300px minmax(320px, 1fr) minmax(380px, 1.15fr);
  gap: 16px;
  align-items: start;
}
.promo-catalog,
.promo-edit-card,
.promo-preview-card {
  min-height: 100%;
  padding: 18px 20px 20px;
}
.promo-catalog .coupon-catalog-head,
.promo-edit-card .coupon-editor-head,
.promo-preview-card .coupon-preview-head { margin-bottom: 16px; }
.promo-catalog .form-field { margin-bottom: 4px; }
.promo-catalog-list { display: grid; gap: 10px; margin-top: 14px; }
.promo-catalog-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px;
  align-items: center;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px;
  color: var(--text);
  background: var(--surface-2);
}
.promo-catalog-select {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  gap: 8px 12px;
  align-items: center;
  width: 100%;
  border: 0;
  padding: 4px;
  color: inherit;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.promo-catalog-item.is-selected {
  border-color: color-mix(in srgb, var(--info) 55%, var(--line));
  background: color-mix(in srgb, var(--info-soft) 70%, var(--surface));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--info) 25%, transparent);
}
.promo-catalog-copy { min-width: 0; display: grid; gap: 2px; }
.promo-catalog-name {
  display: block;
  overflow: hidden;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.promo-catalog-copy small {
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.promo-catalog-meta {
  display: grid;
  justify-items: end;
  gap: 4px;
}
.promo-catalog-meta em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-variant-numeric: tabular-nums;
}
.promo-catalog-tools { display: grid; gap: 2px; }
.promo-catalog-tools .icon-button {
  width: 26px;
  height: 26px;
  min-height: 26px;
  padding: 0;
  font-size: 12px;
}
.promo-catalog-tools .icon-button:disabled {
  opacity: 0.28;
  cursor: default;
}
.promo-showcase {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-2);
}
.promo-showcase-visual {
  position: relative;
  aspect-ratio: 940 / 425;
  overflow: hidden;
  background: #0a111b;
}
.promo-showcase-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.promo-showcase-visual.is-clip img {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(var(--n) * 100%);
  height: 138%;
  object-fit: cover;
  object-position: center bottom;
  transform: translateX(calc(var(--i) * -100% / var(--n)));
}
.promo-showcase-copy {
  display: grid;
  gap: 6px;
  place-content: center;
  height: 100%;
  padding: 20px;
  text-align: center;
  color: #e8eef8;
  text-shadow: 0 1px 8px rgb(0 0 0 / 0.5);
}
.promo-showcase-copy em { font-size: 10px; font-style: normal; letter-spacing: 0.12em; color: #c9d6ea; }
.promo-showcase-copy b { font-size: 22px; letter-spacing: -0.04em; }
.promo-showcase-copy strong { color: #f4d37a; font-size: 18px; }
.promo-showcase-order,
.promo-showcase-status {
  position: absolute;
  z-index: 1;
  top: 10px;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 800;
}
.promo-showcase-order {
  left: 10px;
  color: #fff;
  background: rgb(5 9 15 / 0.76);
}
.promo-showcase-status {
  right: 10px;
  border-radius: 999px;
}
.promo-showcase-status.is-on { color: #34d399; background: rgb(52 211 153 / 0.16); }
.promo-showcase-status.is-wait { color: #fbbf24; background: rgb(251 191 36 / 0.16); }
.promo-showcase-status.is-end { color: #94a3b8; background: rgb(148 163 184 / 0.16); }
.promo-showcase-status.is-off { color: #f87171; background: rgb(248 113 113 / 0.16); }
.promo-showcase.is-off .promo-showcase-visual img { filter: grayscale(0.7) brightness(0.6); }
.promo-showcase-body { padding: 14px 16px 16px; }
.promo-showcase-body h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
}
.promo-showcase-body p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.promo-showcase-meta {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
}
.promo-showcase-empty {
  display: grid;
  min-height: 180px;
  place-items: center;
  color: var(--muted);
  font-size: 12px;
}
.promo-thumb {
  position: relative;
  display: block;
  width: 76px;
  height: 48px;
  overflow: hidden;
  border-radius: 8px;
  background: #101827;
}
.promo-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.promo-thumb b {
  display: grid;
  place-items: center;
  height: 100%;
  color: #f4e1a4;
  font-size: 16px;
}
.promo-editor .coupon-form { gap: 16px; }
.promo-editor-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
}
.promo-upload small { display: block; margin-top: 6px; color: var(--muted); }
.promo-upload input[type="file"] { width: 100%; font-size: 12px; }
.promo-size-guide {
  margin: 0 0 12px;
  padding: 12px 14px;
  border: 1px dashed color-mix(in srgb, var(--info) 35%, var(--line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--info-soft) 55%, var(--surface));
}
.promo-size-guide strong {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.promo-size-guide b {
  display: block;
  margin-top: 4px;
  color: var(--text);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.promo-size-guide p {
  margin: 4px 0 0;
  color: var(--text);
  font-size: 12px;
}
.promo-size-guide small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
}
.promo-position {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.promo-position button {
  display: grid;
  justify-items: center;
  gap: 8px;
  min-height: 72px;
  padding: 10px 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--muted);
  background: var(--surface-2);
}
.promo-position button.is-on {
  border-color: color-mix(in srgb, var(--info) 55%, var(--line));
  color: var(--info);
  background: color-mix(in srgb, var(--info-soft) 70%, var(--surface));
}
.promo-position em { font-size: 11px; font-style: normal; font-weight: 700; }
.promo-position-map {
  position: relative;
  width: 44px;
  height: 30px;
  border: 1px solid currentColor;
  border-radius: 4px;
  opacity: 0.9;
}
.promo-position-map i {
  position: absolute;
  top: 50%;
  width: 9px;
  height: 16px;
  border-radius: 2px;
  background: currentColor;
  transform: translateY(-50%);
}
.promo-position button[data-value="far-left"] .promo-position-map i { left: 2px; }
.promo-position button[data-value="left"] .promo-position-map i { left: 12px; }
.promo-position button[data-value="center"] .promo-position-map i { left: 50%; transform: translate(-50%, -50%); }
.promo-position button[data-value="right"] .promo-position-map i { right: 12px; }
.promo-position button[data-value="far-right"] .promo-position-map i { right: 2px; }
.promo-popup-stage {
  display: grid;
  min-height: 320px;
  padding: 16px;
  border-radius: 14px;
  background:
    linear-gradient(rgb(7 11 20 / 0.55), rgb(7 11 20 / 0.7)),
    radial-gradient(circle at 20% 20%, #1e3a5f, #070b14 62%);
}
.promo-popup-stage.is-center { justify-items: center; }
.promo-popup-stage.is-far-left { justify-items: start; padding-left: 8px; }
.promo-popup-stage.is-left { justify-items: start; padding-left: 48px; }
.promo-popup-stage.is-right { justify-items: end; padding-right: 48px; }
.promo-popup-stage.is-far-right { justify-items: end; padding-right: 8px; }
.promo-popup-stage .promo-showcase {
  width: min(100%, 260px);
}
.promo-popup-stage .promo-showcase-visual { aspect-ratio: 4 / 5; }
.promo-form .setting-row.full,
.promo-editor .setting-row.full { grid-column: 1 / -1; }
.promo-preview-note {
  margin: 14px 2px 0;
  color: var(--muted);
  font-size: 11px;
}
.promo-preview-note b { color: var(--text); }
.promo-member {
  overflow: hidden;
  border-radius: 16px;
  color: #e8eef8;
  background: #070b14;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.06);
}
.promo-member-chrome {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px 8px;
  color: #9fb0c6;
  font-size: 11px;
}
.promo-member-chrome span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border: 1px solid rgb(255 255 255 / 0.12);
  border-radius: 999px;
  background: rgb(255 255 255 / 0.04);
}
.promo-member-chrome nav { display: flex; align-items: center; gap: 6px; }
.promo-member-chrome i { color: #6d7f96; font-style: normal; }
.promo-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 0 10px 12px;
}
.promo-member.is-photo { background: transparent; box-shadow: none; }
.promo-strip-photo {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  background: #070b14;
}
.promo-strip-photo img {
  display: block;
  width: 100%;
  height: auto;
}
.promo-strip-hit {
  position: absolute;
  top: 42px;
  bottom: 8px;
  border: 0;
  border-radius: 12px;
  background: transparent;
}
.promo-strip-hit.is-on {
  box-shadow: inset 0 0 0 2px #60a5fa, 0 8px 18px rgb(15 23 42 / 0.28);
  background: rgb(96 165 250 / 0.08);
}
.promo-strip-hit.is-off { opacity: 0.35; }
.promo-slide,
.promo-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 0.08);
  background: #101827;
}
.promo-slide {
  min-height: 118px;
  border-radius: 12px;
  cursor: pointer;
}
.promo-slide img,
.promo-hero img,
.promo-popup-card img,
.promo-popup-page img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.promo-slide img { position: absolute; inset: 0; }
.promo-slide.is-on {
  outline: 2px solid #60a5fa;
  outline-offset: 1px;
  box-shadow: 0 10px 24px rgb(0 0 0 / 0.35);
}
.promo-slide.is-off,
.promo-hero.is-off { opacity: 0.45; }
.promo-slide-copy,
.promo-hero-copy {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 4px;
  padding: 12px;
  text-shadow: 0 1px 8px rgb(0 0 0 / 0.55);
}
.promo-slide-copy em,
.promo-hero-copy em {
  color: #c9d6ea;
  font-size: 9px;
  font-style: normal;
  letter-spacing: 0.12em;
}
.promo-slide-copy b,
.promo-hero-copy b { font-size: 13px; letter-spacing: -0.03em; }
.promo-slide-copy strong { color: #f4d37a; font-size: 16px; letter-spacing: -0.04em; }
.promo-slide-copy small { color: #b7c4d6; font-size: 9px; }
.promo-slide-index {
  position: absolute;
  right: 8px;
  bottom: 7px;
  z-index: 1;
  color: rgb(255 255 255 / 0.72);
  font-size: 9px;
  font-variant-numeric: tabular-nums;
}
.promo-hero {
  min-height: 210px;
  border-radius: 16px;
}
.promo-hero:has(img) {
  min-height: 0;
  border: 0;
  background: #070b14;
}
.promo-hero img { min-height: 210px; }
.promo-hero:has(img) img {
  min-height: 0;
  height: auto;
  object-fit: contain;
}
.promo-hero-copy { position: absolute; left: 22px; top: 28px; max-width: 58%; }
.promo-hero-copy b { font-size: 28px; line-height: 1.05; }
.promo-hero-copy p { margin: 0; color: #c5d0e0; font-size: 12px; }
.promo-hero-actions { display: flex; gap: 8px; margin-top: 10px; }
.promo-hero-actions span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: linear-gradient(180deg, #6d7cff, #4f46e5);
  font-size: 11px;
  font-weight: 700;
}
.promo-hero-actions span:last-child {
  border: 1px solid rgb(255 255 255 / 0.16);
  background: rgb(8 14 28 / 0.55);
}
.promo-hero-pager {
  position: absolute;
  left: 18px;
  bottom: 14px;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #d5deea;
  font-size: 11px;
}
.promo-hero-pager i {
  display: block;
  width: 72px;
  height: 3px;
  border-radius: 99px;
  background: linear-gradient(90deg, #60a5fa, rgb(255 255 255 / 0.15));
}
.promo-popup-stage {
  position: relative;
  min-height: 280px;
}
.promo-popup-page {
  height: 280px;
  filter: blur(2px) saturate(0.85);
  transform: scale(1.04);
}
.promo-popup-dim {
  position: absolute;
  inset: 0;
  display: grid;
  padding: 18px;
  background: rgb(4 8 16 / 0.55);
}
.promo-popup-card {
  overflow: hidden;
  width: min(100%, 300px);
  border-radius: 14px;
  background: #0d1422;
  box-shadow: 0 24px 48px rgb(0 0 0 / 0.45);
  align-self: center;
  justify-self: center;
}
.promo-popup-card.is-left { justify-self: start; }
.promo-popup-card.is-right { justify-self: end; }
.promo-popup-card img {
  height: 176px;
  object-position: 0 48%;
}
.promo-popup-fallback {
  display: grid;
  gap: 6px;
  min-height: 168px;
  place-content: center;
  padding: 20px;
  text-align: center;
}
.promo-popup-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px 10px;
  color: #b7c4d6;
  font-size: 10px;
  background: #101827;
}
.promo-popup-bar button {
  min-height: 26px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  color: #e8eef8;
  background: #243044;
}
.promo-popup-empty {
  display: grid;
  min-height: 180px;
  place-items: center;
  color: #8ea0b8;
  font-size: 12px;
}
.theme-baccarat { background: radial-gradient(120% 90% at 20% 20%, #3b1d73, #12091f 70%); }
.theme-sutda { background: radial-gradient(120% 90% at 80% 10%, #f3c56b, #7a3a12 62%); }
.theme-powerball { background: radial-gradient(120% 90% at 70% 20%, #2a6dff, #071430 68%); }
.theme-hunter { background: radial-gradient(120% 90% at 15% 20%, #ff6ad5, #4b1148 70%); }
.theme-daily { background: radial-gradient(120% 90% at 50% 0%, #ffe27a, #0f6d8a 62%); }
.theme-aviatrix { background: radial-gradient(120% 90% at 85% 15%, #ff7a4d, #3b0d46 68%); }
.theme-roulette { background: radial-gradient(90% 80% at 70% 40%, #245b9a, #07111f 62%); }
.theme-live { background: radial-gradient(90% 80% at 30% 20%, #7c3aed, #12061f 64%); }
.theme-slothero { background: radial-gradient(90% 80% at 80% 10%, #f59e0b, #1f1205 66%); }
.theme-welcome { background: radial-gradient(90% 80% at 50% 0%, #60a5fa, #0b1220 70%); }
.theme-weekend { background: radial-gradient(90% 80% at 80% 0%, #34d399, #082016 70%); }

.attb-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 16px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
}
.attb-tabs-3 { grid-template-columns: 1fr 1fr 1fr; }
.attb-tabs-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
.attb-tabs-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.attb-tabs-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.attb-tabs button {
  min-height: 44px;
  border: 0;
  border-radius: 8px;
  padding: 10px 18px;
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}
.attb-tabs button.active {
  background: var(--bg);
  color: var(--text);
  font-weight: 700;
  box-shadow: var(--shadow);
}
.attb-log-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.attb-log-kpis .card {
  display: grid;
  gap: 6px;
  min-height: 84px;
  padding: 16px 18px;
}
.attb-log-kpis .card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}
.attb-log-kpis .card strong {
  display: block;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.attb-log-filter { align-items: end; }
.attb-log-modes { min-width: 210px; }
.attb-log-range .input { width: 148px; }
.attb-logs table { min-width: 1180px; }
.attb-log-delta { font-variant-numeric: tabular-nums; white-space: nowrap; }
.attb-log-delta b { color: var(--muted); font-weight: 500; }
.attb-log-delta span { margin: 0 6px; color: var(--muted); }
.attb-log-reason {
  max-width: 240px;
  white-space: normal;
  color: var(--muted);
}
.attb-log-empty {
  height: 120px;
  text-align: center;
  color: var(--muted);
}
.attb-members table { min-width: 1180px; }
.attb-members th,
.attb-members td {
  height: auto;
  padding: 12px;
  vertical-align: middle;
}
.attb-members .table-footer {
  padding: 12px;
}
.attb-paid { display: grid; gap: 1px; line-height: 1.2; }
.attb-paid small { color: var(--muted); font-size: 11px; }
.attb-manage-cell { white-space: nowrap; }
.attb-manage { display: inline-flex; gap: 8px; }
.attb-manage .btn-sm {
  min-height: 28px;
  padding: 5px 10px;
}
.attb-coupon-give {
  border-color: color-mix(in srgb, var(--success) 40%, var(--line));
  background: var(--success-soft);
  color: var(--success);
}
.attb-coupon-take {
  border-color: color-mix(in srgb, var(--danger) 40%, var(--line));
  background: var(--danger-soft);
  color: var(--danger);
}
.attb-work {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(420px, 0.92fr);
  gap: 16px;
  align-items: start;
}
.attb-editor { display: grid; gap: 12px; }
.attb-card,
.attb-games-card { padding: 18px 18px 16px; }
.attb-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.attb-card-head h2 { margin: 0; font-size: 14px; }
.attb-card-head p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.attb-card-head em { font-size: 12px; font-style: normal; font-weight: 800; }
.attb-card-head em.is-ok { color: #2ea86e; }
.attb-card-head em.is-warn { color: #d97706; }
.attb-policy-grid { margin-top: 8px; }
.attb-game-list { display: grid; gap: 8px; }
.attb-game {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}
.attb-game.is-on { border-color: color-mix(in srgb, var(--info) 35%, var(--line)); background: var(--surface); }
.attb-game-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.attb-game-top strong { font-size: 13px; }
.attb-game-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.attb-game-fields label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 10px;
}
.attb-reward-rows { display: grid; gap: 8px; }
.attb-reward-row {
  display: grid;
  grid-template-columns: minmax(150px, 0.9fr) minmax(220px, 1.5fr) minmax(90px, 0.7fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}
.attb-type { min-width: 0; font-size: 12px; }
.attb-day,
.attb-qty { display: flex; align-items: center; gap: 6px; min-width: 0; }
.attb-day span,
.attb-qty span { color: var(--muted); font-size: 11px; white-space: nowrap; }
.attb-pay {
  padding: 4px 8px;
  border-radius: 6px;
  background: var(--success-soft);
  color: var(--success);
  font-size: 11px;
  font-weight: 700;
}
.attb-empty { margin: 0; color: var(--muted); font-size: 12px; }
.attb-games-card { position: sticky; top: 12px; }
@media (max-width: 1280px) {
  .attb-work,
  .attb-game-fields,
  .attb-reward-row { grid-template-columns: 1fr; }
  .attb-games-card { position: static; }
  .attb-log-kpis { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 1100px) {
  .promo-strip { grid-template-columns: 1fr; }
  .promo-position { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.acct-page .acct-result-count { margin-right: 12px; }
.acct-page .bulk-selected-count { margin-right: 8px; }
.acct-filter-bar > label { flex: 0 0 108px; }
.acct-filter-bar .users-keyword { max-width: none; min-width: 240px; }
.acct-reset {
  flex: 0 0 auto;
  min-height: 26px;
  border-radius: 3px;
  padding: 0 12px;
}
.acct-table-card { border-top: 0; }
.acct-table-scroll { overflow-x: auto; border-radius: 0; }
.acct-table {
  width: 100%;
  min-width: 1280px;
  table-layout: fixed;
  border-collapse: collapse;
}
.acct-table .col-check { width: 3%; }
.acct-table .col-no { width: 4.5%; }
.acct-table .col-id { width: 8.5%; }
.acct-table .col-nick { width: 8%; }
.acct-table .col-status { width: 6%; }
.acct-table .col-dist,
.acct-table .col-parent { width: 8%; }
.acct-table .col-type { width: 7.5%; }
.acct-table .col-holder { width: 7%; }
.acct-table .col-bank { width: 8%; }
.acct-table .col-account { width: 12%; }
.acct-table .col-network { width: 7.5%; }
.acct-table .col-wallet { width: 14%; }
.acct-table th {
  height: 38px;
  padding: 8px 8px;
  color: #e8eef6;
  background: #2f3b4a;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.acct-table td {
  height: 46px;
  padding: 7px 8px;
  color: var(--text);
  font-size: 12px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  border-bottom: 1px solid var(--line);
}
.acct-table tbody tr:nth-child(even) { background: var(--table-row-alt); }
.acct-table tbody tr:hover { background: var(--table-row-hover); }
.acct-table input[type="checkbox"] { width: 13px; height: 13px; accent-color: #c79535; }
.acct-no { color: var(--muted); font-variant-numeric: tabular-nums; }
.acct-id .link { font-weight: 700; }
.acct-nick { font-weight: 650; }
.acct-upline { color: #3d4d61; }
.acct-account-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.acct-number,
.acct-wallet {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.acct-wallet {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
}
.acct-note {
  color: var(--muted);
  font-size: 12px;
}
.acct-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0;
  color: var(--muted);
  background: var(--surface);
  cursor: pointer;
}
.acct-copy svg { width: 12px; height: 12px; }
.acct-copy:hover {
  color: #12304f;
  border-color: #b8c7d5;
  background: #edf3f8;
}
[data-theme="dark"] .acct-table th {
  color: #e2e8f0;
  background: #1e293b;
}
[data-theme="dark"] .acct-table td { border-color: var(--line); }
[data-theme="dark"] .acct-table tbody tr:nth-child(even) { background: var(--table-row-alt); }
[data-theme="dark"] .acct-table tbody tr:hover { background: var(--table-row-hover); }
[data-theme="dark"] .acct-upline { color: #9fb2c7; }
[data-theme="dark"] .acct-copy {
  color: #c9d5e2;
  border-color: var(--line);
  background: var(--surface-2);
}
[data-theme="dark"] .acct-copy:hover {
  color: #fff;
  border-color: #46617b;
  background: #243247;
}
@media (max-width: 1280px) {
  .acct-table { min-width: 1280px; }
}

.contact-excel-hint {
  margin: 0 4px 0 0;
  color: #c9a227;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.03em;
  white-space: nowrap;
}
[data-theme="dark"] .contact-excel-hint { color: #e6c56a; }
.contact-filter-bar > label { flex: 0 0 108px; }
.contact-filter-bar .users-keyword { max-width: none; min-width: 240px; }
.contact-page .contact-result-count { margin-right: 12px; }
.contact-table-card { border-top: 0; }
.contact-table-scroll { overflow-x: auto; border-radius: 0; }
.contact-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: collapse;
}
.contact-table .col-no { width: 5%; }
.contact-table .col-parent { width: 10%; }
.contact-table .col-holder,
.contact-table .col-id { width: 9%; }
.contact-table .col-carrier { width: 7%; }
.contact-table .col-phone,
.contact-table .col-telegram { width: 9%; }
.contact-table .col-io { width: 13%; }
.contact-table .col-iopnl { width: 9%; }
.contact-table .col-bet { width: 11%; }
.contact-table .col-status { width: 8%; }
.contact-table th {
  height: 38px;
  padding: 8px 8px;
  color: #e8eef6;
  background: #2f3b4a;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.contact-table td {
  height: 52px;
  padding: 7px 8px;
  color: var(--text);
  font-size: 12px;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid var(--line);
}
.contact-table tbody tr:nth-child(even) { background: var(--table-row-alt); }
.contact-table tbody tr:hover { background: var(--table-row-hover); }
.contact-no { color: var(--muted); font-variant-numeric: tabular-nums; }
.contact-parent { font-weight: 650; }
.contact-holder { font-weight: 650; }
.contact-id .link { font-weight: 700; }
.contact-mask {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  font-weight: 700;
}
.modal.is-contact-excel { width: min(420px, 100%); }
.contact-excel-form { display: grid; gap: 12px; }
.contact-excel-form p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}
.contact-excel-form label {
  display: grid;
  gap: 6px;
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
}
.contact-excel-form .input.is-invalid { border-color: #c45c5c; }
[data-theme="dark"] .contact-excel-form .input.is-invalid { background: #2a1c1c; }
[data-theme="dark"] .contact-table th {
  color: #e2e8f0;
  background: #1e293b;
}
[data-theme="dark"] .contact-table td { border-color: var(--line); }

.pending-count-bar {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 10px;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
}
.pending-count-bar strong {
  color: #d92b2b;
  font-size: 16px;
  font-weight: 800;
}
.pending-filter-bar { flex-wrap: wrap; }
.pending-filter-bar > label { flex: 0 0 108px; }
.pending-filter-bar .users-keyword { max-width: none; min-width: 200px; }
.pending-filter-bar .pending-bulk-allow,
.pending-filter-bar .pending-bulk-block {
  flex: 0 0 auto;
  min-height: 26px;
  border: 0;
  border-radius: 3px;
  padding: 0 12px;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.pending-filter-bar .pending-bulk-allow { background: #2aa7c9; }
.pending-filter-bar .pending-bulk-allow:hover { background: #1f91b0; color: #fff; }
.pending-filter-bar .pending-bulk-block { background: #2f3b4a; }
.pending-filter-bar .pending-bulk-block:hover { background: #24303c; color: #fff; }
.pending-table-card { border-top: 0; }
.pending-table-scroll { overflow-x: hidden; border-radius: 0; }
.pending-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: collapse;
}
.pending-table th {
  height: 34px;
  padding: 5px 4px;
  color: #e8eef6;
  background: #2f3b4a;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.pending-table td {
  height: 44px;
  padding: 5px 4px;
  color: var(--text);
  font-size: 11px;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid var(--line);
}
.pending-table tbody tr:nth-child(even) { background: var(--table-row-alt); }
.pending-table tbody tr:hover { background: var(--table-row-hover); }
.pending-col-status { width: 58px; }
.pending-col-check { width: 32px; padding-inline: 4px; }
.pending-col-id { width: 64px; }
.pending-col-nick { width: 58px; }
.pending-col-link { width: 124px; overflow: visible; }
.pending-col-holder { width: 52px; }
.pending-col-phone { width: 128px; }
.pending-col-code { width: 58px; }
.pending-col-bank { width: 58px; }
.pending-col-account { width: 96px; }
.pending-col-tether { width: 52px; }
.pending-col-wallet { width: 90px; }
.pending-col-date { width: 108px; }
.pending-col-device { width: 96px; }
.pending-col-ip { width: 148px; }
.pending-col-allow { width: 58px; }
.pending-col-reason { width: 10%; }
.pending-col-act { width: 72px; }
.pending-id .link { font-weight: 700; }
.pending-col-id,
.pending-col-nick,
.pending-col-holder,
.pending-col-bank {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pending-phone {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}
.pending-carrier {
  margin-right: 4px;
  font-weight: 800;
}
.pending-carrier.is-skt { color: #ec4899; }
.pending-carrier.is-kt { color: #ef4444; }
.pending-carrier.is-lgu { color: #818cf8; }
.pending-col-code {
  font-weight: 750;
  letter-spacing: 0.02em;
}
.pending-table .acct-account-cell { justify-content: center; gap: 3px; min-width: 0; }
.pending-table .acct-wallet,
.pending-table .acct-number {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
}
.pending-table .acct-copy {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}
.pending-table .badge {
  min-height: 18px;
  padding: 1px 5px;
  font-size: 10px;
}
.pending-date,
.pending-ip { font-variant-numeric: tabular-nums; letter-spacing: -0.03em; }
.pending-device { color: var(--text); }
.pending-device b { color: #e11d48; font-weight: 700; }
.pending-table .access-device { justify-content: center; }
.pending-link-cell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 0;
}
.pending-link-btn {
  min-width: 86px;
  min-height: 24px;
  border: 0;
  border-radius: 4px;
  padding: 0 8px;
  color: #fff;
  background: #2563eb;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.04em;
  white-space: nowrap;
  cursor: pointer;
}
.pending-link-btn:hover { background: #1d4ed8; }
.pending-link-copy {
  position: relative;
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}
.pending-link-copy.icon-tip::after {
  top: 50%;
  left: calc(100% + 8px);
  bottom: auto;
  right: auto;
  transform: translateY(-50%);
  width: max-content;
  max-width: 280px;
  padding: 7px 9px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: -0.02em;
  white-space: normal;
  word-break: break-all;
  text-align: left;
}
.pending-link-copy.icon-tip::before {
  top: 50%;
  left: calc(100% + 1px);
  bottom: auto;
  transform: translateY(-50%);
  border: 4px solid transparent;
  border-right-color: #1f2937;
}
.pending-allow {
  min-width: 44px;
  min-height: 24px;
  border: 0;
  border-radius: 4px;
  padding: 0 8px;
  color: #fff;
  background: #2aa7c9;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.pending-allow:hover { background: #1f91b0; }
.pending-block {
  min-width: 58px;
  min-height: 24px;
  border: 0;
  border-radius: 4px;
  padding: 0 8px;
  color: #fff;
  background: #2f3b4a;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.pending-block:hover { background: #1f2937; }
.pending-block.is-done,
.pending-block:disabled {
  opacity: .45;
  cursor: default;
}
.pending-reason {
  width: 100%;
  min-width: 0;
  height: 26px;
  border-radius: 4px;
  padding: 0 6px;
  font-size: 11px;
}
.pending-empty-row td {
  height: 88px;
  color: var(--muted);
  font-size: 13px;
}
[data-theme="dark"] .pending-table th {
  color: #e2e8f0;
  background: #1e293b;
}
[data-theme="dark"] .pending-table td { border-color: var(--line); }
[data-theme="dark"] .pending-table tbody tr:nth-child(even) { background: var(--table-row-alt); }
[data-theme="dark"] .pending-table tbody tr:hover { background: var(--table-row-hover); }
[data-theme="dark"] .pending-allow { background: #2393b3; }
[data-theme="dark"] .pending-block { background: #334155; }
[data-theme="dark"] .pending-count-bar strong { color: #fb7185; }

.evc-work { align-items: stretch; }
.evc-work-catalog { grid-template-columns: 320px minmax(340px, 1fr) minmax(420px, 1.2fr); }
.evc-shortcut-list { gap: 8px; }
.evc-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 6px;
  background: var(--surface-2);
}
.evc-row.is-selected { border-color: #3d82c8; background: #1a2a40; }
.evc-row.is-off { opacity: .55; }
.evc-row-select {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  border: 0;
  padding: 6px 8px;
  text-align: left;
  background: transparent;
  color: inherit;
}
.evc-row-select em {
  display: block;
  color: #7d93ab;
  font-size: 9px;
  font-style: normal;
  letter-spacing: .08em;
}
.evc-row-select b {
  display: block;
  overflow: hidden;
  font-size: 12px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.evc-row-tools { display: flex; gap: 2px; padding-right: 4px; }
.evc-mark {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(180deg, #243044, #151d2b);
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .06), 0 8px 16px rgb(0 0 0 / .24);
  font-size: 20px !important;
  line-height: 1;
}
.evc-mark img {
  width: 28px;
  height: 28px;
  object-fit: contain;
  display: block;
}
.evc-icon-upload {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.evc-icon-pick {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.evc-icon-pick input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
.evc-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.evc-cats { display: flex; flex-wrap: wrap; gap: 8px; }
.evc-cat {
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 14px;
  color: var(--muted);
  background: var(--surface);
  font-size: 12px;
  font-weight: 650;
}
.evc-cat.is-on {
  border-color: #365fa8;
  color: #fff;
  background: #365fa8;
}
.evc-search { display: flex; gap: 8px; min-width: min(420px, 100%); }
.evc-search .input { min-width: 0; flex: 1; }
.evc-card-list { display: grid; gap: 10px; margin-top: 14px; }
.evc-card {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 8px;
  text-align: left;
  color: inherit;
  background: var(--surface-2);
}
.evc-card.is-selected { border-color: #3d82c8; box-shadow: 0 0 0 1px #3d82c8 inset; }
.evc-card-visual {
  width: 92px;
  height: 72px;
  overflow: hidden;
  border-radius: 10px;
  background: #142033 center/cover no-repeat;
}
.evc-card-visual img { width: 100%; height: 100%; object-fit: cover; }
.evc-card-body { min-width: 0; display: grid; gap: 3px; align-content: center; }
.evc-card-body i, .evc-board-card i {
  width: fit-content;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}
.evc-card-body i.is-on, .evc-board-card i.is-on { color: #7ee0a8; background: rgb(46 184 120 / .16); }
.evc-card-body i.is-end, .evc-board-card i.is-end,
.evc-card-body i.is-off, .evc-board-card i.is-off { color: #9fb0c3; background: rgb(148 163 184 / .16); }
.evc-card-body i.is-wait, .evc-board-card i.is-wait { color: #f2c14e; background: rgb(242 193 78 / .16); }
.evc-card-body b, .evc-board-card b { font-size: 13px; }
.evc-card-body em, .evc-board-card em {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.evc-card-body small, .evc-board-card small { color: #7d93ab; font-size: 10px; }
.evc-empty, .evc-detail-empty { padding: 28px 12px; color: var(--muted); text-align: center; }
.evc-editor { padding: 18px 20px 20px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.evc-steps { display: grid; gap: 8px; }
.evc-step { display: grid; grid-template-columns: 36px minmax(0, 1fr) 32px; gap: 8px; align-items: center; }
.evc-step span {
  display: grid;
  place-items: center;
  height: 32px;
  border-radius: 8px;
  color: #8eb4e8;
  background: #1a2738;
  font-size: 11px;
  font-weight: 800;
}
.evc-add-step { margin-top: 10px; }
.evc-notices { min-height: 132px; resize: vertical; }
.evc-preview {
  overflow: auto;
  max-height: calc(100vh - 280px);
  border-radius: 16px;
  padding: 16px;
  background: #0b1220;
}
.evc-preview.is-wide { max-height: none; }
.evc-phone {
  overflow: hidden;
  border: 1px solid #223149;
  border-radius: 18px;
  background: #121a28;
}
.evc-phone-head {
  padding: 14px 16px 8px;
  color: #8ea3bb;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
}
.evc-phone-list { display: grid; gap: 8px; padding: 0 10px 12px; }
.evc-phone-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  border-radius: 12px;
  padding: 8px 10px;
  color: #e8eef6;
  background: #171f2d;
}
.evc-phone-item.is-on { outline: 1px solid #3d82c8; }
.evc-phone-item em {
  display: block;
  color: #7d93ab;
  font-size: 9px;
  font-style: normal;
  letter-spacing: .08em;
}
.evc-phone-item b { display: block; font-size: 12px; font-weight: 650; }
.evc-board { margin-bottom: 18px; }
.evc-board-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.evc-board-tabs span {
  height: 28px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  padding: 0 10px;
  color: #9fb0c3;
  background: #182233;
  font-size: 10px;
  font-weight: 700;
}
.evc-board-tabs span.is-on { color: #fff; background: #365fa8; }
.evc-board-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.evc-board-card {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 10px;
  border: 1px solid #223149;
  border-radius: 14px;
  padding: 8px;
  color: #e8eef6;
  background: #151d2b;
}
.evc-detail { color: #d7e2ef; }
.evc-hero {
  position: relative;
  min-height: 168px;
  overflow: hidden;
  border-radius: 16px;
  margin-bottom: 14px;
  padding: 22px 24px;
  background: #101826 center/cover no-repeat;
}
.evc-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(8 14 24 / .88), rgb(8 14 24 / .28));
}
.evc-hero-copy { position: relative; z-index: 1; max-width: 58%; }
.evc-hero-tags { display: flex; gap: 6px; margin-bottom: 10px; }
.evc-hero-tags span {
  height: 22px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  padding: 0 8px;
  color: #d5e4f5;
  background: rgb(255 255 255 / .12);
  font-size: 10px;
  font-weight: 700;
}
.evc-hero-tags span.is-live { color: #7ee0a8; background: rgb(46 184 120 / .2); }
.evc-hero-copy em {
  display: block;
  color: #8eb4e8;
  font-size: 10px;
  font-style: normal;
  letter-spacing: .16em;
}
.evc-hero-copy h3 { margin: 6px 0 8px; font-size: 22px; }
.evc-hero-copy p { margin: 0 0 14px; color: #b7c6d6; font-size: 12px; }
.evc-hero-copy button, .evc-detail aside button {
  height: 34px;
  border: 0;
  border-radius: 999px;
  padding: 0 16px;
  color: #06202a;
  background: #3ec6e0;
  font-size: 12px;
  font-weight: 800;
}
.evc-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 12px; }
.evc-detail h4 {
  margin: 0 0 10px;
  color: #8ea3bb;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
}
.evc-detail h4 b { margin-left: 8px; color: #e8eef6; font-size: 15px; letter-spacing: 0; }
.evc-detail-steps { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-bottom: 18px; }
.evc-detail-steps article {
  min-height: 86px;
  border: 1px solid #223149;
  border-radius: 12px;
  padding: 10px;
  background: #151d2b;
}
.evc-detail-steps span { display: block; margin-bottom: 8px; color: #7eb0e8; font-size: 11px; font-weight: 800; }
.evc-detail-steps p { margin: 0; color: #c5d2e0; font-size: 11px; line-height: 1.45; }
.evc-detail ul { margin: 0; padding-left: 16px; }
.evc-detail li { margin: 0 0 6px; color: #b7c6d6; font-size: 11px; }
.evc-detail aside {
  border: 1px solid #223149;
  border-radius: 16px;
  padding: 16px;
  background: #151d2b;
}
.evc-detail aside em { display: block; color: #8ea3bb; font-size: 10px; font-style: normal; letter-spacing: .14em; }
.evc-detail aside strong { display: block; margin: 8px 0 14px; font-size: 15px; }
.evc-detail dl { display: grid; gap: 10px; margin: 0 0 16px; }
.evc-detail dt { color: #7d93ab; font-size: 11px; }
.evc-detail dd { margin: 4px 0 0; font-size: 13px; font-weight: 700; }
.evc-detail aside button { width: 100%; }
.evc-card-visual.theme-welcome { background: linear-gradient(135deg, #1d4e6c, #0c2233) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Ctext x='18' y='52' font-size='36'%3E%F0%9F%93%A8%3C/text%3E%3C/svg%3E") center/56px no-repeat; }
.evc-card-visual.theme-slot, .evc-hero.theme-slot { background-color: #1a2030; }
.evc-card-visual.theme-slot { background-image: linear-gradient(135deg, #2a3348, #111722), radial-gradient(circle at 70% 40%, #3ec6e0, transparent 40%); }
.evc-card-visual.theme-sport { background: linear-gradient(135deg, #163226, #0d1a14); }
.evc-card-visual.theme-coupon { background: linear-gradient(135deg, #3a3320, #16130c); }
.evc-card-visual.theme-hash { background: linear-gradient(135deg, #2a2150, #120d24); }
.evc-card-visual.theme-crown { background: linear-gradient(135deg, #3a2a12, #161008); }
.evc-card-visual.theme-check { background: linear-gradient(135deg, #1b3a48, #0c1c24); }
.evc-card-visual.theme-gift { background: linear-gradient(135deg, #3a2240, #180c1c); }
.evc-card-visual.theme-community, .evc-hero.theme-community { background-color: #101826; }
.evc-hero.theme-welcome { background-image: linear-gradient(90deg, #0d1c2c, #16324a); }
.evc-hero.theme-community { background-image: linear-gradient(90deg, #0c1420 18%, rgb(12 20 32 / .4)), radial-gradient(circle at 78% 48%, #2f6ea3, #101826 58%); }
.evc-hero.theme-slot { background-image: linear-gradient(90deg, #10151f, #1d2738); }
.evc-hero.theme-sport { background-image: linear-gradient(90deg, #0d1a14, #163226); }
.evc-hero.theme-coupon { background-image: linear-gradient(90deg, #16130c, #3a3320); }
.evc-hero.theme-hash { background-image: linear-gradient(90deg, #120d24, #2a2150); }
.evc-hero.theme-crown { background-image: linear-gradient(90deg, #161008, #3a2a12); }
.evc-hero.theme-check { background-image: linear-gradient(90deg, #0c1c24, #1b3a48); }
.evc-card-visual.theme-night { background: linear-gradient(135deg, #1e293b, #0b1220); }
.evc-hero.theme-night { background-image: linear-gradient(90deg, #0b1220, #1e293b); }
.evc-card-visual.theme-gold { background: linear-gradient(135deg, #3a2e12, #161008); }
.evc-hero.theme-gold { background-image: linear-gradient(90deg, #161008, #3a2e12); }
@media (max-width: 1440px) {
  .evc-work, .evc-work-catalog { grid-template-columns: 1fr 1fr; }
  .evc-preview { max-height: none; }
}
@media (max-width: 980px) {
  .evc-work, .evc-work-catalog, .evc-board-grid, .evc-detail-grid, .evc-detail-steps { grid-template-columns: 1fr; }
  .evc-hero-copy { max-width: none; }
}

.nav-layout-work {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: 16px;
  align-items: start;
}
.nav-layout-editor, .nav-layout-side { padding: 18px 20px 20px; }
.nav-layout-tree { display: grid; gap: 6px; margin-top: 14px; }
.nav-layout-node { display: grid; gap: 6px; margin-left: calc(var(--d) * 18px); }
.nav-layout-row {
  display: grid;
  grid-template-columns: 28px 22px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 6px 8px;
  background: var(--surface-2);
  cursor: grab;
}
.nav-layout-row.is-dragging { opacity: .45; }
.nav-layout-row.is-drop-before { box-shadow: 0 -2px 0 #3d82c8; }
.nav-layout-row.is-drop-after { box-shadow: 0 2px 0 #3d82c8; }
.nav-layout-row.is-drop-into,
.nav-layout-empty.is-drop-into { outline: 1px solid #3d82c8; background: #1a2a40; }
.nav-layout-grip { display: grid; place-items: center; color: var(--muted); }
.nav-layout-grip svg { width: 14px; height: 14px; }
.nav-layout-icon { display: grid; place-items: center; color: #8eb4e8; }
.nav-layout-icon svg { width: 15px; height: 15px; }
.nav-layout-row .input { height: 32px; }
.nav-layout-lock {
  color: #7d93ab;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .04em;
}
.nav-layout-kids { display: grid; gap: 6px; }
.nav-layout-empty {
  margin-left: 18px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  padding: 12px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.nav-layout-preview {
  overflow: auto;
  max-height: 520px;
  border: 1px solid #223149;
  border-radius: 14px;
  padding: 10px;
  background: #0b1220;
  color: #d7e2ef;
}
.nav-layout-preview-link,
.nav-layout-preview-group > div:first-child {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 4px 8px;
  font-size: 12px;
}
.nav-layout-preview-link svg,
.nav-layout-preview-group svg { width: 14px; height: 14px; }
.nav-layout-preview-group > div:first-child { color: #9fb0c3; font-weight: 700; }
.nav-layout-preview-kids { padding-left: 14px; }
.nav-layout-preview-group.is-nested > div:first-child { color: #7d93ab; font-size: 11px; }
.nav-layout-trash { display: grid; gap: 8px; margin-top: 10px; }
.nav-layout-trash-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 10px;
  background: var(--surface-2);
  font-size: 12px;
}
.nav-layout-empty-copy { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
@media (max-width: 1100px) {
  .nav-layout-work { grid-template-columns: 1fr; }
}

.ref-work {
  display: grid;
  grid-template-columns: minmax(340px, .9fr) minmax(560px, 1.2fr);
  gap: 16px;
  align-items: start;
}
.ref-editor, .ref-policy { display: grid; gap: 12px; }
.ref-preview-card { padding: 16px 16px 18px; }
.ref-preview {
  overflow: auto;
  max-height: calc(100vh - 220px);
  border: 1px solid #1c2736;
  border-radius: 18px;
  padding: 16px;
  background: #0d141d;
}
.ref-phone {
  display: grid;
  gap: 12px;
  color: #d5e0ee;
}
.ref-phone.is-off { opacity: .55; }
.ref-off-banner {
  border: 1px dashed #3b4b60;
  border-radius: 12px;
  padding: 8px 12px;
  color: #f2c14e;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  background: rgb(242 193 78 / .08);
}
.ref-hero-row {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 12px;
}
.ref-hero, .ref-how, .ref-benefit, .ref-list-card, .ref-stats article {
  border: 1px solid #243041;
  border-radius: 16px;
  background: #151c27;
}
.ref-hero { padding: 16px 16px 14px; }
.ref-hero h3, .ref-how h3, .ref-benefit h3, .ref-list-head h3 {
  margin: 0 0 6px;
  color: #eef4fb;
  font-size: 14px;
}
.ref-hero p, .ref-how > p {
  margin: 0 0 14px;
  color: #8ea0b5;
  font-size: 11px;
  line-height: 1.5;
}
.ref-copybox {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 6px 8px 6px 14px;
  border: 1px solid #2a3a4e;
  border-radius: 12px;
  background: #101722;
}
.ref-copybox strong, .ref-copybox span {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  color: #e8eef6;
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ref-copybox span { font-weight: 600; }
.ref-copybox button {
  height: 30px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: #2a3545;
  color: #d7e2ef;
  font-size: 12px;
  font-weight: 700;
}
.ref-copybox .is-share {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #3b82f6;
  color: #fff;
}
.ref-copybox .is-share .ref-mark {
  width: 18px;
  height: 18px;
  background: transparent;
  color: #fff;
}
.ref-copybox .is-share svg { width: 13px; height: 13px; }
.ref-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.ref-stats article {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
}
.ref-stats em {
  display: block;
  color: #8ea0b5;
  font-size: 11px;
  font-style: normal;
}
.ref-stats b {
  display: block;
  margin: 4px 0 2px;
  color: #f3f7fc;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -.03em;
}
.ref-stats b.is-gold { color: #7ec8ff; }
.ref-stats small { color: #7d93ab; font-size: 10px; }
.ref-mark {
  display: grid;
  flex: none;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #1e2b3c;
  color: #7eb0e8;
}
.ref-mark svg { width: 18px; height: 18px; }
.ref-mark.is-gift { color: #7ee0a8; background: rgb(46 184 120 / .14); }
.ref-mark.is-alert { color: #f2c14e; background: rgb(242 193 78 / .14); }
.ref-mid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .9fr);
  gap: 12px;
}
.ref-how, .ref-benefit { padding: 16px; }
.ref-steps {
  display: grid;
  grid-template-columns: 1fr 18px 1fr 18px 1fr;
  gap: 8px;
  align-items: start;
}
.ref-steps > i {
  display: grid;
  place-items: center;
  height: 42px;
  color: #4c6076;
}
.ref-steps > i svg { width: 14px; height: 14px; }
.ref-step { display: grid; justify-items: start; gap: 8px; }
.ref-step strong { color: #e8eef6; font-size: 12px; }
.ref-step p { margin: 0; color: #8ea0b5; font-size: 11px; line-height: 1.45; }
.ref-benefit { display: grid; gap: 10px; align-content: start; }
.ref-benefit-row {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}
.ref-benefit-row .ref-mark { width: 32px; height: 32px; }
.ref-benefit-row .ref-mark svg { width: 15px; height: 15px; }
.ref-benefit-row b { color: #d7e2ef; font-size: 12px; }
.ref-benefit-row span { color: #9fb4c9; font-size: 11px; text-align: right; }
.ref-list-card { padding: 14px 8px 8px; }
.ref-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px 10px;
}
.ref-list-head button {
  border: 0;
  background: none;
  color: #8eb4e8;
  font-size: 12px;
}
.ref-list-card table { width: 100%; border-collapse: collapse; }
.ref-list-card th, .ref-list-card td {
  padding: 10px 10px;
  border-bottom: 1px solid #223049;
  font-size: 12px;
  text-align: left;
}
.ref-list-card th { color: #7d93ab; font-weight: 600; }
.ref-list-card td { color: #d7e2ef; }
.ref-list-card i {
  display: inline-flex;
  min-width: 42px;
  justify-content: center;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}
.ref-list-card i.is-on { color: #7ee0a8; background: rgb(46 184 120 / .16); }
.ref-list-card i.is-off { color: #9fb0c3; background: rgb(148 163 184 / .16); }
.ref-list-card .is-earn { color: #7ec8ff; font-weight: 700; }
.ref-step-edits { display: grid; gap: 8px; margin-top: 12px; }
.ref-step-edit {
  display: grid;
  grid-template-columns: 28px 1fr 1.4fr;
  gap: 8px;
  align-items: center;
}
.ref-step-edit em {
  display: grid;
  place-items: center;
  height: 30px;
  border-radius: 8px;
  background: var(--surface-2);
  color: var(--muted);
  font-style: normal;
  font-weight: 800;
}
.ref-policy-summary { padding: 18px 18px 16px; }
.ref-policy-summary h2 { margin: 0 0 4px; font-size: 15px; }
.ref-policy-summary p { margin: 0 0 14px; color: var(--muted); font-size: 12px; }
.ref-policy-summary ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ref-policy-summary li {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--surface-2);
}
.ref-policy-summary span { display: block; color: var(--muted); font-size: 11px; }
.ref-policy-summary b { display: block; margin-top: 4px; font-size: 14px; }
.ref-sub { display: block; color: var(--muted); font-size: 11px; }
.bset-layout {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 7fr);
  gap: 12px;
  align-items: stretch;
  width: 100%;
  min-width: 0;
}
.bset-layout.is-solo { grid-template-columns: 1fr; }
.bset-layout > article {
  min-width: 0;
  min-height: 0;
}
.bset-layout > .org-tree-card {
  display: flex;
  flex-direction: column;
}
.bset-layout .org-tree-wrap {
  flex: 1 1 0;
  min-height: 0;
  overflow: auto;
}
.bset-layout .org-tree-copy {
  min-width: 0;
  overflow: hidden;
}
.bset-layout .org-tree-legend {
  flex-direction: column;
  align-items: stretch;
}
.bset-layout .org-tree-chips {
  flex-wrap: nowrap;
  overflow-x: auto;
}
.bset-layout .org-tree-expand { justify-content: flex-end; }
.bset-layout .org-tree-meta {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bset-card { min-width: 0; padding: 16px 16px 14px; }
.bset-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.bset-legend {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 11px;
}
.bset-legend span::before,
.bset-legend strong::before {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 5px;
  border-radius: 50%;
  content: "";
}
.bset-legend span::before { background: #94a3b8; }
.bset-legend strong {
  color: var(--text);
  font-weight: 800;
}
.bset-legend strong::before { background: #3b82f6; }
.bset-board-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.bset-board-head h3 { margin: 0 0 4px; font-size: 15px; }
.bset-board-head span { color: var(--muted); font-size: 12px; font-weight: 600; }
.bset-board-head p { margin: 0; color: var(--muted); font-size: 12px; }
.bset-board-head p b { color: var(--text); }
.bset-board-head em { color: var(--muted); font-size: 11px; font-style: normal; }
.bset-table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 8px; }
.bset-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  table-layout: fixed;
}
.bset-table th,
.bset-table td {
  border: 1px solid var(--line);
  padding: 7px 10px;
  font-size: 12px;
}
.bset-table th {
  width: 12.5%;
  color: var(--text);
  font-weight: 650;
  text-align: center;
  background: var(--surface-3);
  white-space: normal;
  line-height: 1.3;
  word-break: keep-all;
}
.bset-amt {
  width: 12.5%;
  text-align: right;
  font-variant-numeric: tabular-nums;
  background: var(--surface);
}
.bset-amt b,
.bset-amt strong { display: block; line-height: 1.35; }
.bset-amt b {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}
.bset-amt strong { font-size: 13px; font-weight: 800; }
.bset-amt.is-neg strong { color: var(--danger); }
.bset-table tr.is-sum th,
.bset-table tr.is-total th { background: #f8d7dc; }
.bset-table tr.is-sum td,
.bset-table tr.is-total td { background: #fff5f6; }
.bset-table tr.is-total th,
.bset-table tr.is-total td { font-weight: 800; }
.bset-table tr.bset-section th {
  padding: 8px 12px;
  color: #1e3a5f;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-align: left;
  background: #e8eef6;
}
.bset-table tr.is-event th { background: #e7f0ea; }
.bset-table tr.is-event td { background: #f4faf6; }
.bset-table tr.is-event th:nth-child(7),
.bset-table tr.is-event td:nth-child(8) { background: #efe7d3; }
.bset-table tr.is-miss th { background: #efe4cc; color: #6a4a12; }
.bset-table tr.is-miss td { background: #faf3e3; }
.bset-table tr.is-miss strong { color: #b45309; }
.bset-table th.is-blank,
.bset-table td.is-blank { background: var(--surface-3); }
.gkind-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 13px;
}
.gkind-table th,
.gkind-table td {
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.gkind-table thead th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  background: var(--surface-2);
}
.gkind-table th:first-child,
.gkind-table td:first-child {
  text-align: left;
  font-weight: 700;
}
.gkind-name {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.gkind-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22d3ee;
  box-shadow: 0 0 0 3px rgba(34, 211, 238, .16);
}
.gkind-amt.is-pos { color: #10b981; font-weight: 800; }
.gkind-amt.is-neg { color: var(--danger); font-weight: 800; }
.gkind-table tr.is-sum th,
.gkind-table tr.is-sum td {
  background: var(--surface-2);
  font-weight: 800;
}
.gkind-table tr.is-extra th,
.gkind-table tr.is-extra td {
  background: #f4faf6;
}
.gkind-table tr.is-extra th { color: #355e45; }
[data-theme="dark"] .gkind-table tr.is-extra th,
[data-theme="dark"] .gkind-table tr.is-extra td { background: #172821; }
[data-theme="dark"] .gkind-table tr.is-extra th { color: #b7e0c8; }
[data-theme="dark"] .gkind-table tr.is-sum th,
[data-theme="dark"] .gkind-table tr.is-sum td {
  background: #2a1c27;
  color: #f8c9d0;
}
[data-theme="dark"] .bset-table tr.is-sum th,
[data-theme="dark"] .bset-table tr.is-total th { background: #3d2430; color: #f8c9d0; }
[data-theme="dark"] .bset-table tr.is-sum td,
[data-theme="dark"] .bset-table tr.is-total td { background: #2a1c27; }
[data-theme="dark"] .bset-table tr.bset-section th {
  color: #c5d4e8;
  background: #1c2a3c;
}
[data-theme="dark"] .bset-table tr.is-event th { background: #1d332c; color: #b7e0c8; }
[data-theme="dark"] .bset-table tr.is-event td { background: #172821; }
[data-theme="dark"] .bset-table tr.is-event th:nth-child(7),
[data-theme="dark"] .bset-table tr.is-event td:nth-child(8) { background: #3a3120; color: #f0d9a0; }
[data-theme="dark"] .bset-table tr.is-miss th { background: #3a3120; color: #f0d9a0; }
[data-theme="dark"] .bset-table tr.is-miss td { background: #2b2518; }
[data-theme="dark"] .bset-table tr.is-miss strong { color: #f0c674; }
@media (max-width: 1180px) {
  .bset-layout { grid-template-columns: 1fr; }
  .bset-layout .org-tree-wrap { max-height: 360px; }
  .bset-toolbar { flex-direction: column; align-items: stretch; }
}

.dset-card { padding: 14px 16px 16px; }
.dset-board { min-width: 0; }
.dset-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  margin: 0 -4px 12px;
  border-bottom: 1px solid var(--line);
}
.dset-tabs button {
  min-height: 40px;
  border: 0;
  border-bottom: 2px solid transparent;
  padding: 0 16px;
  color: var(--muted);
  background: transparent;
  font-size: 13px;
  font-weight: 650;
}
.dset-tabs button.active {
  color: #2563eb;
  border-bottom-color: #2563eb;
  font-weight: 800;
}
.dset-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.dset-dates {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dset-dates .input { width: 148px; }
.dset-dates span { color: var(--muted); }
.dset-toolbar em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}
.dset-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.dset-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
.dset-table th,
.dset-table td {
  padding: 8px 6px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  text-align: center;
  vertical-align: middle;
}
.dset-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  color: var(--muted);
  font-weight: 700;
  text-align: center;
  background: var(--surface-3);
  white-space: normal;
  line-height: 1.3;
}
.dset-table thead th small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
}
.dset-table col.dset-col-date { width: 8%; }
.dset-table col.dset-col-io { width: 8%; }
.dset-table col.dset-col-iopnl { width: 7%; }
.dset-table col.dset-col-bet { width: 9%; }
.dset-table col.dset-col-roll { width: 7%; }
.dset-table col.dset-col-pnl { width: 8%; }
.dset-table col.dset-col-admin { width: 8%; }
.dset-table col.dset-col-point { width: 8%; }
.dset-table col.dset-col-event { width: 8%; }
.dset-table col.dset-col-miss { width: 8%; }
.dset-table col.dset-col-restore { width: 7%; }
.dset-table col.dset-col-settle { width: 7%; }
.dset-table col.dset-col-profit { width: 7%; }
.dset-table .dset-date,
.dset-table tbody th {
  text-align: center;
  font-weight: 700;
  white-space: nowrap;
}
.dset-pair b,
.dset-pair strong { display: block; line-height: 1.35; font-variant-numeric: tabular-nums; text-align: center; }
.dset-pair b { color: var(--muted); font-size: 11px; font-weight: 650; }
.dset-pair strong { font-size: 13px; font-weight: 700; }
.dset-pair b.is-minus { color: #ef4444; }
.dset-num {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  white-space: nowrap;
}
.dset-num.is-plus { color: #2563eb; }
.dset-num.is-minus { color: #ef4444; }
.dset-table tr.is-sum th,
.dset-table tr.is-sum td {
  background: #fff1f2;
  font-weight: 800;
}
[data-theme="dark"] .dset-tabs button.active { color: #7dd3fc; border-bottom-color: #38bdf8; }
[data-theme="dark"] .dset-table tr.is-sum th,
[data-theme="dark"] .dset-table tr.is-sum td { background: #3d2430; }
[data-theme="dark"] .dset-num.is-plus { color: #7dd3fc; }
@media (max-width: 1180px) {
  .dset-toolbar { flex-direction: column; align-items: stretch; }
}

.pset-board { min-width: 0; }
.pset-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.pset-head .dset-tabs {
  flex: 1 1 auto;
  margin: 0;
}
.pset-dates { flex: 0 0 auto; }
.pset-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.pset-daybar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  margin-left: auto;
}
.pset-day-label {
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.pset-gauge {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, 52px);
  align-items: start;
  width: 260px;
}
.pset-gauge-line {
  position: absolute;
  left: 26px;
  right: 26px;
  top: 6px;
  height: 3px;
  border-radius: 99px;
  background: #334155;
  pointer-events: none;
}
.pset-gauge-line i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #b45309, #fbbf24);
  box-shadow: 0 0 12px rgba(245, 158, 11, .55);
}
.pset-gauge-stop {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 7px;
  border: 0;
  padding: 0;
  background: transparent;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
.pset-gauge-stop::before {
  content: "";
  width: 14px;
  height: 14px;
  border: 2px solid #64748b;
  border-radius: 50%;
  background: #0f172a;
  box-shadow: 0 0 0 3px var(--surface, #0b1220);
}
.pset-gauge-stop.is-on { color: #fde68a; }
.pset-gauge-stop.is-on::before {
  border-color: #fbbf24;
  background: #f59e0b;
  box-shadow: 0 0 0 3px var(--surface, #0b1220), 0 0 14px rgba(245, 158, 11, .75);
}
.pset-method {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px 5px 6px;
  border: 1px solid #f59e0b;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(245, 158, 11, .28), rgba(245, 158, 11, .1));
  color: #fde68a;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, .2), 0 0 18px rgba(245, 158, 11, .28);
}
.pset-method i {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #f59e0b;
  color: #1c1406;
  font-style: normal;
  font-weight: 900;
}
.pset-method-pop {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 8;
  display: none;
  width: min(360px, 70vw);
  padding: 12px 14px;
  border: 1px solid #f59e0b;
  border-radius: 12px;
  background: #1a1408;
  color: #fff7e6;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.55;
  text-align: left;
  white-space: normal;
  box-shadow: 0 16px 36px rgba(0, 0, 0, .45), 0 0 0 1px rgba(245, 158, 11, .35);
}
.pset-method:hover .pset-method-pop,
.pset-method:focus-visible .pset-method-pop { display: block; }
.pset-actions { display: flex; align-items: center; gap: 8px; }
.pset-sel-btn,
.pset-all-btn {
  min-height: 32px !important;
  padding: 0 16px !important;
  font-weight: 800;
}
.pset-sel-btn {
  color: #ef6b57 !important;
  background: transparent !important;
  border-color: #ef6b57 !important;
}
.pset-all-btn {
  color: #fff !important;
  background: #ef6b57 !important;
  border-color: #ef6b57 !important;
}
.pset-sel-btn:hover,
.pset-all-btn:hover { filter: brightness(1.06); }
.pset-toolbar em {
  color: var(--muted);
  font-size: 12px !important;
  font-style: normal;
  white-space: nowrap;
}
.pset-table-wrap {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.pset-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: collapse;
}
.pset-table th,
.pset-table td {
  padding: 7px 3px;
  border-bottom: 1px solid var(--line);
  font-size: 11px !important;
  text-align: center;
  vertical-align: middle;
  font-variant-numeric: tabular-nums;
}
.pset-table thead th {
  color: var(--muted);
  font-weight: 700;
  background: var(--surface-3);
  white-space: normal;
  word-break: keep-all;
  line-height: 1.3;
}
.pset-table tbody tr:nth-child(odd) td { background: color-mix(in srgb, var(--surface) 92%, #94a3b8 8%); }
.pset-check { width: 32px; }
.pset-check input { width: 14px; height: 14px; accent-color: #2563eb; }
.pset-lose { width: 52px; font-weight: 800; }
.pset-kind { color: #94a3b8; font-weight: 700; width: 40px; }
.pset-kind.is-down { color: #2563eb; font-weight: 800; }
.pset-num.is-plus { color: #2563eb; font-weight: 800; }
.pset-num.is-minus { color: #ef4444; font-weight: 800; }
.pset-sum { font-weight: 800; }
.pset-last { color: var(--muted); }
.pset-act { width: 108px; }
.pset-act .btn { margin: 0 1px; padding-inline: 6px; }
.pset-done:disabled {
  cursor: not-allowed;
  opacity: 1;
  border-color: var(--line);
  background: var(--surface-3);
  color: var(--muted);
}
.modal.is-pset-history { width: min(1080px, calc(100vw - 48px)); }
.modal.is-pset-history .modal-body { overflow: auto; }
.pset-empty {
  padding: 28px 12px !important;
  color: var(--muted);
}
[data-theme="dark"] .pset-kind.is-down { color: #7dd3fc; }
[data-theme="dark"] .pset-num.is-plus { color: #7dd3fc; }
[data-theme="dark"] .pset-table tbody tr:nth-child(odd) td { background: rgb(148 163 184 / .06); }
@media (max-width: 1180px) {
  .pset-head,
  .pset-toolbar { flex-direction: column; align-items: stretch; }
  .pset-daybar { justify-content: flex-end; }
}

body[data-route="/admin/partners/partner-settlement"] .bset-layout { align-items: start; }
body[data-route="/admin/partners/partner-settlement"] .org-tree-wrap {
  flex: 0 0 auto;
  height: 564px;
  min-height: 564px;
  max-height: 564px;
}

.rl-work {
  display: grid;
  grid-template-columns: minmax(340px, .92fr) minmax(560px, 1.18fr);
  gap: 16px;
  align-items: start;
}
.rl-editor { display: grid; gap: 12px; }
.rl-preview {
  overflow: auto;
  max-height: calc(100vh - 220px);
  border: 1px solid #1c2a3c;
  border-radius: 18px;
  padding: 16px;
  background: #0c1520;
}
.rl-phone { display: grid; gap: 12px; color: #d7e3f0; }
.rl-phone.is-off { opacity: .55; }
.rl-off {
  border: 1px dashed #3b4b60;
  border-radius: 12px;
  padding: 8px 12px;
  color: #f2c14e;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  background: rgb(242 193 78 / .08);
}
.rl-kpis {
  display: grid;
  grid-template-columns: 1.4fr .9fr 1fr;
  gap: 10px;
}
.rl-kpis article {
  border: 1px solid #24364c;
  border-radius: 16px;
  padding: 14px 16px;
  background: #121d2b;
}
.rl-kpis em {
  display: block;
  color: #8ea0b5;
  font-size: 11px;
  font-style: normal;
}
.rl-kpis b { display: block; margin-top: 6px; font-size: 22px; letter-spacing: -.02em; }
.rl-kpis b.is-cyan { color: #4cc3ff; }
.rl-kpis b.is-gold { color: #f3c35a; }
.rl-kpis small { display: block; margin: 8px 0 2px; color: #7f93a8; font-size: 11px; }
.rl-meter {
  overflow: hidden;
  height: 8px;
  margin-top: 10px;
  border-radius: 999px;
  background: #1b2c3d;
}
.rl-meter span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #1d8ad8, #4cc3ff);
}
.rl-kind {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  overflow: hidden;
  border-radius: 12px;
  background: #152232;
}
.rl-kind button {
  min-height: 42px;
  border: 0;
  color: #7f93a8;
  background: transparent;
  font-size: 14px;
  font-weight: 700;
}
.rl-kind button.active {
  color: #0b1724;
  background: linear-gradient(180deg, #7fd4ff, #3aa8e8);
}
.rl-stage {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr);
  gap: 14px;
  align-items: start;
}
.rl-wheel-wrap {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 360px;
}
.rl-pointer {
  position: absolute;
  top: 8px;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 16px solid #4cc3ff;
  filter: drop-shadow(0 4px 6px rgb(0 0 0 / .4));
}
.rl-wheel {
  position: relative;
  width: min(320px, 100%);
  aspect-ratio: 1;
  border-radius: 50%;
  box-shadow: 0 0 0 10px #0f1c2a, 0 0 0 14px #2f8fd4, 0 18px 40px rgb(0 0 0 / .45);
}
.rl-label {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 86px;
  margin-left: -43px;
  color: #e7f3ff;
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  transform: rotate(calc(var(--i) * 360deg / var(--n) + 180deg / var(--n))) translateY(-118px) rotate(calc(-1 * (var(--i) * 360deg / var(--n) + 180deg / var(--n))));
}
.rl-start {
  position: absolute;
  inset: 50% auto auto 50%;
  z-index: 2;
  width: 92px;
  height: 92px;
  margin: -46px 0 0 -46px;
  border: 0;
  border-radius: 50%;
  color: #d7ecff;
  background: radial-gradient(circle at 50% 35%, #1d4d73, #0c2438 68%);
  box-shadow: 0 0 0 6px #0f1c2a, 0 0 0 8px #3aa8e8;
}
.rl-start b { display: block; font-size: 13px; letter-spacing: .08em; }
.rl-start small { display: block; margin-top: 2px; color: #8eb4d4; font-size: 9px; }
.rl-side { display: grid; gap: 12px; }
.rl-guide, .rl-winners, .rl-history {
  border: 1px solid #24364c;
  border-radius: 16px;
  padding: 14px;
  background: #121d2b;
}
.rl-guide h3, .rl-winners h3, .rl-history h3 {
  margin: 0 0 10px;
  font-size: 14px;
}
.rl-guide ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.rl-guide li { display: flex; gap: 10px; align-items: flex-start; }
.rl-guide i {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #0b1724;
  background: #4cc3ff;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}
.rl-guide span { color: #b7c8d8; font-size: 12px; line-height: 1.45; }
.rl-winners table, .rl-history table { width: 100%; border-collapse: collapse; }
.rl-winners th, .rl-winners td, .rl-history th, .rl-history td {
  padding: 8px 6px;
  border-bottom: 1px solid #223246;
  font-size: 12px;
  text-align: left;
}
.rl-winners th, .rl-history th { color: #8ea0b5; font-weight: 650; }
.rl-prize { font-weight: 800; }
.rl-prize.is-point { color: #f0c14b; }
.rl-prize.is-ticket { color: #5ad0ff; }
.rl-prize.is-money { color: #f59e3b; }
.rl-prize.is-miss { color: #8ea0b5; }
.rl-empty { color: #8ea0b5; text-align: center; }
.rl-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.rl-history-head button {
  border: 1px solid #31475f;
  border-radius: 8px;
  padding: 6px 10px;
  color: #d7e3f0;
  background: #1a2b3d;
  font-size: 11px;
}
.rl-guide-edits { display: grid; gap: 8px; margin-top: 12px; }
.rl-guide-edit { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 8px; align-items: center; }
.rl-guide-edit em {
  display: grid;
  place-items: center;
  height: 28px;
  border-radius: 8px;
  color: #4cc3ff;
  background: var(--surface-3);
  font-style: normal;
  font-weight: 800;
}
.rl-slice-table { overflow: auto; }
.rl-slice-table table { width: 100%; min-width: 520px; border-collapse: collapse; }
.rl-slice-table th, .rl-slice-table td {
  padding: 8px 6px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
}
.rl-slice-table .select, .rl-slice-table .input { min-height: 32px; }
.rl-kind-tag {
  display: inline-flex;
  align-items: center;
  height: 22px;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 700;
}
.rl-kind-tag.is-normal { color: #4cc3ff; background: rgb(76 195 255 / .14); }
.rl-kind-tag.is-premium { color: #f3c35a; background: rgb(243 195 90 / .14); }
.row-actions.is-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
@media (max-width: 1180px) {
  .rl-work, .rl-stage, .rl-kpis { grid-template-columns: 1fr; }
  .rl-preview { max-height: none; }
}

.modal.is-member-detail {
  width: min(1280px, calc(100vw - 24px));
  height: calc(100vh - 24px);
  max-height: calc(100vh - 24px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.modal-layer:has(.modal.is-member-detail) {
  padding: 12px;
  background: rgb(7 16 28 / .72);
}
.modal.is-member-detail .modal-head {
  flex: none;
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: 10px 16px 8px;
  background: transparent;
}
.modal.is-member-detail .modal-head h2 { display: none; }
.modal.is-member-detail .modal-head .modal-close { display: none; }
.modal.is-member-detail .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 12px 16px 10px;
}
.modal.is-member-detail .modal-foot {
  flex: none;
  padding: 10px 16px 14px;
  background: var(--surface);
}
.modal.is-member-detail #modalSave { min-width: 96px; }
.md-layout {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  min-height: 0;
  height: 100%;
}
.md-live {
  position: relative;
  flex: none;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: inset 0 1px rgb(255 255 255 / .04);
}
.md-live-actions {
  position: absolute;
  z-index: 2;
  top: 6px;
  right: 8px;
  bottom: 6px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
}
.md-live-refresh,
.md-live-toggle {
  width: 42px;
  min-width: 42px;
  height: 25px;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0;
  color: var(--text);
  background: var(--surface-2);
}
.md-live-refresh {
  display: grid;
  place-items: center;
}
.md-live-refresh:hover { filter: brightness(1.08); }
.md-live-refresh svg { width: 12px; height: 12px; }
.md-live-toggle {
  font-size: 9px;
  font-weight: 700;
}
.md-live.is-open .md-live-actions {
  top: 8px;
  bottom: auto;
  flex-direction: row;
  align-items: center;
  gap: 4px;
}
.md-live-compact { display: grid; }
.md-live.is-open .md-live-compact { display: none; }
.md-live .compact-summary-row {
  padding-right: 62px;
  border-color: var(--line);
}
.md-live .compact-summary-row > div { border-color: var(--line); }
.md-live .compact-summary-row span { color: var(--muted); }
.md-live .compact-summary-row strong { color: var(--text); }
.md-live-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 64px 6px 10px;
  border-bottom: 1px solid var(--line);
}
.md-live-head b {
  display: block;
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -.02em;
}
.md-live-head p {
  margin: 1px 0 0;
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
}
.md-live-head .live-ops-status {
  margin: 0;
  height: 22px;
}
.md-live-board { display: none; }
.md-live.is-open .md-live-board { display: grid; gap: 0; }
.md-live-row {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.md-live-row.is-extra { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.md-live-row + .md-live-row { border-top: 1px solid var(--line); }
.md-live-row.is-pnl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.md-live-col.is-pnl .md-live-item.is-total {
  min-height: 32px;
}
.md-live-col.is-pnl .md-live-item strong { font-size: 15px; }
.md-live-col.is-pnl .md-live-item > span:nth-child(2) { display: none; }
.md-live-col.is-pnl .md-live-item { grid-template-columns: 2px auto; justify-content: start; }
.md-live-col {
  min-width: 0;
  padding: 7px 8px 6px;
  border-right: 1px solid var(--line);
}
.md-live-col:last-child { border-right: 0; }
.md-live-col h3 {
  margin: 0 0 5px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.md-live-metrics { display: grid; gap: 3px; }
.md-live-item {
  min-width: 0;
  display: grid;
  grid-template-columns: 2px minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  min-height: 17px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 650;
  white-space: nowrap;
}
.md-live-item > span:nth-child(2) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.md-live-item strong {
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
}
.md-live-item.is-total {
  background: rgb(56 189 248 / .16);
  border-radius: 3px;
  padding: 1px 5px;
  margin-inline: -5px;
}
.md-live-item.is-total strong { color: #dbeafe; }
html:not([data-theme="dark"]) .md-live-item.is-total {
  background: rgb(37 99 235 / .12);
}
html:not([data-theme="dark"]) .md-live-item.is-total strong { color: #1e3a8a; }
.md-live-col.is-feature .md-live-item.is-total {
  min-height: 42px;
  align-items: center;
}
.md-live-col.is-feature .md-live-item > span:nth-child(2) {
  white-space: normal;
  line-height: 1.25;
}
.md-sheet {
  display: grid;
  grid-template-columns: 15% minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  flex: 1;
  min-height: 0;
}
.md-main {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
#mdPane {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
.md-tree {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 10px 8px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
}
.md-tree > p {
  margin: 0 4px 2px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.md-tree > p small {
  margin-left: 6px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
}
.md-tree-role {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 16px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: -.02em;
}
.md-tree-box.is-up { border-style: dashed; }
.md-tree-box.is-down { background: rgb(125 211 252 / .06); }
.md-tree-box.is-self.is-current .md-tree-role,
.md-tree-box.is-current .md-tree-role {
  color: #c79535;
  background: rgb(199 149 53 / .18);
}
.md-embed {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
}
.md-embed .md-card-head { flex: none; }
.md-embed-tabs { flex: none; }
.md-embed-chips,
.md-embed-sum { flex: none; }
.md-embed .table-scroll,
.md-embed .wd-table-scroll,
.md-embed .users-table-scroll {
  flex: 1 1 auto;
  min-height: 180px;
}
.md-embed .wd-tabs { margin: 0; }
.md-embed .sbh-game-tabs { margin: 0; }
.md-embed .wd-bulk { margin: 0; padding: 0 4px; }
.md-embed .sbh-toolbar { margin: 0; padding: 0 4px; }
.md-embed th.is-sortable { overflow: visible; text-align: center; }
.md-embed th .users-sort {
  display: inline-flex;
  width: auto;
  max-width: 100%;
  margin: 0 auto;
  justify-content: center;
}
.md-embed th.numeric,
.md-embed td.numeric { text-align: center; }
.md-embed .md-odds-table th.sbh-col-time,
.md-embed .md-odds-table td.sbh-col-time,
.md-embed .md-odds-table th:first-child { width: 9%; }
.md-embed .md-odds-table th.numeric,
.md-embed .md-odds-table td.numeric { width: 11%; }
.md-embed .md-odds-table th.md-bonus-cell,
.md-embed .md-odds-table td.md-bonus-cell { width: 7%; }
.md-embed .md-odds-table th.md-kind-cell,
.md-embed .md-odds-table td.md-kind-cell { width: 8%; }
.md-embed .md-odds-table th.md-odd-cell,
.md-embed .md-odds-table td.md-odd-cell { width: 7%; }
.md-embed .md-odds-table th.md-status-cell,
.md-embed .md-odds-table td.md-status-cell { width: 8%; }
.md-embed .md-odds-table th.md-bet-act,
.md-embed .md-odds-table td.md-bet-act { width: 5%; }
.md-embed .md-odds-table.is-sport th.sbh-col-time,
.md-embed .md-odds-table.is-sport td.sbh-col-time,
.md-embed .md-odds-table.is-sport th:first-child { width: 7%; }
.md-embed .md-odds-table.is-sport th.md-bonus-cell,
.md-embed .md-odds-table.is-sport td.md-bonus-cell { width: 6%; }
.md-embed .md-odds-table.is-sport th.md-kind-cell,
.md-embed .md-odds-table.is-sport td.md-kind-cell { width: 7%; }
.md-embed .md-odds-table.is-sport th.md-odd-cell,
.md-embed .md-odds-table.is-sport td.md-odd-cell { width: 6%; }
.md-embed .md-odds-table.is-sport th.numeric,
.md-embed .md-odds-table.is-sport td.numeric { width: 8%; }
.md-embed .md-odds-table.is-sport th.md-status-cell,
.md-embed .md-odds-table.is-sport td.md-status-cell { width: 7%; }
.md-embed .md-odds-table.is-sport th.md-bet-act,
.md-embed .md-odds-table.is-sport td.md-bet-act { width: 4%; }
.md-embed .md-odds-table.is-sport th.md-odds-cell,
.md-embed .md-odds-table.is-sport td.md-odds-cell { width: 39%; }
.md-embed .md-odds-table.is-casino th.md-info-cell.is-vendor,
.md-embed .md-odds-table.is-casino td.md-info-cell.is-vendor { width: 12%; }
.md-embed .md-odds-table.is-casino th.md-info-cell.is-game,
.md-embed .md-odds-table.is-casino td.md-info-cell.is-game { width: 16%; }
.md-embed .md-odds-table.is-casino th.md-odds-cell,
.md-embed .md-odds-table.is-casino td.md-odds-cell { width: 16%; }
.md-embed .md-odds-table.is-slot th.md-info-cell.is-vendor,
.md-embed .md-odds-table.is-slot td.md-info-cell.is-vendor { width: 20%; }
.md-embed .md-odds-table.is-slot th.md-info-cell.is-game,
.md-embed .md-odds-table.is-slot td.md-info-cell.is-game { width: 22%; }
.md-embed .md-odds-table.is-slot th.numeric,
.md-embed .md-odds-table.is-slot td.numeric { width: 12%; }
.md-embed .md-odds-table.is-poly th.md-info-cell.is-cat,
.md-embed .md-odds-table.is-poly td.md-info-cell.is-cat { width: 10%; }
.md-embed .md-odds-table.is-poly th.md-info-cell.is-event,
.md-embed .md-odds-table.is-poly td.md-info-cell.is-event { width: 16%; }
.md-embed .md-odds-table.is-poly th.md-odds-cell,
.md-embed .md-odds-table.is-poly td.md-odds-cell { width: 12%; }
.md-embed .md-odds-table.is-mini th.md-info-cell.is-game,
.md-embed .md-odds-table.is-mini td.md-info-cell.is-game { width: 18%; }
.md-embed .md-odds-table.is-mini th.md-odds-cell,
.md-embed .md-odds-table.is-mini td.md-odds-cell { width: 12%; }
.md-embed .md-odds-table.is-virtual th.sbh-col-time,
.md-embed .md-odds-table.is-virtual td.sbh-col-time,
.md-embed .md-odds-table.is-virtual th:first-child { width: 8%; }
.md-embed .md-odds-table.is-virtual th.md-info-cell.is-gtype,
.md-embed .md-odds-table.is-virtual td.md-info-cell.is-gtype { width: 10%; }
.md-embed .md-odds-table.is-virtual th.md-odd-cell,
.md-embed .md-odds-table.is-virtual td.md-odd-cell { width: 7%; }
.md-embed .md-odds-table.is-virtual th.numeric,
.md-embed .md-odds-table.is-virtual td.numeric { width: 10%; }
.md-embed .md-odds-table.is-virtual th.md-status-cell,
.md-embed .md-odds-table.is-virtual td.md-status-cell { width: 6%; }
.md-embed .md-odds-table.is-virtual th.md-bet-act,
.md-embed .md-odds-table.is-virtual td.md-bet-act { width: 3%; }
.md-embed .md-odds-table.is-virtual th.md-odds-cell,
.md-embed .md-odds-table.is-virtual td.md-odds-cell { width: 36%; }
.md-embed .md-bonus-cell .sbh-bonus {
  font-size: 10px;
}
.md-embed .md-kind-cell {
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -.02em;
  white-space: nowrap;
  color: #cbd5e1;
}
.md-embed .md-odd-cell {
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.md-embed .md-odds-table td.md-odds-cell {
  min-width: 0;
  padding: 4px 8px;
  text-align: left;
}
.md-embed .md-odds-table td.md-info-cell {
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
}
.md-embed .md-odds-table td.md-info-cell .md-info-text {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.md-odds-stack {
  display: grid;
  gap: 4px;
}
.md-odds-line {
  display: flex;
  align-items: stretch;
  gap: 4px;
  min-width: 0;
}
.md-odds-chip,
.md-odds-vs {
  flex: 1 1 0;
  min-width: 0;
  min-height: 22px;
  padding: 2px 8px;
  border: 1px solid rgb(148 163 184 / .22);
  border-radius: 4px;
  background: #151c27;
}
.md-odds-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  color: #8b9aab;
}
.md-odds-chip.is-home { flex-direction: row-reverse; }
.md-odds-chip b {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: -0.03em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.md-odds-chip.is-on b { font-weight: 800; }
.md-odds-chip em {
  flex: none;
  color: #8b9aab;
  font-size: 10px;
  font-style: normal;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}
.md-odds-chip.is-on em {
  color: rgb(255 255 255 / .82);
  font-weight: 800;
}
.md-odds-chip.is-home.is-on {
  border-color: #3b82f6;
  background: #1e3a5f;
  color: #fff;
}
.md-odds-chip.is-away.is-on {
  border-color: #fb7185;
  background: #3f1d2a;
  color: #fff;
}
.md-odds-chip.is-draw.is-on {
  border-color: #94a3b8;
  background: #334155;
  color: #fff;
}
.md-odds-vs {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #8b9aab;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
}
.md-bet-plain.md-odds-line { min-width: 0; }
.md-bet-plain.is-choice { justify-content: stretch; }
.md-bet-plain.is-choice .md-odds-chip {
  flex: 1 1 auto;
  max-width: 100%;
  justify-content: center;
}
.md-bet-game {
  justify-content: flex-start;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.md-bet-detail-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid rgb(148 163 184 / .28);
  border-radius: 7px;
  background: #151c27;
  color: #cbd5e1;
  cursor: pointer;
}
.md-bet-detail-btn svg {
  width: 14px;
  height: 14px;
  stroke: currentColor;
  fill: none;
}
.md-bet-detail-btn:hover {
  border-color: #3b82f6;
  color: #fff;
  background: #1e3a5f;
}
.md-bet-detail {
  display: grid;
  gap: 12px;
}
.md-bet-detail-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 16px;
  margin: 0;
}
.md-bet-detail-meta > div {
  display: grid;
  gap: 2px;
}
.md-bet-detail-meta dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}
.md-bet-detail-meta dd {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
}
.md-event-checks .md-radio.is-all {
  padding-right: 12px;
  margin-right: 2px;
  border-right: 1px solid var(--line);
  font-weight: 800;
}
.md-field-ip .ip-history-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 10px 0 8px;
  border: 1px solid #93c5fd;
  border-radius: 6px;
  color: #1d4ed8;
  background: #eff6ff;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 1px 2px rgb(37 99 235 / .12);
  cursor: pointer;
}
[data-theme="dark"] .md-field-ip .ip-history-button {
  color: #bfdbfe;
  border-color: #2563eb;
  background: #1e3a5f;
  box-shadow: 0 1px 2px rgb(37 99 235 / .28);
}
.md-field-ip .ip-history-button:hover,
.md-field-ip .ip-history-button:focus-visible {
  color: #fff;
  background: #365fa8;
  border-color: #365fa8;
}
[data-theme="light"] .md-odds-chip,
[data-theme="light"] .md-odds-vs,
[data-theme="light"] .md-bet-detail-btn {
  background: #eef2f6;
  border-color: #d1d5db;
  color: #64748b;
}
[data-theme="light"] .md-odds-chip:not(.is-on) em { color: #64748b; }
[data-theme="light"] .md-odds-chip.is-on em { color: rgb(255 255 255 / .86); }
[data-theme="light"] .md-odds-chip.is-home.is-on { background: #1e3a5f; border-color: #3b82f6; color: #fff; }
[data-theme="light"] .md-odds-chip.is-away.is-on { background: #3f1d2a; border-color: #fb7185; color: #fff; }
[data-theme="light"] .md-odds-chip.is-draw.is-on { background: #334155; border-color: #94a3b8; color: #fff; }
[data-theme="light"] .md-odds-vs { color: #64748b; }
.md-tree ol {
  position: relative;
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.md-tree ol::before {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 14px;
  width: 1px;
  background: var(--line-strong);
}
.md-tree li {
  position: relative;
  z-index: 1;
  padding-left: calc(var(--d) * 8px);
}
.md-tree-box {
  width: 100%;
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow);
  text-align: left;
}
.md-tree-box:hover {
  border-color: #7dd3fc;
  background: rgb(125 211 252 / .08);
}
.md-tree-box span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}
.md-tree-box strong {
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.md-tree-box small {
  color: var(--muted);
  font-size: 10px;
  font-variant-numeric: tabular-nums;
}
.md-tree-box.is-current {
  border-color: #c79535;
  background: linear-gradient(180deg, rgb(199 149 53 / .16), var(--surface));
}
.md-tree-box.is-current span { color: #c79535; }
.md-tabs {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 3px;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface-2);
}
.md-tabs > button {
  flex: 1 1 0%;
  width: 0;
  min-width: 0;
  min-height: 36px;
  border: 0;
  border-radius: 8px;
  padding: 0 2px;
  color: var(--muted);
  background: transparent;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: -0.05em;
  line-height: 1.2;
  white-space: nowrap;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}
.md-tabs > button:hover {
  color: var(--text);
  background: rgb(255 255 255 / .04);
}
.md-tabs > button.active {
  color: var(--text);
  background: var(--bg);
  box-shadow: none;
  font-weight: 750;
}
.md-board {
  display: grid;
  gap: 10px;
  align-items: start;
}
.md-profile-grid {
  display: grid;
  gap: 0;
}
.md-profile-row {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 36px;
  align-items: center;
  min-height: 38px;
  padding: 5px 8px;
  border-bottom: 1px dashed var(--line-strong);
}
.md-profile-row::after {
  content: "";
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 50%;
  width: 0;
  border-left: 1px dashed var(--line-strong);
}
.md-profile-row:last-child { border-bottom: 0; }
.md-profile-row.is-span {
  grid-template-columns: 1fr;
  align-items: center;
}
.md-profile-row.is-span::after { display: none; }
.md-profile-row .md-field { min-height: 32px; grid-template-columns: 118px minmax(0, 1fr); }
.md-profile-row.is-span .md-field-memo {
  align-items: center;
  padding: 4px 0;
}
.md-profile-row.is-span .md-field-memo > div {
  display: block;
  width: 100%;
}
.md-memo {
  display: block;
  width: 100%;
  min-height: 72px;
  max-height: 180px;
  margin: 0;
}
.md-field-empty { min-height: 32px; }
.md-ref-btn,
.md-act-btn {
  min-height: 24px;
  margin-left: 2px;
  padding: 0 8px;
  font-size: 10px;
  font-weight: 700;
}
.md-settings { display: inline-flex; align-items: center; gap: 2px; }
.md-check {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.03em;
  white-space: nowrap;
  cursor: pointer;
}
.md-check input {
  width: 13px;
  height: 13px;
  margin: 0;
  accent-color: var(--primary);
}
.md-field-account > div { flex-wrap: nowrap; }
.md-field-account .select {
  flex: 0 0 auto;
  min-width: 96px;
}
.md-use-limit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.md-use-limit em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  opacity: .42;
}
.md-use-limit:not(.is-limited) em:first-child,
.md-use-limit.is-limited em:nth-of-type(2) {
  color: var(--text);
  opacity: 1;
}
.md-use-limit .md-help { z-index: 5; }
.md-field .ticket-qty-button {
  min-width: 28px;
  height: 28px;
  border-radius: 8px;
  padding: 0 8px;
  color: #e8eef6;
  background: #173047;
  font-size: 13px;
  font-weight: 800;
}
.md-field .ticket-qty-button:hover { filter: brightness(1.08); }
.md-field .ip-history-button {
  padding: 4px 10px;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  text-decoration: none;
}
.md-field .user-status-button.badge {
  min-width: 44px;
  min-height: 20px;
  padding: 2px 7px;
  border: 0;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
}
.md-field .user-status-button.badge:hover { filter: brightness(0.96); }
.md-count-split {
  margin: 0 4px;
  color: var(--muted);
  font-weight: 650;
}
.md-field em:not(.md-warn) {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 650;
}
.md-datetime {
  font-size: 12px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.md-profile .md-money {
  margin-left: 0;
  gap: 6px;
}
.md-profile .md-money strong {
  min-width: 0;
  margin: 0 1px 0 0;
  font-size: 13px;
  font-weight: 800;
}
.md-profile .md-money i { margin-left: 2px; }
.md-game-full { width: 100%; }
.md-bottom {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  align-items: start;
}
.md-combo { padding: 0; overflow: visible; }
.md-detail-fold .md-card-head {
  margin-bottom: 0;
  padding: 10px 12px;
  border-bottom: 0;
}
.md-detail-fold.is-open .md-card-head { border-bottom: 1px solid var(--line); }
.md-fold-btn {
  flex: 0 0 auto;
  min-width: 52px;
}
.md-fold-body { display: none; }
.md-detail-fold.is-open .md-fold-body { display: block; }
.md-gset { display: grid; gap: 14px; padding: 4px 4px 10px; }
.md-gset-block h4 {
  margin: 0;
  padding: 8px 10px 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.md-g3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  border-radius: 8px;
  overflow: visible;
  background: var(--surface);
}
.md-g3-cell {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 2px;
  min-height: 44px;
  padding: 7px 8px 7px 8px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.md-g3-cell.is-span { grid-column: 1 / -1; }
.md-g3-cell > span {
  flex: 0 0 auto;
  margin-right: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.25;
  white-space: nowrap;
}
.md-g3-cell .md-lv {
  flex: 1 1 auto;
  flex-wrap: nowrap;
  justify-content: flex-end;
  margin-left: auto;
  min-width: 0;
  white-space: nowrap;
}
.md-lv-mode {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}
.md-lv-mode em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  opacity: .42;
}
.md-lv:not(.is-custom) .md-lv-mode em:first-child,
.md-lv.is-custom .md-lv-mode em:last-child {
  color: var(--text);
  opacity: 1;
}
.md-g3-cell .md-lv .input,
.md-g3-cell .md-lv.is-inline .input {
  width: 68px;
  flex: 0 0 68px;
}
.md-g3-cell .md-odds-btn {
  min-height: 24px;
  margin: 0;
  padding: 0 10px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.md-g3-cell .md-lv:not(.is-custom) .md-rate,
.md-g3-cell .md-lv:not(.is-custom) .md-val-switch {
  opacity: .48;
}
.md-g3-cell.is-folder .md-folder-pills {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  gap: 8px;
}
.md-folder-pills {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}
.md-folder-pill {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin: 0;
}
.md-folder-pill em {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}
.md-folder-pill .input {
  width: auto;
  flex: 1 1 auto;
  min-width: 0;
}
.md-help {
  position: relative;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  padding: 0;
}
.md-help:hover {
  color: var(--text);
  border-color: var(--primary);
  background: var(--primary-soft);
}
.md-g3-cell:hover,
.md-g3-cell:focus-within { z-index: 8; }
.md-g3 .md-help.icon-tip::after,
.md-g3 .md-help.icon-tip::before { content: none; }
.md-float-tip {
  position: fixed;
  z-index: 10000;
  max-width: min(260px, calc(100vw - 16px));
  padding: 5px 8px;
  border-radius: 4px;
  color: #fff;
  background: #1f2937;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.45;
  text-align: left;
  box-shadow: 0 6px 16px rgb(15 23 42 / .28);
  pointer-events: none;
}
@media (max-width: 1100px) {
  .md-g3 { grid-template-columns: 1fr 1fr; }
  .md-g3-cell.is-span { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .md-g3 { grid-template-columns: 1fr; }
  .md-g3-cell { min-height: 0; }
  .md-g3-cell.is-folder .md-folder-pills { grid-template-columns: 1fr 1fr; }
}
.md-table { display: grid; }
.md-trow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--line);
}
.md-trow:last-child { border-bottom: 0; }
.md-trow.is-break { border-top: 6px solid var(--surface-2); }
.md-trow.is-span { grid-template-columns: 1fr; }
.md-trow.is-span .md-tcell:first-child { border-right: 0; }
.md-trow.is-span .md-tcell > div { flex-wrap: nowrap; }
.md-trow.is-odds .md-tcell {
  align-items: start;
  padding-top: 10px;
  padding-bottom: 10px;
}
.md-trow.is-odds .md-tcell > div { flex-wrap: wrap; }
.md-odds-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: center;
}
.md-odds-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  white-space: nowrap;
}
.md-odds-item em {
  min-width: 6.6em;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 650;
}
.md-odds-item .input { width: 58px; flex: 0 0 58px; }
.md-tcell {
  display: grid;
  grid-template-columns: 124px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 6px 10px;
}
.md-tcell:first-child { border-right: 1px solid var(--line); }
.md-tcell > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.3;
}
.md-tcell > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}
.md-tcell-empty { background: rgb(255 255 255 / .02); }
.md-trow.is-span .md-tcell {
  grid-template-columns: 128px minmax(0, 1fr);
}
.md-lv {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.md-lv .md-radios {
  flex-wrap: nowrap;
  flex-shrink: 0;
}
.md-lv.is-inline .input,
.md-lv .input { width: 64px; flex: 0 0 64px; }
.md-lv em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 650;
}
.md-card {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.md-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.md-card-head > div {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.md-card-head h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.md-card-head p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
}
.md-card-head i {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  color: var(--info);
  background: var(--info-soft);
}
.md-card-head i svg { width: 14px; height: 14px; }
.md-tone-gold .md-card-head i { color: #c79535; background: rgb(199 149 53 / .16); }
.md-tone-violet .md-card-head i { color: #a78bfa; background: rgb(167 139 250 / .16); }
.md-tone-green .md-card-head i { color: #34d399; background: rgb(52 211 153 / .14); }
.md-tone-warn .md-card-head i { color: #fbbf24; background: rgb(251 191 36 / .14); }
.md-tone-rose .md-card-head i { color: #fb7185; background: rgb(251 113 133 / .14); }
.md-fields { display: grid; gap: 6px; }
.md-field {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 30px;
}
.md-field > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}
.md-field > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}
.md-field > div b { font-weight: 800; }
.md-field-full { grid-template-columns: 108px minmax(0, 1fr); }
.md-game-block {
  align-items: start;
  padding-top: 4px;
}
.md-game-block .md-radios { gap: 7px 12px; }
.md-field .select,
.md-field .input {
  min-height: 28px;
  height: 28px;
  padding: 0 8px;
  font-size: 12px;
}
.md-field .select { width: auto; min-width: 108px; }
.md-field .input { min-width: 0; flex: 1; }
.md-rate { width: 58px; flex: 0 0 58px; text-align: right; }
.md-field i,
.md-roll-row i {
  color: var(--muted);
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
}
.md-path {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.md-warn {
  color: var(--danger);
  font-style: normal;
  font-weight: 800;
}
.md-radios,
.md-radio {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text);
  font-size: 12px;
}
.md-radios { flex-wrap: wrap; }
.md-radio {
  margin: 0;
  cursor: pointer;
}
.md-balance {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
}
.md-balance > div {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
}
.md-balance > div > span:first-child { color: var(--muted); font-size: 11px; font-weight: 650; }
.md-money { margin-left: auto; }
.md-money strong {
  min-width: 72px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.04em;
  font-variant-numeric: tabular-nums;
}
.md-balance > div > small { color: var(--muted); font-size: 11px; font-weight: 650; }
.md-balance .link { font-size: 11px; }
.md-roll { display: grid; gap: 5px; }
.md-roll-row {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) auto 56px auto auto 56px auto;
  align-items: center;
  gap: 5px;
}
.md-roll-row > span { color: var(--muted); font-size: 11px; }
.md-roll-row em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}
.md-roll-row .input { min-height: 26px; height: 28px; padding: 0 6px; text-align: right; }
.md-roll-toggle {
  grid-template-columns: minmax(0, 1fr) auto;
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.md-history {
  height: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.md-history .md-card-head { margin: 0; padding: 12px 12px 8px; }
.md-history .table-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 0 4px 8px;
}
.md-history table { width: 100%; }
.md-history th,
.md-history td {
  padding: 7px 8px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  text-align: center;
}
.md-history th { color: var(--muted); background: var(--surface-3); font-weight: 700; }
.md-empty { margin: 24px 0; color: var(--muted); text-align: center; }
[data-theme="dark"] .md-tabs {
  background: #182333;
  border-color: #2a3b50;
}
[data-theme="dark"] .md-tabs > button.active {
  color: #e8eef6;
  background: #0c1422;
}
[data-theme="dark"] .md-tree { background: #121b27; }
[data-theme="dark"] .md-tree-box { background: #182333; }
[data-theme="dark"] .md-balance > div { background: #172033; }
@media (max-width: 1100px) {
  .md-live-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md-live-row.is-pnl { grid-template-columns: 1fr; }
  .md-live-col:nth-child(3n) { border-right: 0; }
  .md-live-col:nth-child(n+4) { border-top: 1px solid var(--line); }
  .md-live-row.is-pnl .md-live-col { border-top: 1px solid var(--line); }
  .md-sheet { grid-template-columns: 1fr; min-height: 0; }
  .md-profile-row,
  .md-bottom,
  .md-trow { grid-template-columns: 1fr; }
  .md-profile-row::after { display: none; }
  .md-tcell:first-child { border-right: 0; border-bottom: 1px solid var(--line); }
  .md-roll-row { grid-template-columns: minmax(0, 1.2fr) auto 52px auto auto 52px auto; }
}

.rate-page { min-width: 0; }
.rate-filter-bar { border-radius: 5px 5px 0 0; }
.rate-filter-bar .users-keyword {
  margin-left: 0;
  flex: 0 1 320px;
  max-width: 360px;
}
.rate-legend {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--surface);
}
.rate-legend-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.rate-legend .org-tree-chip { height: 22px; padding: 0 10px; }
.rate-legend-chips .btn {
  min-height: 22px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}
.rate-legend-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-left: auto;
}
.rate-legend-actions .bulk-result-count {
  margin-right: 3px;
  color: var(--muted);
  font-size: 11px;
}
.rate-legend-actions .btn {
  min-height: 28px;
  border-radius: 4px;
  padding: 5px 10px;
  color: #526477;
  background: var(--surface);
  border-color: var(--line-strong);
  font-size: 11px;
  font-weight: 600;
}
.rate-legend-actions .btn:hover {
  color: #12304f;
  border-color: #b8c7d5;
  background: #edf3f8;
}
.rate-toolbar { border-top: 0; }
.rate-level-save {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
}
.rate-level-save .select { width: 92px; height: 28px; border-radius: 4px; }
.rate-bulk-head th {
  background: var(--surface-2, #f4f7fb);
  font-weight: 600;
  padding: 4px 4px;
}
.rate-bulk-head .rate-id-cell,
.rate-table thead .rate-bulk-head th:first-child {
  color: var(--muted);
  font-size: 11px;
  text-align: center;
  z-index: 5;
}
.rate-table-card { border-top: 0; border-radius: 0 0 5px 5px; box-shadow: none; overflow: visible; }
.rate-table-scroll { overflow: visible !important; max-height: none; border-radius: 0; }
.rate-table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
}
.rate-table th,
.rate-table td {
  border-bottom: 1px solid var(--line);
  padding: 6px 6px;
  font-size: 12px;
  white-space: nowrap;
  vertical-align: middle;
}
.rate-table thead th {
  color: var(--muted);
  background: var(--surface-3, var(--surface));
  font-weight: 700;
  letter-spacing: -0.02em;
}
.rate-table .rate-head { min-width: 72px; text-align: center; }
.rate-table .rate-status-head { min-width: 64px; text-align: center; }
.rate-table .rate-manage-head { min-width: 236px; text-align: center; }
.rate-table td.rate-num { text-align: center; padding: 4px 4px; }
.rate-table td.rate-status {
  text-align: center;
  white-space: nowrap;
}
.rate-table td.rate-manage {
  text-align: center;
  white-space: nowrap;
  min-width: 236px;
}
.rate-manage-actions {
  display: grid;
  grid-template-columns: minmax(52px, 1fr) minmax(52px, 1fr) 92px;
  width: 220px;
  gap: 4px;
  align-items: center;
  justify-items: stretch;
  margin: 0 auto;
  white-space: nowrap;
  vertical-align: middle;
}
.rate-bulk-head .rate-manage-actions {
  grid-template-columns: minmax(52px, 1fr) minmax(148px, 2fr);
  width: 220px;
}
.rate-manage-actions .btn {
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}
.rate-add-slot { display: block; min-height: 1px; }
.rate-voidbet-all-btn {
  padding-left: 4px;
  padding-right: 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.rate-voidbet-btn.is-on {
  color: #fff;
  border-color: #0f766e;
  background: #0d9488;
}
.rate-voidbet-btn.is-on:hover {
  color: #fff;
  background: #0f766e;
}
.rate-id-cell {
  position: sticky;
  left: 0;
  z-index: 2;
  min-width: 220px;
  background: var(--surface);
  box-shadow: 8px 0 10px -8px rgb(15 23 42 / .18);
}
.rate-table thead th:first-child {
  position: sticky;
  left: 0;
  z-index: 4;
  min-width: 220px;
  text-align: left;
}
.rate-id {
  display: flex;
  align-items: center;
  gap: 6px;
  padding-left: calc(var(--rate-depth, 0) * 16px);
}
.rate-id-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 1px;
  line-height: 1.2;
}
.rate-id-copy strong { font-size: 12px; font-weight: 700; }
.rate-id-copy small { color: var(--muted); font-size: 10px; }
.rate-input {
  display: block;
  box-sizing: border-box;
  width: 64px;
  height: 28px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  appearance: textfield;
  -moz-appearance: textfield;
}
.rate-input::-webkit-outer-spin-button,
.rate-input::-webkit-inner-spin-button {
  appearance: none;
  margin: 0;
}
.rate-input.is-zero { color: var(--muted); font-weight: 600; }
.rate-input:focus { color: var(--text); }
.rate-row.is-hq .rate-id-cell { box-shadow: inset 3px 0 0 #4b789f, 8px 0 10px -8px rgb(15 23 42 / .18); }
.rate-row.is-office .rate-id-cell { box-shadow: inset 3px 0 0 #7eb3dc, 8px 0 10px -8px rgb(15 23 42 / .18); }
.rate-row.is-master .rate-id-cell { box-shadow: inset 3px 0 0 #d4a017, 8px 0 10px -8px rgb(15 23 42 / .18); }
.rate-row.is-agent .rate-id-cell { box-shadow: inset 3px 0 0 #c45c5c, 8px 0 10px -8px rgb(15 23 42 / .18); }
.rate-row.is-shop .rate-id-cell { box-shadow: inset 3px 0 0 #5a9a6c, 8px 0 10px -8px rgb(15 23 42 / .18); }
.rate-row.is-member .rate-id-cell { box-shadow: inset 3px 0 0 #c08497, 8px 0 10px -8px rgb(15 23 42 / .18); }
.rate-row:hover td { background: var(--surface-2, #f4f7fb); }
.rate-row:hover .rate-id-cell { background: var(--surface-2, #f4f7fb); }
.rate-save-btn {
  color: #fff !important;
  border-color: #4b789f !important;
  background: #4b789f !important;
}
.rate-save-btn:hover { background: #3c678d !important; }
.rate-add-btn {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding-left: 4px;
  padding-right: 4px;
  text-align: center;
  color: #3d7a5a;
  border-color: #c5ddd0;
  background: #eef7f1;
}
.rate-add-btn:hover { color: #236344; background: #d7eee1; }
.modal.is-rate-add { width: min(760px, 100%); }
.modal.is-rate-bulk {
  width: min(1180px, calc(100vw - 28px));
}
.modal.is-rate-bulk .modal-head { padding: 14px 16px 10px; }
.modal.is-rate-bulk .modal-head h2 { font-size: 15px; font-weight: 750; letter-spacing: -0.02em; }
.modal.is-rate-bulk .modal-body { padding: 0 14px 14px; }
.rate-level-bulk { display: grid; gap: 10px; }
.rate-level-bulk-lead {
  display: grid;
  gap: 8px;
}
.rate-level-bulk-lead p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.rate-level-bulk-lead ul {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.rate-level-bulk-lead li {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-2, var(--surface));
  color: var(--text);
  font-size: 11px;
  font-weight: 650;
}
.rate-level-bulk-scroll {
  overflow: auto;
  max-height: min(64vh, 680px);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.rate-level-bulk-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.rate-level-bulk-table th,
.rate-level-bulk-table td {
  padding: 7px 4px;
  border-bottom: 1px solid var(--line);
  text-align: center;
  vertical-align: middle;
}
.rate-level-bulk-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--surface-2, #f4f7fb);
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  white-space: nowrap;
}
.rate-level-bulk-table tbody th {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 108px;
  padding-left: 10px;
  text-align: left;
  background: var(--surface);
  font-weight: 650;
  box-shadow: 1px 0 0 var(--line);
}
.rate-level-bulk-table tbody th small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 500;
}
.lv-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 20px;
  padding: 0 7px;
  border-radius: 999px;
  color: #0f766e;
  background: #ccfbf1;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.lv-chip.is-all {
  min-width: 48px;
  color: #8a5a00;
  background: #f8e7b0;
}
[data-theme="dark"] .lv-chip {
  color: #99f6e4;
  background: #134e4a;
}
[data-theme="dark"] .lv-chip.is-all {
  color: #fbbf24;
  background: #3f2e10;
}
.rate-level-bulk-table tbody tr.is-all th,
.rate-level-bulk-table tbody tr.is-all td {
  position: sticky;
  top: 32px;
  z-index: 2;
  background: #f7f1de;
}
.rate-level-bulk-table tbody tr.is-all th {
  z-index: 4;
  left: 0;
}
[data-theme="dark"] .rate-level-bulk-table tbody tr.is-all th,
[data-theme="dark"] .rate-level-bulk-table tbody tr.is-all td {
  background: #2a2616;
}
.rate-level-bulk-table tbody tr:last-child th,
.rate-level-bulk-table tbody tr:last-child td { border-bottom: 0; }
.rate-level-bulk-table tr.is-focus th,
.rate-level-bulk-table tr.is-focus td { background: var(--primary-soft, #eef5fb); }
.rate-level-bulk-table .rate-input { width: 58px; }
.rate-level-bulk-table .rate-input::placeholder {
  color: var(--muted);
  opacity: 0.72;
}
.rate-level-bulk-tools {
  min-width: 168px;
  white-space: nowrap;
}
.rate-level-bulk-tools .btn {
  min-height: 24px;
  height: 24px;
  padding: 0 8px;
  font-size: 10px;
  font-weight: 650;
}
[data-theme="dark"] .rate-level-bulk-lead li,
[data-theme="dark"] .rate-level-bulk-table thead th { background: #15202e; }
[data-theme="dark"] .rate-level-bulk-table tbody th { background: #121b27; }
[data-theme="dark"] .rate-level-bulk-table tr.is-focus th,
[data-theme="dark"] .rate-level-bulk-table tr.is-focus td { background: #173044; }
.rate-add-form { display: grid; gap: 14px; }
.rate-add-parent {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.rate-add-parent small { color: var(--muted); }
.rate-add-section {
  display: grid;
  gap: 10px;
  padding: 12px 12px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2, var(--surface));
}
.rate-add-section h3 {
  margin: 0;
  color: var(--text);
  font-size: 13px;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.rate-add-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 10px 12px;
  align-items: center;
}
.rate-add-row > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}
.rate-add-fields {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.rate-add-fields > .select { width: 148px; }
.rate-add-fields > .input { width: 72px; }
.rate-add-fields em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}
.rate-add-mini {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
}
.rate-add-mini i { font-style: normal; white-space: nowrap; }
.rate-add-mini .input,
.rate-add-mini .select { width: 110px; }
.rate-add-ref { position: relative; }
.rate-add-ref .input { width: 108px; padding-right: 30px; }
.rate-add-ref .btn {
  position: absolute;
  right: 2px;
  width: 26px;
  min-width: 26px;
  height: 24px;
  min-height: 24px;
  padding: 0;
}
.rate-add-ref .btn svg { width: 11px; height: 11px; }
.rate-add-hint {
  flex: 1 1 220px;
  margin: 0;
  padding: 7px 10px;
  border-radius: 6px;
  color: var(--info);
  background: var(--info-soft);
  font-size: 11px;
  line-height: 1.4;
}
.rate-add-preview {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}
.rate-add-pills { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.rate-add-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}
.rate-add-pill input { position: absolute; opacity: 0; pointer-events: none; }
.rate-add-pill:has(input:checked) {
  color: #fff;
  border-color: #4b789f;
  background: #4b789f;
}
.rate-add-split {
  margin-left: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}
.rate-add-form .is-hidden { display: none; }
[data-theme="dark"] .rate-add-section { background: #15202e; }
[data-theme="dark"] .rate-add-pill { background: #121b27; }
@media (max-width: 720px) {
  .rate-add-row { grid-template-columns: 1fr; gap: 6px; }
}
[data-theme="dark"] .rate-id-cell,
[data-theme="dark"] .rate-table thead th:first-child { background: #121b27; }
[data-theme="dark"] .rate-table thead th { background: #182333; }
[data-theme="dark"] .rate-bulk-head th { background: #15202e; }
[data-theme="dark"] .rate-legend-actions .btn {
  color: #d7e3ef;
  background: #121b27;
  border-color: #2a3b4e;
}
[data-theme="dark"] .rate-legend-actions .btn:hover {
  color: #fff;
  border-color: #3d5470;
  background: #1c2b3d;
}
[data-theme="dark"] .rate-row:hover td,
[data-theme="dark"] .rate-row:hover .rate-id-cell { background: #182333; }
[data-theme="dark"] .rate-add-btn {
  color: #86efac;
  border-color: #2f5a42;
  background: #1c3327;
}
[data-theme="dark"] .rate-add-btn:hover {
  color: #fff;
  border-color: #3f8a62;
  background: #2f6d4c;
}
[data-theme="dark"] .rate-voidbet-btn.is-on {
  color: #042f2e;
  border-color: #2dd4bf;
  background: #2dd4bf;
}
[data-theme="dark"] .rate-voidbet-btn.is-on:hover {
  color: #042f2e;
  background: #5eead4;
}
@media (max-width: 1100px) {
  .rate-table-scroll { max-height: none; }
}

.attend-layer {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: none;
  place-items: center;
  padding: 18px;
  background: rgb(7 16 28 / .58);
}
.attend-layer.open { display: grid; }
.attend-dialog {
  width: min(560px, 100%);
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 28px 64px rgb(0 0 0 / .38);
}
.attend-head {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: start;
  gap: 10px 12px;
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--line);
}
.attend-kicker {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.attend-nav {
  display: flex;
  align-items: center;
  gap: 8px;
}
.attend-nav h2 {
  margin: 0;
  min-width: 118px;
  text-align: center;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.04em;
}
.attend-who {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.attend-arrow {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-2, var(--surface));
  color: var(--text);
}
.attend-arrow svg { width: 16px; height: 16px; transform: rotate(180deg); }
.attend-arrow.is-next svg { transform: none; }
.attend-arrow:hover { background: var(--surface-3, var(--surface-2)); }
.attend-streak {
  display: grid;
  justify-items: end;
  min-width: 92px;
  padding: 8px 12px 7px;
  border-radius: 10px;
  background: linear-gradient(180deg, #2d6ea8, #3d86c4);
  color: #fff;
  line-height: 1.1;
}
.attend-streak span {
  font-size: 11px;
  font-weight: 700;
  opacity: .88;
}
.attend-streak strong {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.04em;
  font-variant-numeric: tabular-nums;
}
.attend-streak em {
  margin-left: 2px;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}
.attend-close { margin-top: -2px; }
.attend-week,
.attend-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  padding: 0 14px;
}
.attend-week {
  margin-top: 12px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}
.attend-week span:first-child { color: #ef9aa0; }
.attend-grid { padding-bottom: 6px; }
.attend-day {
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: #1b2838;
  color: #d7e3ef;
  cursor: pointer;
}
.attend-day.is-empty {
  background: transparent;
  cursor: default;
  pointer-events: none;
}
.attend-day b {
  font-size: 15px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.attend-mark {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: #16324a;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: -0.04em;
}
.attend-mark svg { width: 10px; height: 10px; }
.attend-mark.is-off { color: #7d8fa3; font-weight: 650; }
.attend-day.is-checked {
  color: #102033;
  background: #7eb6e8;
}
.attend-day.is-today {
  box-shadow: 0 0 0 2px #9fd0f5 inset;
}
.attend-day:hover:not(.is-empty) { filter: brightness(1.08); }
.attend-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 16px 14px;
  border-top: 1px solid var(--line);
}
.attend-foot p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}
.attend-foot b { color: var(--text); }
[data-theme="light"] .attend-day { background: #e8eef5; color: #314152; }
[data-theme="light"] .attend-day.is-checked { background: #7eb6e8; }
[data-theme="light"] .attend-mark.is-off { color: #7b8b9c; }
@media (max-width: 560px) {
  .attend-head { grid-template-columns: 1fr auto; }
  .attend-close { grid-column: 2; grid-row: 1; }
  .attend-streak { grid-column: 1 / -1; justify-items: start; }
}

.md-voidbet-status,
.md-voidbet-miss {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.md-voidbet-status em {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--surface-2, #edf2f7);
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}
.md-voidbet-status em.is-on {
  color: #1f6a4a;
  background: #d9efe4;
}
.md-field.is-voidbet-on {
  border-radius: 8px;
  padding: 4px 8px;
  background: rgb(13 148 136 / .12);
}
.md-field.is-voidbet-on > span {
  color: #0f766e;
  font-weight: 800;
}
.md-voidbet-btn.is-on {
  color: #fff;
  border-color: #0f766e;
  background: #0d9488;
}
.md-voidbet-btn.is-on:hover {
  color: #fff;
  background: #0f766e;
}
.md-voidbet-miss span { color: var(--muted); font-size: 12px; }
.md-voidbet-miss b { margin: 0 2px 0 4px; color: var(--text); font-variant-numeric: tabular-nums; }
.md-voidbet-miss small { color: var(--muted); }
.md-voidbet-miss .md-act-btn { margin-left: 2px; }

.voidbet-layer {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: none;
  place-items: center;
  padding: 18px;
  background: rgb(7 16 28 / .58);
}
.voidbet-layer.open { display: grid; }
.voidbet-dialog {
  width: min(860px, 100%);
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 28px 64px rgb(0 0 0 / .38);
}
.voidbet-head {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 10px 12px;
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--line);
}
.voidbet-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.04em;
}
.voidbet-who {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.voidbet-lead {
  margin: 0;
  padding: 12px 16px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.voidbet-current {
  display: grid;
  gap: 8px;
  margin: 12px 16px 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2, var(--surface));
}
.voidbet-current h3 {
  margin: 0 0 2px;
  font-size: 13px;
  font-weight: 750;
}
.voidbet-now {
  display: grid;
  grid-template-columns: 52px auto minmax(0, 1fr);
  gap: 8px 10px;
  align-items: center;
}
.voidbet-now b { font-size: 13px; }
.voidbet-now em {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 6px;
  background: #dce8f5;
  color: #24517a;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}
.voidbet-now p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}
.voidbet-now p.is-on { color: #c2185b; font-weight: 650; }
.voidbet-period {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px dashed var(--line);
}
.voidbet-period > span {
  margin-right: 4px;
  color: var(--text);
  font-size: 12px;
  font-weight: 750;
}
.voidbet-period small {
  color: var(--muted);
  font-size: 11px;
}
.voidbet-period-btn {
  min-height: 28px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  font-size: 11px;
  font-weight: 700;
}
.voidbet-period-btn:hover {
  border-color: #b8c7d5;
  background: #edf3f8;
}
.voidbet-period-btn.is-on {
  color: #fff;
  border-color: #3d7a5a;
  background: #2f6d4c;
}
.voidbet-miss-board {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  padding-top: 8px;
  border-top: 1px dashed var(--line);
  color: var(--muted);
  font-size: 12px;
}
.voidbet-miss-board strong {
  color: #b45309;
  font-variant-numeric: tabular-nums;
}
.voidbet-restore {
  margin-left: auto;
  min-height: 34px;
  padding: 0 16px;
  color: #fff;
  border: 1px solid #bd8933;
  border-radius: 8px;
  background: #c79535;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.voidbet-restore:hover {
  background: #ad7a26;
  color: #fff;
}
.md-voidbet-miss .voidbet-restore {
  margin-left: 2px;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 700;
}
.voidbet-card {
  margin: 12px 16px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.voidbet-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 12px;
}
.voidbet-card-head strong {
  min-width: 48px;
  font-size: 14px;
}
.voidbet-card-head .btn { margin-left: 0; }
.voidbet-card-head .btn-primary { margin-left: auto; }
.voidbet-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}
.voidbet-fields {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.voidbet-fields label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}
.voidbet-card:not(.is-personal) [data-vb-field] { opacity: .7; }
[data-theme="dark"] .voidbet-current { background: #15202e; }
[data-theme="dark"] .voidbet-now em { background: #24384d; color: #9ec3e6; }
[data-theme="dark"] .voidbet-now p.is-on { color: #f48fb1; }
[data-theme="dark"] .md-voidbet-status em.is-on { color: #b7e0c8; background: #1d332c; }
[data-theme="dark"] .md-field.is-voidbet-on { background: rgb(45 212 191 / .12); }
[data-theme="dark"] .md-field.is-voidbet-on > span { color: #5eead4; }
[data-theme="dark"] .md-voidbet-btn.is-on {
  color: #042f2e;
  border-color: #2dd4bf;
  background: #2dd4bf;
}
[data-theme="dark"] .md-voidbet-btn.is-on:hover {
  color: #042f2e;
  background: #5eead4;
}
[data-theme="dark"] .voidbet-miss-board strong { color: #f0c674; }
[data-theme="dark"] .voidbet-period-btn { background: #121b27; border-color: #2a3b4e; }
[data-theme="dark"] .voidbet-period-btn:hover { background: #173044; }
[data-theme="dark"] .voidbet-period-btn.is-on { color: #fff; border-color: #3f8a62; background: #2f6d4c; }
[data-theme="dark"] .voidbet-restore { color: #fff; border-color: #bd8933; background: #c79535; }
[data-theme="dark"] .voidbet-restore:hover { color: #fff; background: #ad7a26; }
@media (max-width: 860px) {
  .voidbet-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voidbet-now { grid-template-columns: 52px 1fr; }
  .voidbet-now p { grid-column: 1 / -1; }
  .voidbet-restore { width: 100%; margin-left: 0; }
}

.mm-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.mm-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 1 0 108px;
  height: 44px;
  min-height: 44px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--muted);
  padding: 0 8px;
  font-size: 12px;
  font-weight: 700;
}
.mm-tabs button strong {
  overflow: hidden;
  font-size: 12px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: inherit;
}
.mm-tabs button em {
  display: inline-grid;
  place-items: center;
  min-width: 22px;
  height: 20px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: var(--surface-3);
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}
.mm-tabs button.is-on {
  color: var(--text);
  border-color: var(--primary);
  background: var(--primary-soft);
  box-shadow: inset 0 0 0 1px var(--primary);
}
.mm-tabs button.is-on em { color: #fff; background: var(--primary); }
.mm-board {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  min-height: 560px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}
.mm-side {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 560px;
  border-right: 1px solid var(--line);
  background: var(--surface-2);
}
.mm-pane-head {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 52px;
  min-height: 52px;
  padding: 0 14px;
  border-bottom: 1px solid var(--line);
}
.mm-pane-head > div:first-child { min-width: 0; }
.mm-pane-head em,
.mm-pane-head .mm-switch { margin-left: auto; }
.mm-pane-head span, .mm-hint {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}
.mm-pane-head strong {
  display: block;
  overflow: hidden;
  font-size: 13px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mm-pane-head em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
  white-space: nowrap;
}
.mm-side-list {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: auto;
  padding: 8px;
  gap: 4px;
}
.mm-side-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 10px;
}
.mm-side-group:first-child { margin-top: 0; }
.mm-side-group > span {
  padding: 4px 10px 2px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
}
.mm-side-split {
  height: 1px;
  margin: 4px 6px 2px;
  background: var(--line);
}
.mm-side-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 40px;
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  padding: 0 10px;
  text-align: left;
}
.mm-side-item b { font-size: 12px; font-weight: 700; }
.mm-side-item.is-all b { color: var(--primary); }
.mm-side-item i {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  height: 20px;
  border-radius: 999px;
  background: var(--surface-3);
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}
.mm-side-item.is-live i { color: #047857; background: var(--success-soft); }
.mm-side-item.is-current {
  border-color: var(--primary);
  background: var(--primary-soft);
  box-shadow: inset 3px 0 0 var(--primary);
}
.mm-editor {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 560px;
  background: var(--surface);
}
.mm-work {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  flex: 1;
  min-height: 0;
}
.mm-form, .mm-preview-pane {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  padding: 14px;
}
.mm-preview-pane {
  border-left: 1px solid var(--line);
  background: var(--surface-2);
}
.mm-hint { margin: 0; }
.mm-editor .form-field { display: grid; gap: 6px; min-width: 0; }
.mm-editor .form-field > span { color: var(--muted); font-size: 11px; font-weight: 650; }
.mm-editor .input { width: 100%; min-width: 0; height: 36px; }
.mm-tokens { display: flex; flex-wrap: wrap; gap: 6px; min-height: 26px; align-items: center; }
.mm-tokens button {
  height: 26px;
  min-height: 26px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface);
  color: var(--info);
  padding: 0 10px;
  font-size: 11px;
  font-weight: 700;
}
.mm-preview {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 168px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.mm-preview span { color: var(--muted); font-size: 10px; font-weight: 750; letter-spacing: .04em; }
.mm-preview strong { display: block; margin-top: 8px; font-size: 13px; }
.mm-preview p { margin: 8px 0 0; font-size: 12px; line-height: 1.55; white-space: pre-wrap; }
.mm-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-height: 28px;
}
.mm-actions .btn {
  height: 28px;
  min-height: 28px;
  padding: 0 10px;
}
.mm-form [data-mm-tpl] {
  width: 100%;
  height: 36px;
}
.mm-switch { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; font-weight: 700; white-space: nowrap; }
.mm-tpl-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.mm-tpl-tools .btn {
  height: 32px;
  min-height: 32px;
  padding: 0 12px;
}
.mm-side-empty {
  margin: 0;
  padding: 8px 10px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}
.mm-body { flex: 0 0 auto; }
.mm-body textarea.input {
  height: 180px;
  min-height: 180px;
  resize: vertical;
  line-height: 1.55;
}
.mm-editor.is-off .mm-work { opacity: .48; }
[data-theme="dark"] .mm-tabs button { background: #121a24; }
[data-theme="dark"] .mm-tabs button.is-on { color: #e8eef6; background: #173044; }
[data-theme="dark"] .mm-board, [data-theme="dark"] .mm-editor, [data-theme="dark"] .mm-preview { background: #0f1620; }
[data-theme="dark"] .mm-side, [data-theme="dark"] .mm-preview-pane { background: #121b27; }
[data-theme="dark"] .mm-side-item.is-current { background: #173044; }
[data-theme="dark"] .mm-side-item.is-live i { color: #7ee0a8; background: rgb(46 184 120 / .16); }
[data-theme="dark"] .mm-tokens button { background: #15202e; }
@media (max-width: 1100px) {
  .mm-board, .mm-side, .mm-editor { min-height: 0; }
  .mm-board { grid-template-columns: 1fr; }
  .mm-side { border-right: 0; border-bottom: 1px solid var(--line); }
  .mm-side-list { max-height: 220px; }
  .mm-work { grid-template-columns: 1fr; }
  .mm-preview-pane { border-left: 0; border-top: 1px solid var(--line); }
}

.ob-page { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ob-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.ob-chip {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.ob-chip.is-domestic { color: #6e1c28; background: #d8b8be; }
.ob-chip.is-special { color: #145230; background: #b4d4c0; }
.ob-chip.is-overseas { color: #1e2c62; background: #b0b8d4; }
.ob-chip.is-live { color: #4a3810; background: #d0bc84; }
.ob-legend-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.ob-legend-actions strong {
  margin-right: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.ob-legend-actions .btn {
  height: 32px;
  min-height: 32px;
  padding: 0 12px;
}
.ob-legend-actions .btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}
.ob-card { overflow: auto; max-width: 100%; }
.ob-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 10px;
}
.ob-table th,
.ob-table td {
  border-right: 1px dashed rgb(0 0 0 / .38);
  border-bottom: 1px dashed rgb(0 0 0 / .38);
  white-space: nowrap;
}
.ob-lv-h,
.ob-lv-cell,
.ob-group-h {
  background: var(--surface-2);
}
.ob-lv-h {
  width: 42px;
  min-width: 42px;
  padding: 6px 4px;
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: -0.04em;
  text-align: center;
  vertical-align: middle;
  box-shadow: 2px 0 0 var(--line);
}
.ob-group-h {
  height: 38px;
  padding: 6px 8px 5px;
  text-align: center;
  line-height: 1.15;
  border-bottom: 0;
}
.ob-group-h strong {
  display: inline;
  margin-right: 6px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.ob-group-h small {
  margin-right: 6px;
  font-size: 10px;
  font-weight: 700;
  opacity: .82;
}
.ob-group-h span {
  font-size: 10px;
  font-weight: 600;
  opacity: .72;
}
.ob-sport,
.ob-mkt-h {
  height: 32px;
  padding: 3px 2px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -0.04em;
  text-align: center;
  line-height: 1.15;
  white-space: normal;
}
.ob-sport { min-width: 30px; width: 30px; }
.ob-mkt-h { min-width: 44px; width: 44px; }
.ob-lv-cell {
  width: 42px;
  min-width: 42px;
  padding: 0;
  text-align: center;
  vertical-align: middle;
  box-shadow: 2px 0 0 var(--line);
}
.ob-lv-cell span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  border-radius: 8px;
  color: var(--text);
  background: var(--surface);
  font-size: 15px;
  font-weight: 800;
  box-shadow: inset 0 0 0 1px var(--line);
}
.ob-mkt {
  width: 44px;
  min-width: 44px;
  padding: 0 4px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -0.05em;
  text-align: center;
}
.ob-num {
  width: 30px;
  min-width: 30px;
  padding: 0;
}
.ob-table tbody .ob-mkt,
.ob-table tbody .ob-num {
  height: 24px;
}
.ob-mkt.is-empty,
.ob-num.is-empty {
  height: 24px;
}
.ob-input {
  width: 100%;
  height: 24px;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: inherit;
  caret-color: currentColor;
  -webkit-text-fill-color: currentColor;
  color-scheme: light;
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: center;
}
.ob-input:focus {
  outline: 2px solid #4f6ef7;
  outline-offset: -1px;
  background: rgb(255 255 255 / .32);
  color: inherit;
  -webkit-text-fill-color: currentColor;
  border-radius: 3px;
}
.ob-input.is-neg { color: #c2414c; font-weight: 700; }
.ob-g-domestic { color: #5a1822; background: #c9a8ae; }
.ob-group-h.ob-g-domestic,
.ob-sport.ob-g-domestic,
.ob-mkt-h.ob-g-domestic { color: #f4e4e6; background: #6e2a34; }
.ob-mkt.ob-g-domestic { background: #b89298; }
.ob-g-special { color: #123c28; background: #8fbf9e; }
.ob-group-h.ob-g-special,
.ob-sport.ob-g-special,
.ob-mkt-h.ob-g-special { color: #e4f4ea; background: #1e5234; }
.ob-mkt.ob-g-special { background: #7aab8c; }
.ob-g-overseas { color: #1a2458; background: #8e9bc4; }
.ob-group-h.ob-g-overseas,
.ob-sport.ob-g-overseas,
.ob-mkt-h.ob-g-overseas { color: #e8ecf8; background: #2a3870; }
.ob-mkt.ob-g-overseas { background: #7b88b4; }
.ob-g-live { color: #3c2e0c; background: #b8a06a; }
.ob-group-h.ob-g-live,
.ob-sport.ob-g-live,
.ob-mkt-h.ob-g-live { color: #f4ead0; background: #5c4818; }
.ob-mkt.ob-g-live { background: #a8905c; }
.ob-row.is-lv-2 .ob-num.ob-g-domestic { background: #be9ea4; }
.ob-row.is-lv-2 .ob-num.ob-g-special { background: #86b696; }
.ob-row.is-lv-2 .ob-num.ob-g-overseas { background: #8490ba; }
.ob-row.is-lv-2 .ob-num.ob-g-live { background: #ae9662; }
[data-theme="dark"] .ob-chip.is-domestic { color: #e8c4ca; background: #3a1820; }
[data-theme="dark"] .ob-chip.is-special { color: #b4dcc4; background: #123025; }
[data-theme="dark"] .ob-chip.is-overseas { color: #c0c8e8; background: #1a243f; }
[data-theme="dark"] .ob-chip.is-live { color: #e0d0a0; background: #2a2418; }
[data-theme="dark"] .ob-table th,
[data-theme="dark"] .ob-table td { border-color: rgb(0 0 0 / .42); }
[data-theme="dark"] .ob-lv-h,
[data-theme="dark"] .ob-lv-cell { background: #141c2b; }
[data-theme="dark"] .ob-lv-cell span { background: #1c2638; }
[data-theme="dark"] .ob-g-domestic { color: #5a1822; background: #c9a8ae; }
[data-theme="dark"] .ob-group-h.ob-g-domestic,
[data-theme="dark"] .ob-sport.ob-g-domestic,
[data-theme="dark"] .ob-mkt-h.ob-g-domestic { color: #f4e4e6; background: #6e2a34; }
[data-theme="dark"] .ob-mkt.ob-g-domestic { background: #b89298; }
[data-theme="dark"] .ob-g-special { color: #123c28; background: #8fbf9e; }
[data-theme="dark"] .ob-group-h.ob-g-special,
[data-theme="dark"] .ob-sport.ob-g-special,
[data-theme="dark"] .ob-mkt-h.ob-g-special { color: #e4f4ea; background: #1e5234; }
[data-theme="dark"] .ob-mkt.ob-g-special { background: #7aab8c; }
[data-theme="dark"] .ob-g-overseas { color: #1a2458; background: #8e9bc4; }
[data-theme="dark"] .ob-group-h.ob-g-overseas,
[data-theme="dark"] .ob-sport.ob-g-overseas,
[data-theme="dark"] .ob-mkt-h.ob-g-overseas { color: #e8ecf8; background: #2a3870; }
[data-theme="dark"] .ob-mkt.ob-g-overseas { background: #7b88b4; }
[data-theme="dark"] .ob-g-live { color: #3c2e0c; background: #b8a06a; }
[data-theme="dark"] .ob-group-h.ob-g-live,
[data-theme="dark"] .ob-sport.ob-g-live,
[data-theme="dark"] .ob-mkt-h.ob-g-live { color: #f4ead0; background: #5c4818; }
[data-theme="dark"] .ob-mkt.ob-g-live { background: #a8905c; }
[data-theme="dark"] .ob-row.is-lv-2 .ob-num.ob-g-domestic { background: #be9ea4; }
[data-theme="dark"] .ob-row.is-lv-2 .ob-num.ob-g-special { background: #86b696; }
[data-theme="dark"] .ob-row.is-lv-2 .ob-num.ob-g-overseas { background: #8490ba; }
[data-theme="dark"] .ob-row.is-lv-2 .ob-num.ob-g-live { background: #ae9662; }
[data-theme="dark"] .ob-input.is-neg { color: #8a2430; }

.md-os-layer {
  position: fixed;
  inset: 0;
  z-index: 92;
  display: none;
  place-items: center;
  padding: 18px;
  background: rgb(4 10 18 / .62);
}
.md-os-layer.open { display: grid; }

.md-child-layer {
  position: fixed;
  inset: 0;
  z-index: 96;
  display: none;
  place-items: center;
  padding: 18px;
  background: rgb(7 16 28 / .58);
}
.md-child-layer.open { display: grid; }
.md-child-dialog {
  width: min(1180px, calc(100vw - 28px));
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 32px 80px rgb(0 0 0 / .5);
}
.md-child-dialog.is-ticket { width: min(520px, calc(100vw - 28px)); }
.md-child-dialog.is-ip-history { width: min(640px, calc(100vw - 28px)); }
.md-child-head {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 10px 12px;
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--line);
}
.md-child-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.04em;
}
.md-child-head p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.md-child-body { padding: 14px 16px 16px; }
.md-child-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 16px 16px;
  border-top: 1px solid var(--line);
}
.ref-list-sum {
  flex-wrap: wrap;
  overflow: visible;
  margin-bottom: 12px;
  border-top: 1px solid var(--line);
}
.ref-list-sum .negative { color: #fb7185; }
.ref-list-sum .positive { color: #34d399; }
.ref-list-table { min-width: 980px; }
.ref-list-table .numeric.negative { color: #fb7185; }
.ref-list-table .numeric.positive { color: #34d399; }
.ref-list-table .account-cell .link {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.md-embed .mm-table {
  table-layout: fixed;
  width: 100%;
}
.md-embed .mm-table.is-md-money .mm-col-seq { width: 8%; }
.md-embed .mm-table.is-md-money .mm-col-group { width: 7%; }
.md-embed .mm-table.is-md-money .mm-col-kind { width: 12%; }
.md-embed .mm-table.is-md-money .mm-col-game { width: 9%; }
.md-embed .mm-table.is-md-money .mm-col-memo { width: 25%; }
.md-embed .mm-table.is-md-money .mm-col-bal { width: 10%; }
.md-embed .mm-table.is-md-money .mm-col-hold { width: 11%; }
.md-embed .mm-table.is-md-money .mm-col-when { width: 8%; }
.md-embed .mm-table.is-md-point .mm-col-seq { width: 7%; }
.md-embed .mm-table.is-md-point .mm-col-group { width: 7%; }
.md-embed .mm-table.is-md-point .mm-col-kind { width: 12%; }
.md-embed .mm-table.is-md-point .mm-col-game { width: 8%; }
.md-embed .mm-table.is-md-point .mm-col-memo { width: 22%; }
.md-embed .mm-table.is-md-point .mm-col-bal { width: 9%; }
.md-embed .mm-table.is-md-point .mm-col-hold { width: 10%; }
.md-embed .mm-table.is-md-point .mm-col-op { width: 7%; }
.md-embed .mm-table.is-md-point .mm-col-when { width: 9%; }
.md-embed .mm-col-memo {
  overflow: hidden;
}
.md-embed .mm-memo {
  display: block;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: keep-all;
}
.md-embed .mm-table .wd-when span { white-space: nowrap; }
.md-embed .wd-table.is-md-io {
  table-layout: fixed;
  width: 100%;
}
.md-embed .wd-table.is-md-io .acct-account-cell {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

.md-os-dialog {
  width: min(980px, calc(100vw - 28px));
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #101824;
  box-shadow: 0 32px 80px rgb(0 0 0 / .5);
}
.md-os-head {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 10px 12px;
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--line);
}
.md-os-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.04em;
}
.md-os-who {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.md-os-lead {
  margin: 0;
  padding: 12px 16px 10px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.md-os-board {
  display: grid;
  gap: 8px;
  padding: 0 16px 12px;
}
.md-os-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / .08);
  border-radius: 8px;
}
.md-os-table th,
.md-os-table td {
  border: 1px solid rgb(255 255 255 / .1);
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.03em;
}
.md-os-kind,
.md-os-key {
  width: 72px;
  color: #e8eef6;
  background: #0c121a;
  font-size: 12px;
  font-weight: 800;
}
.md-os-banner {
  padding: 7px 8px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.md-os-banner strong {
  margin-right: 6px;
  font-size: 13px;
}
.md-os-banner small {
  margin-right: 8px;
  font-size: 11px;
  font-weight: 700;
  opacity: .88;
}
.md-os-banner span {
  font-size: 11px;
  font-weight: 650;
  opacity: .78;
}
.md-os-sport {
  height: 28px;
  padding: 0 4px;
  font-size: 11px;
  font-weight: 800;
}
.md-os-market {
  width: 72px;
  padding: 0 8px;
  color: #e8eef6;
  background: #0c121a;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
.md-os-num {
  height: 32px;
  padding: 0;
}
.md-os-input {
  width: 100%;
  height: 32px;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: center;
}
.md-os-input:focus {
  outline: 1px solid var(--primary);
  background: rgb(0 0 0 / .22);
}
.md-os-input.is-neg { color: #f0a0a8; }
.md-os-table.is-domestic .md-os-banner,
.md-os-table.is-domestic .md-os-sport {
  color: #ffe4e8;
  background: #6e2a36;
}
.md-os-table.is-domestic .md-os-num { color: #f3c9d0; background: #2a151b; }
.md-os-table.is-special .md-os-banner,
.md-os-table.is-special .md-os-sport {
  color: #ddf8e8;
  background: #1e5a3c;
}
.md-os-table.is-special .md-os-num { color: #b7e4c7; background: #12241c; }
.md-os-table.is-overseas .md-os-banner,
.md-os-table.is-overseas .md-os-sport {
  color: #e4eaff;
  background: #2e3f78;
}
.md-os-table.is-overseas .md-os-num { color: #c5d0f4; background: #151c33; }
.md-os-table.is-live .md-os-banner,
.md-os-table.is-live .md-os-sport {
  color: #fff1cc;
  background: #6b5420;
}
.md-os-table.is-live .md-os-num { color: #ead7a0; background: #241e12; }
.md-os-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 16px 16px;
  border-top: 1px solid var(--line);
}
.md-os-foot .btn { min-width: 84px; }

.pb-work {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  gap: 16px;
  align-items: start;
  margin-bottom: 16px;
  min-width: 0;
}
.pb-work.pb-work-solo { grid-template-columns: minmax(0, 1fr); }
.pb-editor { display: grid; gap: 12px; }
.pb-preview-card { padding: 16px 16px 18px; position: sticky; top: 12px; min-width: 0; overflow: hidden; }
.pb-preview {
  overflow: auto;
  max-height: calc(100vh - 220px);
  border: 1px solid #1c2736;
  border-radius: 20px;
  padding: 18px;
  background: #0c121a;
  container-type: inline-size;
  container-name: pbpreview;
}
.pb-user { display: grid; gap: 12px; color: #d5e0ee; }
.pb-user.is-off { opacity: .55; }
.pb-off {
  border: 1px dashed #3b4b60;
  border-radius: 12px;
  padding: 8px 12px;
  color: #f2c14e;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  background: rgb(242 193 78 / .08);
}
.pb-user-period {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-self: stretch;
  justify-content: flex-end;
  max-width: 100%;
  height: 36px;
  padding: 0 14px 0 10px;
  border: 1px solid #243041;
  border-radius: 12px;
  background: #151c27;
  color: #9aabc0;
  font-size: 12px;
  box-sizing: border-box;
}
.pb-user-period .pb-mark {
  width: 22px;
  height: 22px;
  background: #1d2a3a;
  color: #8eb8e4;
}
.pb-user-period b { color: #eef4fb; font-weight: 800; letter-spacing: .01em; }
.pb-user-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.pb-user-hero > * { min-width: 0; }
.pb-user-stat,
.pb-user-progress,
.pb-user-guide {
  border: 1px solid #243041;
  border-radius: 16px;
  background: #151c27;
}
.pb-user-stat {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 108px;
  padding: 14px 12px;
}
.pb-user-stat em {
  display: block;
  color: #8ea0b5;
  font-size: 11px;
  font-style: normal;
}
.pb-user-stat strong {
  display: block;
  margin: 4px 0 2px;
  color: #f3f7fc;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.pb-user-stat strong small {
  color: #c9d6e6;
  font-size: 13px;
  font-weight: 700;
}
.pb-user-stat p {
  margin: 0;
  color: #7d8fa4;
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pb-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 50%;
  background: #1e3a58;
  color: #8ec4ea;
}
.pb-mark svg { width: 18px; height: 18px; stroke-width: 1.8; }
.pb-rate .pb-mark { background: #1a2838; color: #8eb8e4; }
.pb-user-cta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  min-height: 108px;
  padding: 16px 18px;
  border: 0;
  border-radius: 16px;
  background: #7eb8ea;
  color: #0d2740;
  text-align: left;
  cursor: pointer;
}
.pb-user-cta b { font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.pb-user-cta span {
  display: -webkit-box;
  overflow: hidden;
  color: rgb(13 39 64 / .72);
  font-size: 11px;
  line-height: 1.4;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.pb-user-cta.is-auto { background: #3d6f99; color: #eaf4ff; }
.pb-user-cta.is-auto span { color: rgb(234 244 255 / .78); }
.pb-user-cta.is-empty { opacity: .55; }
.pb-user-mid {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 10px;
}
.pb-user-progress { padding: 16px 16px 14px; }
.pb-user-progress-head,
.pb-user-guide-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.pb-user-progress-head strong,
.pb-user-guide-head strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #eef4fb;
  font-size: 13px;
}
.pb-user-progress-head .pb-mark {
  width: 22px;
  height: 22px;
  flex-basis: 22px;
  background: #1e3a58;
}
.pb-user-progress-head .pb-mark svg { width: 12px; height: 12px; }
.pb-user-progress-head em {
  color: #8ea0b5;
  font-size: 11px;
  font-style: normal;
}
.pb-bar {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #243041;
}
.pb-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #7eb8ea;
}
.pb-user-progress p {
  margin: 10px 0 0;
  color: #8ea0b5;
  font-size: 12px;
}
.pb-user-guide { padding: 16px 16px 12px; }
.pb-user-guide-head button {
  border: 0;
  background: none;
  color: #8eb8e4;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.pb-user-guide ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.pb-user-guide li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #9aabc0;
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.pb-user-guide li::before {
  content: "";
  width: 6px;
  height: 6px;
  margin-top: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: #7eb8ea;
}
.pb-rates { display: grid; gap: 8px; }
.pb-rate {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
}
.pb-rate.is-on {
  border-color: color-mix(in srgb, var(--info) 35%, var(--line));
  background: var(--surface);
}
.pb-rate strong { display: block; margin-bottom: 6px; font-size: 13px; }
.pb-members { display: grid; gap: 12px; }
.pb-members-head { padding-bottom: 4px; }
.pb-members-head .attb-card-head { margin-bottom: 0; }

@media (max-width: 1180px) {
  .pb-work,
  .pb-user-hero,
  .pb-user-mid { grid-template-columns: 1fr; }
  .pb-preview { max-height: none; }
  .pb-preview-card { position: static; }
  .pb-user-period { justify-self: start; }
}
@container pbpreview (max-width: 720px) {
  .pb-user-hero { grid-template-columns: 1fr 1fr; }
  .pb-user-mid { grid-template-columns: 1fr; }
}

.cp-user { display: grid; gap: 12px; color: #d5e0ee; }
.cp-user.is-off { opacity: .55; }
.cp-user-head h3 {
  margin: 6px 0 4px;
  color: #eef4fb;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -.02em;
}
.cp-user-head p { margin: 0; color: #8ea0b5; font-size: 12px; }
.cp-crumb {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #6f8196;
  font-size: 11px;
}
.cp-crumb i { font-style: normal; opacity: .6; }
.cp-user-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.cp-kpi,
.cp-convert,
.cp-guide {
  border: 1px solid #243041;
  border-radius: 16px;
  background: #151c27;
}
.cp-kpi {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 84px;
  padding: 14px 14px;
}
.cp-kpi em {
  display: block;
  color: #8ea0b5;
  font-size: 11px;
  font-style: normal;
}
.cp-kpi strong {
  display: block;
  margin-top: 4px;
  color: #f3f7fc;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.cp-kpi strong.is-up { color: #3dd68c; }
.cp-kpi strong.is-gold { color: #e0c36a; }
.cp-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 12px;
  background: #1e3a58;
  color: #8ec4ea;
}
.cp-mark svg { width: 18px; height: 18px; stroke-width: 1.8; }
.cp-mark.is-calendar,
.cp-mark.is-chart { background: #163528; color: #3dd68c; }
.cp-mark.is-won { background: #3a2e12; color: #e0c36a; }
.cp-mark.is-diamond { background: #1a2838; color: #8eb8e4; }
.cp-mark.is-crown { width: 22px; height: 22px; flex-basis: 22px; background: #3a2e12; color: #e0c36a; }
.cp-mark.is-crown svg { width: 12px; height: 12px; }
.cp-user-body {
  display: grid;
  grid-template-columns: 1.35fr .85fr;
  gap: 10px;
  min-width: 0;
}
.cp-convert,
.cp-guide { min-width: 0; padding: 16px; }
.cp-convert h4,
.cp-guide h4 {
  margin: 0 0 14px;
  color: #eef4fb;
  font-size: 14px;
}
.cp-convert-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: start;
}
.cp-convert-input { grid-column: 1 / -1; }
.cp-convert-bal em,
.cp-convert-rate em,
.cp-convert-input label {
  display: block;
  margin-bottom: 6px;
  color: #8ea0b5;
  font-size: 11px;
  font-style: normal;
}
.cp-convert-bal b {
  color: #f3f7fc;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -.02em;
}
.cp-amount {
  position: relative;
}
.cp-amount .input { padding-right: 28px; }
.cp-amount span {
  position: absolute;
  top: 50%;
  right: 10px;
  color: #8ea0b5;
  font-size: 12px;
  transform: translateY(-50%);
}
.cp-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.cp-chips button {
  height: 26px;
  padding: 0 10px;
  border: 1px solid #2a3a4e;
  border-radius: 8px;
  background: #101722;
  color: #c9d6e6;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.cp-chips button.is-on {
  border-color: #7eb8ea;
  background: rgb(126 184 234 / .12);
  color: #d7ecff;
}
.cp-convert-rate small {
  display: block;
  margin: 10px 0 2px;
  color: #8ea0b5;
  font-size: 11px;
}
.cp-convert-rate b,
.cp-convert-rate strong {
  display: block;
  color: #f3f7fc;
  font-weight: 800;
}
.cp-convert-rate strong { font-size: 18px; letter-spacing: -.02em; }
.cp-cta {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  grid-column: 1 / -1;
  min-height: 52px;
  padding: 12px 16px;
  border: 0;
  border-radius: 12px;
  background: #7eb8ea;
  color: #0d2740;
  text-align: left;
  cursor: pointer;
}
.cp-cta b { font-size: 16px; font-weight: 800; }
.cp-cta span { color: rgb(13 39 64 / .72); font-size: 11px; line-height: 1.4; }
.cp-guide ul {
  display: grid;
  gap: 10px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}
.cp-guide li {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 8px;
  color: #c9d6e6;
  font-size: 12px;
}
.cp-guide li .cp-mark { width: 22px; height: 22px; flex-basis: 22px; border-radius: 50%; }
.cp-guide li .cp-mark svg { width: 11px; height: 11px; }
.cp-guide li b { color: #8ea0b5; font-weight: 500; font-size: 11px; }
.cp-guide li em { color: #f3f7fc; font-style: normal; font-weight: 800; }
.cp-grade {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 12px;
  align-items: center;
}
.cp-grade strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #eef4fb;
  font-size: 12px;
  grid-column: 1;
}
.cp-grade span { color: #8ea0b5; font-size: 12px; font-weight: 700; }
.cp-bar {
  grid-column: 1 / -1;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #243041;
}
.cp-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #7eb8ea;
}
.cp-user-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid #243041;
  border-radius: 14px;
  background: #151c27;
  color: #8ea0b5;
  font-size: 11px;
}
.cp-days { display: inline-flex; gap: 4px; }
.cp-days span {
  padding: 4px 8px;
  border-radius: 8px;
  background: #101722;
}
.cp-days .is-on { background: #2a3a4e; color: #eef4fb; font-weight: 700; }
.cp-user-filter em {
  padding: 4px 10px;
  border-radius: 8px;
  background: #3d6f99;
  color: #eaf4ff;
  font-style: normal;
  font-weight: 700;
}
.cp-user-filter b { margin-left: auto; color: #c9d6e6; font-weight: 600; }
.pb-rate .cp-mark { background: #1a2838; color: #8eb8e4; }

@media (max-width: 1180px) {
  .cp-user-body,
  .cp-convert-row { grid-template-columns: 1fr; }
}
@container pbpreview (max-width: 860px) {
  .cp-user-body,
  .cp-convert-row { grid-template-columns: 1fr; }
}
@container pbpreview (min-width: 980px) {
  .cp-user-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.la-page { display: flex; flex-direction: column; gap: 10px; min-width: 0; width: 100%; }
.content:has(.la-page) {
  min-width: 0 !important;
  max-width: 100%;
  overflow-x: hidden;
}
.content:has(.la-page) .page-head { flex-wrap: wrap; }
.content:has(.la-page) .head-actions { flex-wrap: wrap; justify-content: flex-end; }
.la-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  min-width: 0;
}
.la-toolbar p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.la-toolbar p b { color: var(--text); }
.la-toolbar > strong {
  margin-left: auto;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.head-actions [data-la] {
  height: 32px;
  min-height: 32px;
  padding: 0 12px;
}
.head-actions [data-la]:disabled {
  opacity: .45;
  cursor: not-allowed;
}
.la-card { overflow: hidden; min-width: 0; max-width: 100%; width: 0; min-width: 100%; }
.la-scroll {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: calc(100vh - 240px);
  min-width: 0;
  max-width: 100%;
  border-radius: 12px;
}
.la-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 10px;
}
.la-table th,
.la-table td {
  border-right: 1px solid rgb(0 0 0 / .1);
  border-bottom: 1px solid rgb(0 0 0 / .1);
}
.la-table th.la-lv-h,
.la-table th.la-rank-h,
.la-table th.la-use-h,
.la-table th.la-lv,
.la-table td.la-rank,
.la-table td.la-use {
  padding: 0;
  text-align: center;
  vertical-align: middle;
  white-space: normal;
  background: var(--surface-2);
}
.la-lv-h,
.la-lv,
.la-rank-h,
.la-rank {
  width: 48px;
  min-width: 48px;
}
.la-use-h,
.la-use {
  width: 48px;
  min-width: 48px;
}
.la-lv-h,
.la-rank-h,
.la-use-h {
  color: var(--text);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -0.05em;
  line-height: 1.15;
}
.la-group {
  height: 32px;
  padding: 3px 4px 2px;
  text-align: left;
  line-height: 1.1;
  border-bottom: 0;
}
.la-group strong {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: -0.03em;
  word-break: keep-all;
}
.la-group span {
  font-size: 9px;
  font-weight: 600;
  opacity: .72;
}
.la-col {
  height: 34px;
  padding: 2px 2px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: -0.05em;
  text-align: center;
  line-height: 1.15;
  white-space: normal;
  word-break: keep-all;
}
.la-table thead th {
  position: sticky;
  top: 0;
  z-index: 4;
}
.la-table thead tr:nth-child(2) th { top: 32px; }
.la-table thead .la-lv-h,
.la-table thead .la-rank-h,
.la-table thead .la-use-h { z-index: 5; }
.la-rank {
  height: 44px;
}
.la-rank-icon {
  display: block;
  width: 38px;
  height: 38px;
  margin: 0 auto;
  object-fit: contain;
  background: transparent;
  pointer-events: none;
}
.la-rank-svg {
  display: block;
  width: 26px;
  height: 26px;
  margin: 0 auto;
  overflow: visible;
  background: transparent;
  filter: drop-shadow(0 1px 1px rgb(0 0 0 / .4));
}
.la-lv span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin: 0 auto;
  padding: 0;
  border-radius: 6px;
  color: var(--text);
  background: var(--surface);
  font-size: 11px;
  font-weight: 800;
  box-shadow: inset 0 0 0 1px var(--line);
}
.la-lv span.is-all {
  width: auto;
  min-width: 22px;
  padding: 0 5px;
  color: #dbeafe;
  background: #1d4ed8;
  box-shadow: none;
  font-size: 10px;
}
.la-use { text-align: center; vertical-align: middle; }
.la-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 24px;
  margin: 0;
}
.la-check input {
  width: 13px;
  height: 13px;
  margin: 0;
  accent-color: var(--primary);
}
.la-num { min-width: 0; padding: 0; overflow: hidden; }
.la-input {
  width: 100%;
  min-width: 0;
  height: 24px;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.04em;
  text-align: right;
}
.la-input::placeholder { color: var(--muted); opacity: .7; font-weight: 600; }
.la-input:focus {
  outline: 1px solid var(--primary);
  background: var(--surface);
  border-radius: 3px;
}
.la-row-all .la-input { font-weight: 700; }
.la-row-all td,
.la-row-all th,
.la-row-all .la-lv,
.la-row-all .la-rank,
.la-row-all .la-use { background: #1e3a5f; }
.la-g-charge { color: #d7e3f2; background: #243044; }
.la-group.la-g-charge,
.la-col.la-g-charge { color: #e8f1fb; background: #3d4f6a; }
.la-g-sport { color: #cfead8; background: #1c3328; }
.la-group.la-g-sport,
.la-col.la-g-sport { color: #e9f8ee; background: #2f6b48; }
.la-g-live { color: #f3e2b4; background: #3a2e16; }
.la-group.la-g-live,
.la-col.la-g-live { color: #fff4d6; background: #8a6a28; }
.la-g-mini { color: #c9e7f4; background: #1a3140; }
.la-group.la-g-mini,
.la-col.la-g-mini { color: #e5f6ff; background: #2b6380; }
.la-g-slot { color: #e4d4f4; background: #2d2140; }
.la-group.la-g-slot,
.la-col.la-g-slot { color: #f4e9ff; background: #62408a; }
.la-g-limit { color: #e4e4ea; background: #2a2d38; }
.la-group.la-g-limit,
.la-col.la-g-limit { color: #f3f3f7; background: #4a5160; }
.la-row.is-lv-2 .la-num.la-g-charge { background: #28364c; }
.la-row.is-lv-2 .la-num.la-g-sport { background: #20392d; }
.la-row.is-lv-2 .la-num.la-g-live { background: #423318; }
.la-row.is-lv-2 .la-num.la-g-mini { background: #1e3848; }
.la-row.is-lv-2 .la-num.la-g-slot { background: #332448; }
.la-row.is-lv-2 .la-num.la-g-limit { background: #323640; }
[data-theme="light"] .la-lv span.is-all { color: #fff; background: #2563eb; }
[data-theme="light"] .la-row-all td,
[data-theme="light"] .la-row-all th,
[data-theme="light"] .la-row-all .la-lv,
[data-theme="light"] .la-row-all .la-rank,
[data-theme="light"] .la-row-all .la-use { background: #dbe7f8; }
[data-theme="light"] .la-g-charge { color: #243044; background: #e7eef8; }
[data-theme="light"] .la-group.la-g-charge,
[data-theme="light"] .la-col.la-g-charge { color: #fff; background: #4a6284; }
[data-theme="light"] .la-g-sport { color: #1c3328; background: #def3e6; }
[data-theme="light"] .la-group.la-g-sport,
[data-theme="light"] .la-col.la-g-sport { color: #fff; background: #2f7a4a; }
[data-theme="light"] .la-g-live { color: #3a2e16; background: #f4ead0; }
[data-theme="light"] .la-group.la-g-live,
[data-theme="light"] .la-col.la-g-live { color: #fff8e8; background: #8a6a28; }
[data-theme="light"] .la-g-mini { color: #1a3140; background: #d7eef8; }
[data-theme="light"] .la-group.la-g-mini,
[data-theme="light"] .la-col.la-g-mini { color: #fff; background: #2b6380; }
[data-theme="light"] .la-g-slot { color: #2d2140; background: #eee4f8; }
[data-theme="light"] .la-group.la-g-slot,
[data-theme="light"] .la-col.la-g-slot { color: #fff; background: #62408a; }
[data-theme="light"] .la-g-limit { color: #2a2d38; background: #ececf2; }
[data-theme="light"] .la-group.la-g-limit,
[data-theme="light"] .la-col.la-g-limit { color: #fff; background: #4a5160; }
[data-theme="light"] .la-table th,
[data-theme="light"] .la-table td { border-color: rgb(0 0 0 / .12); }
[data-theme="dark"] .la-table th,
[data-theme="dark"] .la-table td { border-color: rgb(255 255 255 / .08); }
[data-theme="dark"] .la-lv-h,
[data-theme="dark"] .la-rank-h,
[data-theme="dark"] .la-use-h,
[data-theme="dark"] .la-lv,
[data-theme="dark"] .la-rank,
[data-theme="dark"] .la-use { background: #141c2b; }
[data-theme="dark"] .la-lv span { background: #1c2638; }

@media (max-width: 1180px) {
  .la-toolbar > strong { margin-left: 0; }
  .la-scroll { max-height: calc(100vh - 280px); }
}

.gt-page { display: flex; flex-direction: column; gap: 10px; min-width: 0; width: 100%; }
.content:has(.gt-page) {
  min-width: 0 !important;
  max-width: 100%;
  overflow-x: hidden;
}
.gt-tabs.attb-tabs {
  width: 100%;
  min-width: 0;
  margin-bottom: 0;
}
.gt-tabs.attb-tabs-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gt-tabs.attb-tabs button {
  min-height: 40px;
  padding: 7px 4px;
  font-size: 12px;
  line-height: 1.25;
  white-space: normal;
  word-break: keep-all;
}
.mm-event-tabs.attb-tabs {
  width: 100%;
  min-width: 0;
  margin-bottom: 0;
  grid-template-columns: repeat(13, minmax(0, 1fr));
}
.mm-event-tabs.attb-tabs button {
  min-height: 40px;
  padding: 7px 2px;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mm-page.is-event-money .wd-filter-bar { border-top: 0; }
.gt-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.gt-toolbar strong { display: block; font-size: 15px; }
.gt-toolbar p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.gt-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gt-tools .search-input { width: 220px; }
.gt-card {
  overflow: visible;
  min-width: 0;
  max-width: 100%;
  width: 0;
  min-width: 100%;
  padding: 0;
}
.gt-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 40px;
  padding: 0 10px;
  background: #1a2744;
  color: #e2e8f0;
}
.gt-bar strong { font-size: 13px; font-weight: 800; letter-spacing: -.2px; }
.gt-bar .btn { min-height: 27px; padding: 4px 10px; }
.gt-scroll { overflow: visible; max-width: 100%; }
.gt-table {
  width: 100%;
  min-width: 0;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 11px;
}
.gt-table th,
.gt-table td {
  padding: 7px 5px;
  border-bottom: 1px solid var(--line);
  text-align: center;
  vertical-align: middle;
  background: var(--surface);
}
.gt-table thead th {
  color: var(--muted);
  font-weight: 800;
  background: var(--surface-3);
  white-space: normal;
  word-break: keep-all;
  line-height: 1.25;
}
.gt-pick { width: 32px; }
.gt-name { width: 108px; }
.gt-when { width: 104px; }
.gt-memo { width: 148px; }
.gt-num { width: 62px; }
.gt-hold { width: 100px; }
.gt-level { width: 62px; }
.gt-ex { width: 52px; }
.gt-joined { width: 78px; }
.gt-paid-col { width: 118px; }
.gt-ended { width: 118px; }
.gt-period { width: 168px; }
.gt-act { width: 248px; }
.gt-table.is-hist .gt-act { width: 108px; }
.gt-level .gt-in,
.gt-ex .gt-in { padding: 0 2px; font-size: 10px; }
.gt-table .gt-pick {
  position: sticky;
  left: 0;
  z-index: 2;
  box-shadow: 6px 0 10px rgba(0, 0, 0, .18);
}
.gt-table thead .gt-pick { z-index: 3; }
.gt-table .gt-act {
  position: sticky;
  right: 0;
  z-index: 2;
  box-shadow: -8px 0 12px rgba(0, 0, 0, .22);
}
.gt-table thead .gt-act { z-index: 3; }
.gt-check { display: inline-flex; align-items: center; justify-content: center; }
.gt-check input { width: 15px; height: 15px; accent-color: #22c55e; }
.gt-in {
  width: 100%;
  min-width: 0;
  height: 28px;
  padding: 0 5px;
  font-size: 11px;
}
.gt-span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  white-space: nowrap;
}
.gt-span .gt-in {
  width: 48px;
  flex: 0 0 48px;
  min-width: 48px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.gt-span span { color: var(--muted); flex: 0 0 auto; font-size: 10px; }
.gt-unit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
}
.gt-unit .gt-in { flex: 1; min-width: 0; text-align: right; }
.gt-unit em {
  flex: 0 0 auto;
  color: var(--muted);
  font-style: normal;
  font-size: 10px;
  font-weight: 700;
}
.gt-paid { font-variant-numeric: tabular-nums; font-weight: 800; }
.gt-view {
  display: block;
  min-width: 0;
  color: var(--text);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gt-ended .gt-view {
  font-variant-numeric: tabular-nums;
  font-size: 10px;
  color: var(--muted);
}
.gt-dash { color: var(--muted); }
.gt-empty { padding: 28px 12px !important; color: var(--muted); }
.gt-table tr.is-off td:not(.gt-act) { opacity: .72; }
.gt-act-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  white-space: nowrap;
}
.gt-act .btn { margin: 0; padding-inline: 7px; }
.gt-act .gt-restore {
  background: #1d4ed8;
  border-color: #1e40af;
  color: #fff;
}
.gt-act .gt-start {
  background: #2563eb;
  border-color: #1d4ed8;
  color: #fff;
  min-width: 48px;
}
.gt-act .gt-start.is-on {
  background: #d97706;
  border-color: #b45309;
  color: #fff;
  cursor: default;
}
.gt-act .gt-del {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}
.gt-help {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  margin: 0;
  padding: 0;
  border: 1px solid #64748b;
  border-radius: 50%;
  background: #1e293b;
  color: #cbd5e1;
  cursor: help;
  z-index: 4;
}
.gt-help-mark {
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
.gt-help-tip {
  display: none;
  position: absolute;
  right: calc(100% + 8px);
  top: 50%;
  width: 268px;
  transform: translateY(-50%);
  padding: 8px 10px;
  border-radius: 8px;
  background: #0f172a;
  color: #e2e8f0;
  box-shadow: 0 10px 24px rgb(0 0 0 / .4);
  text-align: left;
  white-space: normal;
  pointer-events: none;
  z-index: 30;
}
.gt-help-tip::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 50%;
  border: 6px solid transparent;
  border-left-color: #0f172a;
  transform: translateY(-50%);
}
.gt-help-tip em {
  display: block;
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: -.2px;
}
.gt-help-tip em + em {
  margin-top: 6px;
  color: #fbbf24;
}
.gt-help:hover,
.gt-help:focus,
.gt-help:focus-visible { border-color: #93c5fd; color: #fff; z-index: 8; }
.gt-help:hover .gt-help-tip,
.gt-help:focus .gt-help-tip,
.gt-help:focus-visible .gt-help-tip { display: block; }
.gt-table tbody tr:hover .gt-act { z-index: 6; }
.gt-auto-wrap {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  cursor: pointer;
}
.gt-auto-wrap span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: -.2px;
  white-space: nowrap;
}
.gt-auto-wrap.is-on span { color: #86efac; }
.gt-act .gt-auto {
  width: 42px;
  height: 24px;
  min-width: 42px;
  min-height: 24px;
  flex: 0 0 42px;
  background: #3a3f4a;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .06);
}
.gt-act .gt-auto::after {
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  box-shadow: 0 1px 3px rgb(0 0 0 / .35);
}
.gt-act .gt-auto[aria-checked="true"] { background: #22c55e; }
.gt-act .gt-auto[aria-checked="true"]::after { transform: translateX(18px); }
.gt-del-sel {
  background: #7f1d1d;
  border-color: #991b1b;
  color: #fecaca;
}
.gt-del-sel:hover { filter: brightness(1.08); }
.gt-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px;
  border-top: 1px solid var(--line);
  background: var(--surface-2);
}
.gt-apply {
  background: #15803d;
  border-color: #15803d;
  color: #fff;
}
.gt-apply:hover { filter: brightness(1.08); }
.gt-cancel {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}
.gt-cancel:hover { filter: brightness(1.08); }
[data-theme="dark"] .gt-bar { background: #152033; }
[data-theme="dark"] .gt-table th,
[data-theme="dark"] .gt-table td { background: #121826; }
[data-theme="dark"] .gt-table thead th { background: #1a2233; }
[data-theme="dark"] .gt-table .gt-pick,
[data-theme="dark"] .gt-table .gt-act { background: #151c2b; }
[data-theme="dark"] .gt-table thead .gt-pick,
[data-theme="dark"] .gt-table thead .gt-act { background: #1a2233; }
@media (max-width: 1180px) {
  .attb-tabs-4:not(.gt-tabs),
  .attb-tabs-5 { grid-template-columns: 1fr 1fr; }
  .gt-tools .search-input { width: 100%; }
}

.content:has(.wd-page) {
  min-width: 0 !important;
  max-width: 100%;
}
.wd-page { display: grid; gap: 0; min-width: 0; max-width: 100%; }
.wd-tabs.attb-tabs {
  width: 100%;
  min-width: 0;
  margin-bottom: 0;
  border-radius: 0;
  border-color: var(--line);
}
.wd-tabs.attb-tabs button {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 10px;
  font-size: 13px;
}
.wd-tabs.attb-tabs button em {
  min-width: 22px;
  border-radius: 999px;
  padding: 1px 7px;
  background: rgb(220 38 38 / .18);
  color: #fca5a5;
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.wd-tabs.attb-tabs button.active em {
  background: #dc2626;
  color: #fff;
}
.wd-filter-bar {
  flex-wrap: wrap;
  align-items: end;
  border-top: 0;
}
.wd-filter-bar > label { flex: 0 0 88px; }
.wd-status-bar { border-top: 0; }
.wd-status-bar > button {
  flex: 1;
  min-width: 0;
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 8px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.wd-status-bar > button:last-child { border-right: 0; }
.wd-status-bar > button strong {
  color: var(--warning);
  font-size: 16px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.wd-status-bar > button.is-block { color: #c47a5a; }
.wd-status-bar > button.is-block strong { color: #e06a32; }
.wd-status-bar > button.is-active {
  background: var(--primary-soft);
  color: var(--text);
}
.wd-status-bar > button.is-pnl {
  cursor: default;
  flex: 1.35;
}
.wd-status-bar > button.is-pnl strong {
  padding: 2px 8px;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
}
.wd-status-bar > button.is-pnl.is-gain,
.wd-status-bar > button.is-pnl.is-gain strong { color: #86efac; }
.wd-status-bar > button.is-pnl.is-gain strong { background: rgb(134 239 172 / .14); }
.wd-status-bar > button.is-pnl.is-loss,
.wd-status-bar > button.is-pnl.is-loss strong { color: #fb7185; }
.wd-status-bar > button.is-pnl.is-loss strong { background: rgb(251 113 133 / .16); }
.wd-status-bar > button.is-pnl.is-flat strong { color: var(--muted); background: rgb(148 163 184 / .12); }
.wd-bulk { border-top: 0; }
.wd-bulk-wait { color: #94a3b8 !important; }
.wd-bulk-back { color: #38bdf8 !important; }
.wd-bulk-deny { color: #f87171 !important; }
.wd-bulk-ok { color: #4ade80 !important; }
.wd-table-card { border-top: 0; }
.wd-table-scroll {
  overflow: visible !important;
  max-height: none;
  border-radius: 0;
  max-width: 100%;
}
.wd-filter-bar .users-date-range {
  flex: 0 0 412px;
}
.wd-filter-bar .users-date-range .input {
  min-width: 0;
  padding-inline: 8px 6px;
  color-scheme: dark;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.wd-filter-bar .users-keyword { flex: 1 1 160px; max-width: 240px; margin-left: auto; }
.wd-filter-bar:has(.io-quick) .users-keyword { margin-left: 0; }
.io-quick {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  align-self: end;
  height: 26px;
}
.io-quick-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: 26px;
  border: 1px solid #35506c;
  border-radius: 6px;
  padding: 0 11px;
  background: linear-gradient(180deg, #24364c, #1b2b3d);
  color: #e8eef6;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: -.02em;
  white-space: nowrap;
  cursor: pointer;
}
.io-quick-btn:hover {
  border-color: #4a7aa8;
  background: linear-gradient(180deg, #2c425c, #203448);
}
.io-quick-btn.is-virtual { box-shadow: inset 0 1px 0 rgb(94 179 255 / .12); }
.io-quick-btn.is-tether {
  border-color: #2f6b58;
  background: linear-gradient(180deg, #1d3a32, #16302a);
  color: #d9f3ea;
}
.io-quick-btn.is-tether:hover {
  border-color: #3d8f74;
  background: linear-gradient(180deg, #23463c, #1a3931);
}
.io-quick-gear {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid #35506c;
  border-radius: 6px;
  padding: 0;
  background: #1b2b3d;
  color: #9eb4cb;
  cursor: pointer;
}
.io-quick-gear svg { width: 13px; height: 13px; stroke-width: 1.8; }
.io-quick-gear:hover {
  border-color: #4a7aa8;
  color: #e8eef6;
  background: #24364c;
}
.io-usdt-mark {
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  flex: none;
}
.io-usdt-mark svg { width: 16px; height: 16px; display: block; }
.io-link-form { display: grid; gap: 12px; }
.io-link-form .io-link-lead {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}
.modal.is-io-link { width: min(460px, 100%); }
.modal.is-io-ticker { width: min(960px, calc(100vw - 40px)); }
.modal.is-io-ticker #modalSave { display: none !important; }
.modal.is-io-ticker .modal-body { padding-top: 8px; }
.io-ticker { display: grid; gap: 14px; }
.io-ticker-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 12px;
}
.io-ticker-head b { color: var(--text); font-weight: 750; }
.io-ticker-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.io-quote {
  display: grid;
  gap: 10px;
  min-height: 108px;
  padding: 14px 14px 13px;
  border: 1px solid #2a3545;
  border-radius: 16px;
  background: linear-gradient(180deg, #1b2431, #161d28);
  box-shadow: 0 10px 22px rgb(0 0 0 / .18);
}
.io-quote-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.io-quote-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.io-quote-mark {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  flex: none;
}
.io-quote-mark.is-naver { background: #03c75a; }
.io-quote-mark.is-google { background: #4285f4; }
.io-quote-mark.is-bithumb { background: #f37321; }
.io-quote-mark.is-upbit { background: #093687; }
.io-quote-brand span {
  color: #d5deea;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.03em;
  white-space: nowrap;
}
.io-quote-live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #8b99ad;
  font-size: 11px;
  white-space: nowrap;
}
.io-quote-live i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 3px rgb(34 197 94 / .16);
  animation: io-live-pulse 1.8s ease-out infinite;
}
@keyframes io-live-pulse {
  0% { box-shadow: 0 0 0 0 rgb(34 197 94 / .38); }
  100% { box-shadow: 0 0 0 7px rgb(34 197 94 / 0); }
}
.io-quote strong {
  color: #f4f8fd;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.io-quote.is-wait strong { color: #8b99ad; font-size: 14px; font-weight: 650; }
@media (max-width: 980px) {
  .io-ticker-grid { grid-template-columns: 1fr 1fr; }
}
.wd-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: collapse;
}
.wd-table th {
  height: 36px;
  padding: 6px 4px;
  color: #e8eef6;
  background: #2f3b4a;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  letter-spacing: -.04em;
  white-space: nowrap;
}
.wd-table td {
  height: 48px;
  padding: 4px 3px;
  color: var(--text);
  font-size: 11px;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid var(--line);
}
.wd-table tbody tr:nth-child(even) { background: var(--table-row-alt); }
.wd-table tbody tr:hover { background: var(--table-row-hover); }
.wd-col-check { width: 28px; }
.wd-col-id { width: 11%; }
.wd-table th.wd-col-id,
.wd-table td.wd-col-id { overflow: visible; }
.wd-col-dist { width: 5.5%; }
.wd-col-no { width: 4.5%; }
.wd-col-changed { width: 8%; }
.wd-changed-fresh {
  display: inline-block;
  border-radius: 4px;
  padding: 2px 5px;
  color: #fb923c;
  background: rgb(251 146 60 / .16);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
}
[data-theme="dark"] .wd-changed-fresh {
  color: #fdba74;
  background: rgb(251 146 60 / .2);
}
.wd-col-nick,
.wd-col-holder,
.wd-col-bank { width: 5%; }
.wd-col-set { width: 88px; }
.wd-col-net { width: 5.5%; }
.wd-col-account { width: 11%; }
.wd-col-wallet { width: 13%; }
.wd-col-usdt { width: 7%; }
.wd-col-rate { width: 7%; }
.wd-col-amount { width: 8%; }
.wd-col-paid { width: 8%; }
.wd-col-hit,
.wd-col-roll,
.wd-col-alert { width: 4.8%; }
.wd-col-when { width: 9.5%; }
.wd-col-act {
  width: 112px;
  position: sticky;
  right: 0;
  z-index: 2;
  background: var(--surface);
  box-shadow: -8px 0 10px rgb(0 0 0 / .12);
}
.wd-table thead .wd-col-act { background: #2f3b4a; z-index: 3; }
.wd-col-id .link { display: block; font-weight: 700; }
.wd-col-id .writer-copy small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.35;
}
.wd-col-id .parent-tree-help { color: #f0b44a; }
.wd-sets {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  white-space: nowrap;
}
.wd-table .member-setting-button {
  margin: 0;
  cursor: default;
}
.wd-table .member-setting-button.is-both.is-on,
.wd-table .member-setting-button.is-both.is-on:hover {
  color: #fb7185;
  border-color: #9f1239;
  background: #3f1d27;
}
.wd-table .member-setting-button.is-caution.is-on,
.wd-table .member-setting-button.is-caution.is-on:hover {
  color: #fbbf24;
  border-color: #854d0e;
  background: #3f2e10;
}
.wd-col-no { font-weight: 750; font-variant-numeric: tabular-nums; }
.wd-col-amount {
  color: #fbbf24;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.wd-col-paid {
  color: #86efac;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.wd-usdt {
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 3px;
  color: #5eead4;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
}
.wd-usdt i {
  color: #7dd3c7;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}
.wd-col-rate {
  color: #93c5fd;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
}
.wd-when {
  display: grid;
  gap: 2px;
  color: var(--muted);
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
  line-height: 1.35;
}
.wd-state {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 22px;
  border-radius: 4px;
  padding: 0 7px;
  font-size: 11px;
  font-weight: 800;
}
.wd-state.is-wait { color: #fbbf24; background: rgb(251 191 36 / .12); }
.wd-state.is-back { color: #7dd3fc; background: rgb(14 165 233 / .14); }
.wd-state.is-deny { color: #fca5a5; background: rgb(239 68 68 / .16); }
.wd-state.is-ok { color: #86efac; background: rgb(34 197 94 / .16); }
.wd-col-state small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 650;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wd-process {
  display: grid;
  gap: 4px;
  justify-items: center;
}
.wd-process small {
  max-width: 88px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 650;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wd-link {
  min-width: 52px;
  min-height: 22px;
  border: 0;
  border-radius: 4px;
  padding: 0 6px;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
}
.wd-link-hit { background: #dc2626; }
.wd-link-hit:hover { filter: brightness(1.08); }
.wd-link-navy { background: #1e3a5f; }
.wd-link-navy:hover { background: #254a73; }
.wd-acts {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  white-space: nowrap;
}
.wd-act {
  min-width: 34px;
  min-height: 22px;
  border: 0;
  border-radius: 4px;
  padding: 0 5px;
  color: #fff;
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
}
.wd-act.is-wait { background: #475569; }
.wd-act.is-back { background: #0284c7; }
.wd-act.is-deny { background: #dc2626; }
.wd-act.is-ok { background: #16a34a; }
.wd-act:hover { filter: brightness(1.08); }
.wd-act.is-on,
.wd-act:disabled {
  opacity: 1;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .28);
  cursor: default;
  filter: none;
}
.wd-act.is-on.is-wait,
.wd-act:disabled.is-wait { background: #334155; }
.wd-empty { padding: 28px 12px !important; color: var(--muted); }
.wd-reason-lead { margin: 0 0 12px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.wd-reason-lead b { color: var(--text); }
.wd-sheet { padding: 4px 0 8px; }
.wd-sheet-table {
  width: 100%;
  border-collapse: collapse;
}
.wd-sheet-table th,
.wd-sheet-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  text-align: center;
}
.wd-sheet-table th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.wd-table .acct-account-cell { justify-content: center; }
[data-theme="dark"] .wd-table th { background: #1a2233; }
[data-theme="dark"] .wd-table thead .wd-col-act { background: #1a2233; }
[data-theme="dark"] .wd-table tbody .wd-col-act { background: #121826; }
[data-theme="dark"] .wd-link-navy { background: #16324f; }

.dp-page .wd-table-scroll {
  overflow: visible !important;
  max-height: none;
}
.dp-page .wd-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
.dp-page .wd-table th,
.dp-page .wd-table td {
  min-width: 0;
  overflow: hidden;
}
.dp-page .wd-table th {
  padding: 5px 2px;
  font-size: 10px;
}
.dp-page .wd-table td { padding: 4px 2px; }
.dp-page .wd-col-check { width: 28px; }
.dp-page .wd-col-id { width: 10%; }
.dp-page .wd-table th.wd-col-id,
.dp-page .wd-table td.wd-col-id { overflow: visible; }
.dp-page .wd-col-changed { width: 6.5%; }
.dp-page .wd-col-holder { width: 4.5%; }
.dp-page .wd-col-set { width: 6%; }
.dp-page .wd-col-payinfo { width: 10%; }
.dp-page .wd-col-usdt,
.dp-page .wd-col-rate { width: 6.2%; }
.dp-page .wd-col-amount { width: 6.5%; }
.dp-page .wd-col-exch { width: 5.5%; }
.dp-page .wd-col-bpack { width: 18%; }
.dp-page .wd-col-bsum,
.dp-page .wd-col-pay { width: 6%; }
.dp-page .wd-col-when { width: 7%; }
.dp-page .wd-col-act {
  width: 112px;
  position: static;
  box-shadow: none;
  overflow: visible;
}
.dp-page .wd-col-bsum { color: #fbbf24; font-weight: 800; font-variant-numeric: tabular-nums; }
.dp-page .wd-col-pay { color: #86efac; font-weight: 800; font-variant-numeric: tabular-nums; }
.dp-page .wd-table th.wd-col-exch,
.dp-page .wd-table th.wd-col-bpack,
.dp-page .wd-table td.wd-col-bpack,
.dp-page .wd-table td.wd-col-payinfo,
.dp-page .wd-table td.wd-col-when,
.dp-page .wd-table td.wd-col-set { white-space: normal; }
.wd-payinfo {
  display: grid;
  gap: 1px;
  min-width: 0;
  justify-items: center;
}
.wd-payinfo b {
  max-width: 100%;
  overflow: hidden;
  font-size: 10px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dp-page .acct-account-cell {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.dp-exch {
  display: inline-flex;
  align-items: baseline;
  gap: 1px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--muted);
}
.dp-exch i {
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}
.dp-page .wd-col-exch.is-on .dp-exch { color: #fbbf24; }
.dp-page .wd-col-exch.is-hot .dp-exch { color: #fb7185; }
.dp-bonus-pack {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 2px;
}
.dp-bonus-chip {
  display: grid;
  min-width: 0;
  border-radius: 3px;
  padding: 2px 1px;
  background: rgb(148 163 184 / .1);
  line-height: 1.15;
}
.dp-bonus-chip i {
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}
.dp-bonus-chip b {
  overflow: hidden;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dp-bonus-chip.is-on.is-event { color: #c4b5fd; background: rgb(167 139 250 / .14); }
.dp-bonus-chip.is-on.is-first { color: #fbbf24; background: rgb(251 191 36 / .14); }
.dp-bonus-chip.is-on.is-repeat { color: #7dd3fc; background: rgb(14 165 233 / .14); }
.dp-bonus-chip.is-on.is-burst { color: #fb923c; background: rgb(251 146 60 / .16); }
.dp-bonus-chip.is-on.is-time { color: #5eead4; background: rgb(45 212 191 / .14); }
.dp-bonus-chip.is-blocked {
  color: #f87171;
  background: rgb(239 68 68 / .12);
}
.dp-bonus-chip.is-blocked b { font-size: 9px; }
.dp-bonus-legend {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 30px;
  padding: 2px 14px 6px;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--surface);
}
.dp-bonus-help {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  position: relative;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.02em;
  cursor: help;
}
.dp-bonus-help i {
  width: 16px;
  height: 16px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  line-height: 1;
}
.dp-bonus-help:hover,
.dp-bonus-help:focus,
.dp-bonus-help:focus-visible {
  color: var(--text);
}
.dp-bonus-help:hover i,
.dp-bonus-help:focus i,
.dp-bonus-help:focus-visible i {
  color: var(--text);
  border-color: var(--primary);
  background: var(--primary-soft);
}
.dp-bonus-help.icon-tip:hover::after,
.dp-bonus-help.icon-tip:hover::before,
.dp-bonus-help.icon-tip:focus::after,
.dp-bonus-help.icon-tip:focus::before,
.dp-bonus-help.icon-tip:focus-visible::after,
.dp-bonus-help.icon-tip:focus-visible::before { opacity: 1; }
.dp-bonus-help.icon-tip::after {
  left: auto;
  right: 0;
  transform: none;
  width: min(320px, calc(100vw - 48px));
  white-space: normal;
  text-align: left;
  font-weight: 600;
  line-height: 1.45;
}
.dp-bonus-help.icon-tip::before {
  left: auto;
  right: 8px;
  transform: none;
}

.badge.gold { background: rgb(251 191 36 / .16); color: #fbbf24; }
.mm-page .wd-table-scroll {
  overflow: visible !important;
  max-height: none;
}
.mm-page .wd-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
.mm-page .wd-table th,
.mm-page .wd-table td {
  min-width: 0;
  overflow: hidden;
}
.mm-page .wd-table th {
  padding: 6px 6px;
  font-size: 11px;
}
.mm-page .wd-table td { padding: 6px; }
.mm-page .wd-col-id { width: 10%; }
.mm-page .wd-table th.wd-col-id,
.mm-page .wd-table td.wd-col-id { overflow: visible; }
.mm-page .mm-col-seq {
  width: 7%;
  color: var(--muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.mm-page .mm-seq { display: inline-block; }
.mm-page .mm-col-group { width: 6%; color: var(--muted); font-size: 11px; }
.mm-page .mm-col-kind { width: 12%; overflow: visible; }
.mm-page .mm-col-game { width: 8%; text-align: center; }
.mm-page .mm-col-view { width: 56px; text-align: center; }
.mm-page .mm-col-memo { width: 16%; }
.mm-page .mm-col-bal { width: 9%; }
.mm-page .mm-col-hold { width: 10%; }
.mm-page .mm-col-op { width: 7%; }
.mm-page .mm-col-when { width: 9%; }
.mm-page .mm-memo {
  display: block;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mm-page .mm-arrow,
.md-embed .mm-arrow,
.mm-detail-memo .mm-arrow {
  display: inline-block;
  width: 12px;
  height: 12px;
  max-width: 12px;
  max-height: 12px;
  margin: 0 4px;
  color: #7dd3fc;
  vertical-align: -2px;
  justify-self: start;
  align-self: center;
}
.mm-page .mm-col-hold.is-in { color: #34d399; font-weight: 800; }
.mm-page .mm-col-hold.is-out { color: #fb7185; font-weight: 800; }
.mm-page .wd-bulk { gap: 16px; }
.mm-page .wd-status-bar > button[disabled] {
  cursor: default;
  opacity: 1;
}
.mm-page .mm-date-tools {
  display: flex;
  align-items: end;
  gap: 6px;
  flex: 0 1 auto;
  min-width: 0;
}
.mm-page .mm-date-tools .period-shortcuts { flex: 0 0 auto; }
.mm-page .mm-date-tools .users-date-range { flex: 0 0 412px; }
.mm-page .users-status-bar,
.mm-page .wd-status-bar {
  flex-wrap: wrap;
  overflow: visible;
  height: auto;
}
.mm-page .wd-status-bar > button {
  flex: 1 1 9%;
  min-width: 96px;
  border-bottom: 1px solid var(--line);
}
.mm-page.is-event-money .mm-col-kind { width: 14%; }
.mm-page.is-event-money .mm-col-memo { width: 22%; }
.mm-page.is-event-money .wd-status-bar > button { flex: 1 1 0; min-width: 0; }
.mm-page .mm-col-kind .badge {
  display: inline-block;
  max-width: 100%;
  overflow: visible;
  line-height: 1.25;
  white-space: normal;
  text-overflow: unset;
}
.sch-page .sch-col-parent {
  width: 9%;
}
.sch-page .wd-table th.sch-col-parent,
.sch-page .wd-table td.sch-col-parent { overflow: visible; }
.sch-page .mm-col-game { width: 11%; text-align: left; }
.sch-page .mm-col-memo { width: 22%; }
.sch-page .wd-bulk {
  justify-content: flex-start;
  align-items: center;
}
.sch-page .wd-bulk .csv-excel {
  margin-left: auto;
  min-height: 28px;
}
.sch-page .users-status-bar,
.sch-page .wd-status-bar {
  display: flex;
  flex-wrap: wrap;
  overflow: visible;
}
.sch-page.mm-page .wd-status-bar > button {
  flex: 0 0 12.5%;
  width: 12.5%;
  max-width: 12.5%;
  min-width: 0;
  box-sizing: border-box;
}
.sch-page .wd-status-bar > button:nth-child(8n) {
  border-right: 0;
}
.sch-page .mm-col-bal,
.sch-page .mm-col-hold {
  font-size: 11px;
  font-weight: 700;
  word-break: keep-all;
}
.mm-page .mm-game-name {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text);
  font-size: 12px;
  font-weight: 750;
}
.mm-game-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  height: 22px;
  padding: 0 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
}
.mm-game-chip.is-casino { color: #d4b8ff; background: rgb(167 139 250 / .16); border-color: rgb(167 139 250 / .28); }
.mm-game-chip.is-slot { color: #f5b4d4; background: rgb(244 114 182 / .14); border-color: rgb(244 114 182 / .26); }
.mm-game-chip.is-sport { color: #86efac; background: rgb(52 211 153 / .14); border-color: rgb(52 211 153 / .26); }
.mm-game-chip.is-poly { color: #f0d089; background: rgb(251 191 36 / .14); border-color: rgb(251 191 36 / .26); }
.mm-game-chip.is-mini { color: #93c5fd; background: rgb(96 165 250 / .14); border-color: rgb(96 165 250 / .26); }
.mm-game-chip.is-virtual { color: #67e8f9; background: rgb(34 211 238 / .14); border-color: rgb(34 211 238 / .26); }
.mm-game-chip.is-void { color: #fdba74; background: rgb(234 88 12 / .18); border-color: rgb(234 88 12 / .38); }
.mm-game-chip.is-restore { color: #5eead4; background: rgb(20 184 166 / .16); border-color: rgb(20 184 166 / .34); }
[data-theme="light"] .mm-game-chip.is-casino { color: #6d28d9; background: #f3e8ff; border-color: #e9d5ff; }
[data-theme="light"] .mm-game-chip.is-slot { color: #be185d; background: #fdf2f8; border-color: #fbcfe8; }
[data-theme="light"] .mm-game-chip.is-sport { color: #047857; background: #ecfdf5; border-color: #a7f3d0; }
[data-theme="light"] .mm-game-chip.is-poly { color: #b45309; background: #fffbeb; border-color: #fde68a; }
[data-theme="light"] .mm-game-chip.is-mini { color: #1d4ed8; background: #eff6ff; border-color: #bfdbfe; }
[data-theme="light"] .mm-game-chip.is-virtual { color: #0e7490; background: #ecfeff; border-color: #a5f3fc; }
[data-theme="light"] .mm-game-chip.is-void { color: #c2410c; background: #fff7ed; border-color: #fdba74; }
[data-theme="light"] .mm-game-chip.is-restore { color: #0f766e; background: #f0fdfa; border-color: #99f6e4; }
.mm-page .mm-col-view .mini-action { margin: 0 auto; }
.modal.is-mm-detail {
  width: min(1120px, calc(100vw - 36px));
}
.modal.is-mm-detail #modalSave { display: none; }
.mm-detail { display: grid; gap: 14px; }
.mm-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  gap: 4px 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2, var(--surface-3));
}
.mm-detail-hero span {
  grid-column: 1;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.mm-detail-hero strong {
  grid-column: 1;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.mm-detail-hero em {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  font-style: normal;
  font-size: 18px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.mm-detail-hero em.is-in { color: #34d399; }
.mm-detail-hero em.is-out { color: #fb7185; }
.mm-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
.mm-detail-grid > div {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  border-bottom: 1px solid var(--line);
}
.mm-detail-grid > div:nth-last-child(-n+2) { border-bottom: 0; }
.mm-detail-grid dt,
.mm-detail-grid dd {
  margin: 0;
  padding: 8px 10px;
  font-size: 12px;
}
.mm-detail-grid dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  background: rgb(148 163 184 / .08);
}
.mm-detail-grid dd { font-weight: 700; word-break: break-all; }
.mm-detail-memo {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.55;
}
.mm-detail-memo span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.mm-round {
  display: grid;
  gap: 12px;
  padding-top: 4px;
}
.mm-round-head strong {
  display: block;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.mm-round-head p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.mm-round-table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.mm-round-table th,
.mm-round-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  text-align: center;
}
.mm-round-table th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  background: rgb(148 163 184 / .12);
}
.mm-round-table td:first-child { font-variant-numeric: tabular-nums; word-break: break-all; }
.mm-round-table .is-sum td {
  font-weight: 800;
  background: rgb(148 163 184 / .06);
}
.mm-round-result,
.mm-round-info {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.mm-round-result h3,
.mm-round-info h3 {
  margin: 0 0 12px;
  font-size: 14px;
}
.mm-baccarat {
  display: flex;
  justify-content: center;
  gap: 48px;
  text-align: center;
}
.mm-baccarat span { color: var(--muted); font-size: 12px; }
.mm-baccarat b { color: var(--text); }
.mm-cards { display: flex; justify-content: center; gap: 8px; margin-top: 8px; }
.mm-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 44px;
  height: 62px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: #fff;
  color: #111827;
  box-shadow: 0 1px 2px rgb(0 0 0 / .12);
}
.mm-card b { font-size: 16px; line-height: 1; }
.mm-card i { font-style: normal; font-size: 14px; }
.mm-card.is-red { color: #dc2626; }
.mm-round-result > p {
  margin: 10px 0 0;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
}
.mm-round-info p { margin: 4px 0; font-size: 12px; line-height: 1.5; }
.mm-slot-board {
  padding: 8px 10px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #14181f;
  color: #e8eef6;
}
.mm-slot-board h3 {
  margin: 8px 0 16px;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: #d1d5db;
}
.mm-slot-meta {
  display: grid;
  grid-template-columns: 1.2fr 1.1fr 1fr 1fr 1fr;
  gap: 8px 12px;
  padding: 10px 12px 14px;
  color: #9ca3af;
  font-size: 11px;
  text-align: center;
}
.mm-slot-meta b {
  color: #f3f4f6;
  font-size: 13px;
  font-weight: 700;
}
.mm-slot-spin {
  display: grid;
  gap: 10px;
  margin: 10px 8px 0;
  padding: 12px 12px 16px;
  border-top: 1px solid #2a3340;
}
.mm-slot-spin-head,
.mm-slot-spin-foot {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  color: #9ca3af;
  font-size: 12px;
}
.mm-slot-spin-head em {
  margin-left: 6px;
  padding: 1px 6px;
  border: 1px solid #4b5563;
  border-radius: 4px;
  font-style: normal;
  font-size: 10px;
}
.mm-slot-spin-head strong,
.mm-slot-spin-foot strong {
  display: grid;
  justify-items: end;
  color: #f9fafb;
  font-size: 13px;
}
.mm-slot-spin-head small,
.mm-slot-spin-foot small {
  color: #6b7280;
  font-size: 10px;
  font-weight: 600;
}
.mm-slot-spin-foot { grid-template-columns: 1fr auto auto; }
.mm-slot-spin-foot span { text-align: center; color: #6b7280; }
.mm-reels {
  display: grid;
  grid-template-columns: repeat(5, 72px);
  grid-template-rows: repeat(3, 72px);
  gap: 6px;
  width: max-content;
}
.mm-reel {
  display: grid;
  place-items: center;
  border-radius: 8px;
  font-size: 22px;
  font-weight: 800;
  background: #1f2937;
  color: #fbbf24;
}
.mm-reel.is-blue { color: #93c5fd; }
.mm-reel.is-green { color: #86efac; }
.mm-reel.is-wild { color: #f9a8d4; background: #3b1d2a; }
.mm-reel.is-scatter { color: #fdba74; background: #3b2a14; }
[data-theme="light"] .mm-page .mm-col-hold.is-in { color: #059669; }
[data-theme="light"] .mm-page .mm-col-hold.is-out { color: #e11d48; }
[data-theme="light"] .mm-page .mm-arrow,
[data-theme="light"] .md-embed .mm-arrow,
[data-theme="light"] .mm-detail-memo .mm-arrow { color: #0284c7; }
[data-theme="light"] .mm-detail-hero em.is-in { color: #059669; }
[data-theme="light"] .mm-detail-hero em.is-out { color: #e11d48; }

.br-page .br-table th,
.br-page .br-table td { font-size: 11px; }
.br-page .br-col-seq { width: 6.5%; }
.br-page .br-col-id { width: 7.5%; overflow: visible; }
.br-page .br-col-id .link { font-weight: 700; }
.br-page .br-col-nick { width: 6.5%; color: var(--muted); }
.br-page .br-col-dist { width: 6.5%; font-weight: 700; }
.br-page .br-col-path { width: 8.5%; }
.br-page .br-path {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: -0.04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.br-page .br-col-method { width: 5.5%; text-align: center; }
.br-page .br-col-when { width: 8%; }
.br-page .br-col-kind { width: 6.5%; text-align: center; }
.br-page .wd-status-bar > button.is-void { color: #fdba74; }
.br-page .wd-status-bar > button.is-void strong { color: #fdba74; background: rgb(234 88 12 / .2); }
.br-page .wd-status-bar > button.is-void.is-active {
  color: #fff7ed;
  background: rgb(234 88 12 / .28);
  box-shadow: inset 0 0 0 1px rgb(234 88 12 / .55);
}
.br-page .wd-status-bar > button.is-restore { color: #5eead4; }
.br-page .wd-status-bar > button.is-restore strong { color: #5eead4; background: rgb(20 184 166 / .2); }
.br-page .wd-status-bar > button.is-restore.is-active {
  color: #ecfdf5;
  background: rgb(20 184 166 / .28);
  box-shadow: inset 0 0 0 1px rgb(20 184 166 / .55);
}
.br-page .br-col-game { width: 7%; }
.br-page .br-col-bet { width: 6.5%; }
.br-page .br-col-rate { width: 5%; color: var(--muted); }
.br-page .br-col-done { width: 8%; }
.br-page .br-th-set {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.br-page .br-th-set .mini-action { margin: 0; }
.br-page .br-col-bal { width: 7%; }
.br-page .br-col-fee { width: 8%; }
.br-page .br-col-fee.is-in { color: #34d399; font-weight: 800; }
.br-page .br-round-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  padding: 5px 10px;
  border: 1px solid rgb(52 211 153 / .45);
  border-radius: 6px;
  background: rgb(52 211 153 / .12);
  color: #34d399;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.03em;
  cursor: pointer;
}
.br-page .br-round-link svg {
  width: 15px;
  height: 15px;
  stroke-width: 2;
}
.br-page .br-round-link:hover {
  border-color: rgb(52 211 153 / .8);
  background: rgb(52 211 153 / .22);
  color: #6ee7b7;
}
[data-theme="light"] .br-page .br-round-link {
  border-color: rgb(5 150 105 / .35);
  background: #ecfdf5;
  color: #059669;
}
[data-theme="light"] .br-page .br-round-link:hover {
  border-color: rgb(5 150 105 / .6);
  background: #d1fae5;
  color: #047857;
}
.br-page .br-col-view { width: 5%; text-align: center; }
.br-formula {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgb(52 211 153 / .06);
}
.br-formula span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.br-formula b { font-size: 15px; letter-spacing: -0.03em; }
.br-formula small { color: var(--muted); font-size: 11px; }
[data-theme="light"] .br-page .br-col-fee.is-in { color: #059669; }
[data-theme="light"] .br-formula { background: #ecfdf5; }
.modal.is-br-round {
  width: min(460px, calc(100vw - 36px));
}
.modal.is-br-round #modalSave { display: none; }
.br-round-box { display: grid; gap: 12px; }
.br-round-note {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}
.br-round-note b { color: var(--text); }
.br-round-preview {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgb(52 211 153 / .06);
  font-size: 12px;
  color: var(--muted);
}
.br-round-preview strong,
.br-round-preview b {
  color: #34d399;
  font-weight: 800;
}
.br-round-list { display: grid; gap: 8px; }
.br-round-option {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2, var(--surface-3));
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.br-round-option span { font-size: 13px; font-weight: 800; }
.br-round-option small {
  grid-column: 1;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}
.br-round-option em {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  font-style: normal;
  font-size: 15px;
  font-weight: 800;
  color: #34d399;
}
.br-round-option.is-on {
  border-color: rgb(52 211 153 / .55);
  background: rgb(52 211 153 / .1);
}
[data-theme="light"] .br-round-preview { background: #ecfdf5; }
[data-theme="light"] .br-round-preview strong,
[data-theme="light"] .br-round-preview b,
[data-theme="light"] .br-round-option em { color: #059669; }
[data-theme="light"] .br-round-option.is-on { background: #ecfdf5; }
.modal.is-br-help { width: min(480px, calc(100vw - 36px)); }
.br-help-example {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2, var(--surface-3));
}
.br-help-example > p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.br-help-example dl { display: grid; gap: 8px; margin: 0; }
.br-help-example dl div {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}
.br-help-example dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.br-help-example dd {
  margin: 0;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.br-help-example dd small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}
.br-help-example dd.is-in { color: #34d399; }
[data-theme="light"] .br-help-example dd.is-in { color: #059669; }

.lg-page { display: grid; gap: 0; min-width: 0; }
.content:has(.lg-page) .page-head {
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
}
.content:has(.lg-page) .head-actions {
  align-items: flex-end;
  flex-wrap: nowrap;
  gap: 8px;
}
.lg-head-filter {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}
.lg-field {
  display: grid;
  gap: 4px;
  flex: 0 0 132px;
  min-width: 0;
  text-align: center;
}
.lg-field > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
}
.lg-head-filter .select,
.lg-head-filter .input {
  height: 32px;
  min-height: 32px;
  border-radius: 8px;
  font-size: 12px;
  text-align: center;
  text-align-last: center;
}
.lg-search { flex: 0 0 220px; width: 220px; }
.lg-tabs.attb-tabs {
  width: 100%;
  min-width: 0;
  margin-bottom: 12px;
  border-radius: 10px;
  border-color: var(--line);
  grid-template-columns: repeat(9, minmax(0, 1fr));
}
.lg-tabs.attb-tabs button {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px 4px;
  font-size: 13px;
  text-align: center;
  white-space: nowrap;
}
.lg-tabs.attb-tabs button .lg-ico-sport,
.lg-tabs.attb-tabs button .lg-ico-sport svg {
  width: 1em;
  height: 1em;
}
.lg-tabs.attb-tabs button .lg-ico-sport svg { stroke-width: 2; }
.lg-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  line-height: 1;
  vertical-align: middle;
  white-space: nowrap;
}
.lg-ico {
  display: block;
  flex: 0 0 auto;
}
.lg-ico-sport,
.lg-ico-sport svg {
  width: 1em;
  height: 1em;
}
.lg-ico-sport svg {
  display: block;
  stroke-width: 1.75;
}
.lg-ico-flag {
  width: 1.15em;
  height: .86em;
  object-fit: cover;
  border-radius: 2px;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .14), 0 0 0 1px rgb(0 0 0 / .18);
}
.lg-ico-league {
  width: 1.15em;
  height: 1.15em;
  object-fit: cover;
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgb(255 255 255 / .08);
}
.lg-tabs.attb-tabs button em {
  min-width: 22px;
  border-radius: 999px;
  padding: 1px 7px;
  background: rgb(220 38 38 / .18);
  color: #fca5a5;
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.lg-tabs.attb-tabs button.active em {
  background: #dc2626;
  color: #fff;
}
.lg-card { overflow: hidden; }
.lg-scroll { overflow-x: auto; }
.lg-table {
  width: 100%;
  min-width: 1280px;
  border-collapse: collapse;
}
.lg-table th,
.lg-table td,
.lg-table td.numeric,
.lg-team,
.lg-team.is-home,
.lg-team.is-away {
  text-align: center !important;
  vertical-align: middle;
}
.lg-table th {
  height: 36px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap;
}
.lg-table td {
  height: 40px;
  padding: 4px 8px;
  white-space: nowrap;
  font-size: 12px;
}
.lg-table td.numeric { text-align: center; }
.lg-row.is-open td { border-bottom-color: transparent; }
.lg-odds-cell, .lg-set, .lg-mcell { vertical-align: middle; }
.lg-no, .lg-id { color: var(--muted); font-variant-numeric: tabular-nums; }
.lg-table td.lg-team.is-home,
.lg-table td.lg-team.is-away {
  position: relative;
  min-width: 128px;
  font-weight: 800;
}
.lg-table td.lg-team.is-home {
  text-align: left !important;
  color: #e5484d;
  padding-left: 16px;
}
.lg-table td.lg-team.is-away {
  text-align: right !important;
  color: #3b9eff;
  padding-right: 16px;
}
.lg-team.is-home .lg-team-name,
.lg-team.is-away .lg-team-name { display: inline-block; }
.lg-team.is-home::before,
.lg-team.is-away::after {
  content: "";
  position: absolute;
  top: 10px;
  bottom: 10px;
  width: 3px;
  border-radius: 2px;
}
.lg-team.is-home::before {
  left: 6px;
  background: #ef4444;
}
.lg-team.is-away::after {
  right: 6px;
  background: #22d3ee;
}
.lg-odds {
  display: grid;
  grid-template-columns: repeat(3, 58px);
  align-items: center;
  justify-content: center;
  gap: 3px;
  width: max-content;
  min-width: 0;
  margin: 0 auto;
}
.lg-odds.is-2,
.lg-odds.is-3 {
  grid-template-columns: repeat(3, 58px);
}
.lg-odds button,
.lg-odds .lg-odd-input {
  width: 100%;
  height: 22px;
  min-width: 0;
  min-height: 22px;
  border: 1px solid #3e5168;
  border-radius: 4px;
  background: #151e2c;
  color: #f8fafc;
  padding: 0;
  font-size: 11px;
  font-weight: 800;
  line-height: 20px;
  white-space: nowrap;
  text-align: center;
  cursor: pointer;
  box-shadow: none;
}
.lg-odds .lg-odd-input {
  color: #f8fafc;
}
.lg-odds button.is-flash,
.lg-odds .lg-odd-input.is-flash,
.lg-mcard .lg-mcells button.is-flash,
.lg-mcard .lg-odd-input.is-flash {
  animation: lg-odd-flash 3s ease-out forwards;
}
@keyframes lg-odd-flash {
  0%, 72% {
    border-color: #2f80ff;
    background: #173056;
    color: #fff;
    box-shadow: 0 0 0 2px #2f80ff, 0 0 14px 2px rgb(47 128 255 / .75);
  }
  100% {
    border-color: #3e5168;
    background: #151e2c;
    color: #f8fafc;
    box-shadow: none;
  }
}
.lg-odd-input {
  width: 48px;
  height: 22px;
  min-width: 0;
  border: 1px solid #c5d0dc;
  border-radius: 4px;
  background: #fff;
  color: #047857;
  padding: 0;
  font-size: 11px;
  font-weight: 800;
  line-height: 20px;
  text-align: center;
}
.lg-odd-input:focus {
  outline: none;
  border-color: #059669;
}
.lg-clock { text-align: center; line-height: 1.15; }
.lg-clock b,
.lg-clock small { display: block; }
.lg-clock small { color: var(--muted); font-size: 10px; font-weight: 700; }
.lg-score {
  text-align: center;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.lg-score b { color: #d97706; font-weight: 800; }
.lg-score span { margin: 0 3px; color: var(--muted); }
.lg-mcell-edit {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.lg-mcell-edit .lg-odd-input { width: 52px; }
.lg-vs {
  display: grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  color: var(--text);
  opacity: .14;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
  pointer-events: none;
}
.lg-odds button:hover { background: #1c2a3c; }
.lg-change { color: var(--muted); font-size: 11px; }
.lg-change small { display: inline; margin-left: 2px; font-size: 10px; }
.lg-change.is-soon { color: #c79535; font-weight: 700; }
.lg-status { color: var(--muted); font-size: 11px; white-space: nowrap; }
.lg-status.is-on { color: #059669; font-weight: 700; }
.lg-status.is-halt { color: #ea580c; font-weight: 700; }
.lg-status.is-resume { color: #0284c7; font-weight: 700; }
.lg-status.is-live { color: #ef4444; }
.lg-time { white-space: nowrap; }
.lg-live-clock {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #ef4444;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.lg-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 0 0 0 rgb(239 68 68 / .7);
  animation: lg-live-pulse 1.4s ease-out infinite;
}
.lg-live-score {
  margin-left: 8px;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}
@keyframes lg-live-pulse {
  0% { box-shadow: 0 0 0 0 rgb(239 68 68 / .55); }
  70% { box-shadow: 0 0 0 6px rgb(239 68 68 / 0); }
  100% { box-shadow: 0 0 0 0 rgb(239 68 68 / 0); }
}
.lg-set { white-space: nowrap; }
.lg-apply, .lg-recall, .lg-sale {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 72px;
  height: 22px;
  min-height: 22px;
  border: 0;
  border-radius: 4px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 800;
  line-height: 22px;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
}
.lg-apply { color: #fff; background: #12304f; }
.lg-apply:hover { background: #0b223b; }
.lg-recall { margin-left: 4px; color: #fff; background: #0284c7; }
.lg-recall:hover { background: #0369a1; }
.lg-sale { margin-left: 4px; min-width: 76px; color: #fff; background: #64748b; }
.lg-sale:hover { filter: brightness(1.08); }
.lg-sale.is-on { color: #fff; background: #16a34a; filter: none; }
.lg-sale.is-on:hover { background: #15803d; filter: none; }
.lg-sale.is-halt { color: #fff; background: #ea580c; filter: none; }
.lg-sale.is-halt:hover { background: #c2410c; filter: none; }
.lg-sale.is-resume { color: #fff; background: #0284c7; filter: none; }
.lg-sale.is-resume:hover { background: #0369a1; filter: none; }
.lg-market {
  min-width: 36px;
  height: 22px;
  min-height: 22px;
  border: 0;
  border-radius: 4px;
  background: #1e3a5f;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.lg-market:hover { background: #254a73; }
.lg-market.is-on { background: #2563eb; }
.lg-market-empty { color: var(--muted); }
.lg-drop td { padding: 0 8px 8px; background: var(--surface); text-align: center; }
.lg-markets { display: grid; gap: 4px; }
.lg-markets.is-split {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  justify-content: start;
  gap: 8px;
  width: 100%;
  max-width: none;
  padding: 8px 0 2px;
  text-align: left;
}
.lg-markets-col {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 64px;
  gap: 6px;
  align-items: stretch;
  min-width: 0;
  width: 100%;
}
.lg-markets-col-body {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.lg-mk-close {
  display: grid;
  place-items: center;
  align-self: stretch;
  width: 64px;
  min-height: 0;
  border: 0;
  border-radius: 4px;
  background: #1e3a5f;
  color: #fff;
  padding: 8px 4px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: -0.02em;
  cursor: pointer;
}
.lg-mk-close:hover { background: #254a73; }
.lg-mcard {
  min-width: 0;
  border: 1px solid #d5dee8;
  border-radius: 6px;
  background: #f4f7fa;
  overflow: hidden;
}
.lg-mcard-head {
  margin: 0;
  padding: 8px 10px;
  border-bottom: 1px solid #d5dee8;
  color: #12304f;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-align: left;
}
.lg-mcard .lg-mcells {
  display: grid;
  gap: 4px;
  padding: 6px;
}
.lg-mcard .lg-mcells.is-trio { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lg-mcard .lg-mcells.is-pair,
.lg-mcard .lg-mcells.is-lines { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lg-mcard .lg-mcells.is-stack { grid-template-columns: 1fr; }
.lg-mcard .lg-mcells.is-ah { grid-template-columns: minmax(0, 1fr) 52px minmax(0, 1fr); }
.lg-mcard .lg-mcells button,
.lg-mcard .lg-mcell-edit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  min-height: 34px;
  border: 0;
  border-radius: 4px;
  background: #edf3f8;
  color: #12304f;
  padding: 0 10px;
  font-size: 12px;
  text-align: left;
  cursor: pointer;
}
.lg-mcard .lg-mcells button.is-mid,
.lg-mcard .lg-mcell-edit.is-mid {
  justify-content: center;
  padding: 0 4px;
}
.lg-mcard .lg-mcells button span,
.lg-mcard .lg-mcell-edit span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.lg-mcard .lg-mcell-edit span:empty { display: none; }
.lg-mcard .lg-mcells button strong {
  flex: 0 0 auto;
  font-weight: 800;
}
.lg-mcard .lg-mcell-edit .lg-odd-input { width: 48px; }
.lg-sum, .lg-payout, .lg-margin { font-variant-numeric: tabular-nums; font-weight: 700; text-align: center; }
.lg-payout { color: #059669; }
.lg-payout-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 22px;
}
.lg-payout-input {
  width: 54px;
  height: 22px;
  min-height: 22px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--surface-2);
  color: #6b8f88;
  padding: 0 4px;
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.lg-payout-input:focus {
  border-color: #8aa39c;
  outline: 0;
  box-shadow: 0 0 0 2px rgb(138 163 156 / .18);
}
.lg-payout-edit em {
  color: #6b8f88;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}
.lg-margin { color: #a8844a; }
.lg-mrow {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) 96px;
  gap: 4px;
  min-height: 38px;
  align-items: center;
}
.lg-mstat {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 1px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  text-align: center;
}
.lg-mstat em { font-size: 10px; font-style: normal; font-weight: 700; }
.lg-mstat strong { color: #059669; font-size: 11px; }
.lg-mrow b {
  display: grid;
  place-items: center;
  border-radius: 4px;
  background: #edf3f8;
  color: #12304f;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}
.lg-mcells { display: grid; gap: 4px; min-width: 0; }
.lg-mcells.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lg-mcells.is-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lg-mcells button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 0;
  min-height: 38px;
  border: 0;
  border-radius: 4px;
  background: #edf3f8;
  color: #12304f;
  padding: 0 10px;
  font-size: 12px;
  text-align: center;
  cursor: pointer;
}
.lg-mcells button span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lg-mcells button strong { font-weight: 800; }
.lg-empty { height: 72px !important; color: var(--muted); text-align: center; }
[data-theme="dark"] .lg-tabs.attb-tabs { background: #152233; border-color: #2a3d55; }
[data-theme="dark"] .lg-tabs.attb-tabs button.active { background: #1e3a5f; color: #e8eef6; }
[data-theme="dark"] .lg-odds button,
[data-theme="dark"] .lg-odds .lg-odd-input {
  color: #f8fafc;
  background: #151e2c;
  border-color: #3e5168;
}
[data-theme="dark"] .lg-mrow b,
[data-theme="dark"] .lg-mcells button { color: #e8eef6; background: #24364c; }
[data-theme="dark"] .lg-table td.lg-team.is-home { color: #f87171; }
[data-theme="dark"] .lg-table td.lg-team.is-away { color: #38bdf8; }
[data-theme="dark"] .lg-odd-input {
  color: #34d399;
  background: #152233;
  border-color: #2a3d55;
}
[data-theme="dark"] .lg-score b { color: #fbbf24; }
[data-theme="dark"] .lg-odds button:hover,
[data-theme="dark"] .lg-mcells button:hover { background: #1c2a3c; }
[data-theme="dark"] .lg-apply { color: #fff; background: #1e3a5f; }
[data-theme="dark"] .lg-apply:hover { background: #254a73; }
[data-theme="dark"] .lg-recall { color: #fff; background: #0284c7; }
[data-theme="dark"] .lg-recall:hover { background: #0369a1; }
[data-theme="dark"] .lg-sale { color: #fff; background: #475569; }
[data-theme="dark"] .lg-sale.is-on { color: #fff; background: #16a34a; }
[data-theme="dark"] .lg-sale.is-on:hover { background: #15803d; }
[data-theme="dark"] .lg-sale.is-halt { color: #fff; background: #ea580c; }
[data-theme="dark"] .lg-sale.is-halt:hover { background: #c2410c; }
[data-theme="dark"] .lg-sale.is-resume { color: #fff; background: #0284c7; }
[data-theme="dark"] .lg-sale.is-resume:hover { background: #0369a1; }
[data-theme="dark"] .lg-market { color: #fff; background: #1e3a5f; }
[data-theme="dark"] .lg-market:hover { background: #254a73; }
[data-theme="dark"] .lg-market.is-on { background: #2563eb; }
[data-theme="dark"] .lg-change.is-soon { color: #e0b45a; }
[data-theme="dark"] .lg-status.is-on,
[data-theme="dark"] .lg-payout,
[data-theme="dark"] .lg-payout-input,
[data-theme="dark"] .lg-payout-edit em,
[data-theme="dark"] .lg-mstat strong { color: #34d399; }
[data-theme="dark"] .lg-status.is-halt { color: #fb923c; }
[data-theme="dark"] .lg-status.is-resume { color: #38bdf8; }
[data-theme="dark"] .lg-status.is-live,
[data-theme="dark"] .lg-live-clock { color: #f87171; }
[data-theme="dark"] .lg-live-dot { background: #f87171; box-shadow: 0 0 0 0 rgb(248 113 113 / .7); }
[data-theme="dark"] .lg-live-score { color: #f8fafc; }
[data-theme="dark"] .lg-payout-input {
  background: #1a242c;
  border-color: var(--line);
}
[data-theme="dark"] .lg-margin { color: #d4b27a; }
[data-theme="dark"] .lg-drop td { background: #0f1620; }
[data-theme="dark"] .lg-mcard {
  background: #152233;
  border-color: #2a3d55;
}
[data-theme="dark"] .lg-mcard-head {
  color: #e8eef6;
  border-color: #2a3d55;
}
[data-theme="dark"] .lg-mcard .lg-mcells button,
[data-theme="dark"] .lg-mcard .lg-mcell-edit {
  color: #e8eef6;
  background: #24364c;
}
[data-theme="dark"] .lg-mcard .lg-mcells button:hover { background: #2c425c; }
[data-theme="dark"] .lg-mcard .lg-mcells button strong { color: #fff; }
[data-theme="dark"] .lg-mk-close { color: #fff; background: #1e3a5f; }
[data-theme="dark"] .lg-mk-close:hover { background: #254a73; }
@media (max-width: 900px) {
  .lg-markets.is-split { grid-template-columns: 1fr; }
}
@media (max-width: 1400px) {
  .lg-tabs.attb-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .content:has(.lg-page) .head-actions,
  .lg-head-filter { flex-wrap: wrap; }
  .lg-field, .lg-search { flex: 1 1 140px; width: auto; }
}

/* Sports league manage */
.content:has(.slm-page) { padding-top: 20px; }
.content:has(.slm-page) .page-head { margin-bottom: 16px; align-items: flex-end; }
.content:has(.slm-page) .page-title h1 { letter-spacing: -0.04em; }
.content:has(.slm-page) .head-actions .btn { height: 34px; border-radius: 8px; padding: 0 12px; font-weight: 700; }
.content:has(.slm-page) .head-actions .btn-primary { box-shadow: 0 8px 18px rgb(59 130 246 / .28); }
.slm-page {
  --slm-blue: #3b82f6;
  --slm-teal: #2dd4bf;
  display: grid;
  gap: 14px;
  min-width: 0;
}
.slm-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}
.slm-kpi {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 86px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  padding: 16px 20px;
  background: transparent;
  color: var(--text);
  text-align: left;
}
.slm-kpi:last-child { border-right: 0; }
.slm-kpi svg { width: 22px; height: 22px; flex: 0 0 22px; }
.slm-kpi span { display: grid; gap: 4px; min-width: 0; }
.slm-kpi small { color: var(--muted); font-size: 12px; font-weight: 650; }
.slm-kpi strong { font-size: 28px; font-weight: 800; letter-spacing: -0.04em; line-height: 1; }
.slm-kpi.is-all svg { color: #60a5fa; }
.slm-kpi.is-run svg { color: #34d399; }
.slm-kpi.is-hide svg { color: #fbbf24; }
.slm-kpi.is-maint svg { color: #94a3b8; }
.slm-kpi.is-active { background: color-mix(in srgb, var(--slm-blue) 10%, transparent); }
.slm-kpi:hover { background: var(--table-row-hover); }
.slm-filters {
  display: flex;
  align-items: end;
  gap: 8px;
  min-width: 0;
}
.slm-filters label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.slm-filters .select { width: 148px; height: 36px; }
.slm-search { position: relative; flex: 1 1 220px; }
.slm-search .input { width: 100%; height: 36px; padding-left: 32px; }
.slm-search-ico {
  position: absolute;
  left: 10px;
  bottom: 9px;
  display: grid;
  color: var(--muted);
}
.slm-search-ico svg { width: 14px; height: 14px; }
.slm-filters .btn { height: 36px; border-radius: 8px; padding: 0 14px; font-weight: 700; }
.slm-page .lg-tabs.attb-tabs { margin-bottom: 0; }
.slm-card { overflow: hidden; padding: 0; }
.slm-bulk {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 8px 14px;
  border-bottom: 1px solid var(--line);
}
.slm-pick {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 6px;
  font-size: 12px;
  font-weight: 700;
}
.slm-pick b { font-variant-numeric: tabular-nums; }
.slm-bulk-btn, .slm-bulk-del, .slm-edit {
  height: 30px;
  border-radius: 8px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
}
.slm-bulk-btn svg, .slm-bulk-del svg { width: 13px; height: 13px; }
.slm-bulk-del { border-color: transparent; color: #fb7185; background: rgb(248 113 113 / .12); }
.slm-scroll { overflow: auto; }
.slm-table { width: 100%; min-width: 1180px; border-collapse: collapse; }
.slm-table th, .slm-table td {
  height: 48px;
  padding: 0 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  font-size: 12px;
  white-space: nowrap;
}
.slm-table th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  background: var(--surface-2);
}
.slm-check { width: 36px; text-align: center !important; }
.slm-order, .slm-id, .slm-num, .slm-sync { color: var(--muted); font-variant-numeric: tabular-nums; }
.slm-cell-sport, .slm-cell-nation, .slm-name {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}
.slm-ico, .slm-name img, .slm-ico-flag, .slm-table .lg-ico {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
}
.slm-ico svg, .slm-sport-ico svg { width: 16px; height: 16px; }
.slm-table .lg-ico-flag { width: 16px; height: 12px; object-fit: cover; border-radius: 2px; }
.slm-globe { color: var(--muted); }
.slm-flag-fallback {
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--surface-3);
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
}
.slm-cell-sport.is-축구 { color: #60a5fa; }
.slm-cell-sport.is-농구 { color: #fb923c; }
.slm-cell-sport.is-야구 { color: #38bdf8; }
.slm-cell-sport.is-배구 { color: #a78bfa; }
.slm-cell-sport.is-아이스하키 { color: #7dd3fc; }
.slm-cell-sport.is-테니스 { color: #86efac; }
.slm-cell-sport.is-MMA { color: #fda4af; }
.slm-cell-sport.is-E스포츠 { color: #c4b5fd; }
.slm-cell-sport span { color: var(--text); }
.slm-sw { display: inline-flex; align-items: center; gap: 8px; }
.slm-sw em { font-style: normal; color: var(--muted); font-size: 12px; font-weight: 700; }
.slm-sw em.is-on { color: var(--slm-teal); }
.slm-page .switch[aria-checked="true"] { background: var(--slm-teal); }
.slm-vis { font-weight: 800; color: var(--muted); }
.slm-vis.is-on { color: var(--slm-teal); }
.slm-help {
  width: 16px;
  height: 16px;
  margin-left: 4px;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  padding: 0;
  color: var(--muted);
  background: transparent;
  font-size: 10px;
  font-weight: 800;
  vertical-align: middle;
}
.slm-empty { height: 72px !important; color: var(--muted); text-align: center !important; }
.slm-foot {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 0 16px;
}
.slm-foot span { margin-right: auto; color: var(--muted); font-size: 12px; }
.slm-size { color: var(--muted); font-size: 12px; }
.slm-pager { display: flex; gap: 4px; }
.modal.is-slm-edit { width: min(760px, 100%); }
.modal.is-slm-edit .modal-head { align-items: flex-start; padding: 18px 22px 14px; }
.modal.is-slm-edit .modal-head h2 { display: grid; gap: 4px; font-size: 18px; font-weight: 800; letter-spacing: -0.04em; }
.modal.is-slm-edit .modal-head h2 p { margin: 0; color: var(--muted); font-size: 12px; font-weight: 500; }
.modal.is-slm-edit .modal-body { padding: 8px 22px 18px; }
.modal.is-slm-edit #modalSave { min-width: 120px; background: #3b82f6; border-color: #3b82f6; color: #fff; }
.modal.is-slm-edit .switch[aria-checked="true"] { background: #2dd4bf; }
.slm-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 16px;
}
.slm-field { display: grid; gap: 6px; min-width: 0; }
.slm-field > span { color: var(--muted); font-size: 12px; font-weight: 700; }
.slm-field .input, .slm-field .select { width: 100%; height: 38px; }
.slm-count { justify-self: end; color: var(--muted); font-size: 11px; }
.slm-lock-field { position: relative; display: block; }
.slm-lock-field .input { padding-right: 34px; }
.slm-lock-field svg {
  position: absolute;
  top: 11px;
  right: 10px;
  width: 14px;
  height: 14px;
  color: var(--muted);
}
.slm-warn {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin-top: 6px;
  padding: 8px 10px;
  border: 1px solid #fbbf24;
  border-radius: 8px;
  background: rgb(251 191 36 / .12);
  color: #fbbf24;
  font-size: 11px;
  font-style: normal;
  font-weight: 650;
  line-height: 1.45;
}
.slm-warn svg { width: 14px; height: 14px; flex: 0 0 14px; margin-top: 1px; }
.slm-logo-field { grid-column: 2 / 4; }
.slm-logo-box {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 92px;
  padding: 12px;
  border: 1px dashed var(--line-strong);
  border-radius: 12px;
  background: var(--surface-2);
}
.slm-logo-preview {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  overflow: hidden;
  border-radius: 12px;
  background: #0b1220;
}
.slm-logo-preview img { width: 48px; height: 48px; object-fit: contain; }
.slm-logo-ph { color: var(--muted); }
.slm-logo-ph svg { width: 22px; height: 22px; }
.slm-logo-copy { min-width: 0; }
.slm-logo-copy strong { display: block; margin-bottom: 4px; font-size: 13px; }
.slm-logo-copy p { margin: 0 0 8px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.slm-file-btn { height: 30px; }
.slm-ops { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.slm-ops h3 { margin: 0 0 4px; font-size: 14px; }
.slm-ops > p { margin: 0 0 12px; color: var(--muted); font-size: 12px; }
.slm-run { display: flex; gap: 8px; margin-bottom: 16px; }
.slm-run-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 12px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.slm-run-btn svg { width: 14px; height: 14px; }
.slm-run-btn.is-on[data-slm-run="운영중"] { border-color: rgb(52 211 153 / .45); color: #34d399; background: rgb(52 211 153 / .12); }
.slm-run-btn.is-on[data-slm-run="점검"] { border-color: rgb(251 191 36 / .45); color: #fbbf24; background: rgb(251 191 36 / .12); }
.slm-run-btn.is-on[data-slm-run="중지"] { border-color: rgb(248 113 113 / .45); color: #fb7185; background: rgb(248 113 113 / .12); }
.slm-toggles { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 28px; }
.slm-toggle {
  display: flex;
  align-items: center;
  gap: 12px;
}
.slm-toggle span { display: grid; gap: 2px; margin-right: auto; }
.slm-toggle b { font-size: 13px; }
.slm-toggle small { color: var(--muted); font-size: 11px; }
[data-theme="dark"] .slm-kpis,
[data-theme="dark"] .slm-card { background: #111827; border-color: #243044; }
[data-theme="dark"] .slm-table th { background: #0f1724; }
[data-theme="dark"] .slm-logo-preview { background: #070d18; }
@media (max-width: 1100px) {
  .slm-kpis { grid-template-columns: 1fr 1fr; }
  .slm-kpi:nth-child(2) { border-right: 0; }
  .slm-filters { flex-wrap: wrap; }
  .slm-filters .select { width: 140px; }
  .slm-form-grid, .slm-toggles { grid-template-columns: 1fr; }
  .slm-logo-field { grid-column: auto; }
}

/* Sports result process */
.srr-page { --srr-blue: #3b82f6; }
.srr-kpi { position: relative; padding-right: 28px; }
.srr-kpi svg:last-of-type { position: absolute; right: 14px; width: 16px; height: 16px; color: var(--muted); opacity: .55; }
.srr-kpi.is-wait svg:first-of-type { color: #60a5fa; }
.srr-kpi.is-done svg:first-of-type { color: #34d399; }
.srr-kpi.is-review svg:first-of-type { color: #fbbf24; }
.srr-kpi.is-fail svg:first-of-type { color: #fb7185; }
.srr-kpi.is-active { background: color-mix(in srgb, var(--srr-blue) 10%, transparent); }
.srr-date { flex: 0 0 auto; }
.srr-date-box {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
}
.srr-date-box .input {
  width: 148px;
  min-width: 148px;
  height: 32px;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: var(--text);
  color-scheme: dark;
  font-size: 12px;
  font-weight: 700;
}
[data-theme="light"] .srr-date-box .input { color-scheme: light; }
.srr-date-box .input::-webkit-calendar-picker-indicator { opacity: .72; cursor: pointer; }
.srr-date-box em { color: var(--muted); font-style: normal; font-size: 12px; font-weight: 700; }
.srr-filters .select { width: 128px; }
.srr-search { flex: 1 1 240px; }
.srr-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.srr-tabs button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  border: 0;
  border-radius: 10px;
  padding: 0 14px;
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}
.srr-tabs button em {
  font-style: normal;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  opacity: .8;
}
.srr-tabs button.active {
  background: var(--srr-blue);
  color: #fff;
  box-shadow: 0 8px 18px rgb(59 130 246 / .28);
}
.srr-tabs button.active em { opacity: 1; }
.srr-table { width: 100%; min-width: 1280px; border-collapse: collapse; }
.srr-table th, .srr-table td {
  height: 48px;
  padding: 0 10px;
  border-bottom: 1px solid var(--line);
  text-align: center;
  font-size: 12px;
  white-space: nowrap;
}
.srr-table th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  background: var(--surface-2);
}
.srr-check { width: 36px; text-align: center !important; }
.srr-time, .srr-id, .srr-sync { color: var(--muted); font-variant-numeric: tabular-nums; }
.srr-sport {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}
.srr-sport .lg-ico svg { width: 16px; height: 16px; }
.srr-sport.is-축구 { color: #60a5fa; }
.srr-sport.is-농구 { color: #fb923c; }
.srr-sport.is-야구 { color: #38bdf8; }
.srr-sport.is-배구 { color: #a78bfa; }
.srr-sport.is-아이스하키 { color: #7dd3fc; }
.srr-sport.is-테니스 { color: #86efac; }
.srr-sport.is-MMA { color: #fda4af; }
.srr-sport.is-E스포츠 { color: #c4b5fd; }
.srr-sport span { color: var(--text); }
.srr-team { font-weight: 700; }
.srr-table th.srr-home,
.srr-table td.srr-team.is-home { text-align: left; }
.srr-table th.srr-away,
.srr-table td.srr-team.is-away { text-align: right; }
.srr-score {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 72px;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}
.srr-score i { font-style: normal; color: var(--muted); font-weight: 700; }
.srr-score.is-empty { color: var(--muted); font-weight: 700; }
.srr-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  background: var(--surface-3);
  color: var(--muted);
}
.srr-pill.is-end { color: #e2e8f0; background: rgb(100 116 139 / .32); }
.srr-pill.is-live { color: #7dd3fc; background: rgb(14 165 233 / .22); }
.srr-pill.is-api { color: #cbd5e1; background: rgb(71 85 105 / .35); }
.srr-pill.is-ok { color: #86efac; background: rgb(22 163 74 / .22); }
.srr-pill.is-bad { color: #fecaca; background: rgb(220 38 38 / .24); }
.srr-pill.is-auto { color: #6ee7b7; background: rgb(16 185 129 / .2); }
.srr-pill.is-review { color: #fde68a; background: rgb(202 138 4 / .24); }
.srr-pill.is-fail, .srr-pill.is-settle-fail { color: #fecdd3; background: rgb(225 29 72 / .26); }
.srr-pill.is-wait { color: #bfdbfe; background: rgb(37 99 235 / .24); }
.srr-pill.is-settle-ok { color: #bbf7d0; background: rgb(21 128 61 / .28); }
.srr-pill.is-settle-none { color: #cbd5e1; background: rgb(51 65 85 / .4); }
.srr-pill.is-settle-hold { color: #fed7aa; background: rgb(234 88 12 / .24); }
[data-theme="light"] .srr-pill.is-end { color: #334155; background: rgb(148 163 184 / .28); }
[data-theme="light"] .srr-pill.is-live { color: #0369a1; background: rgb(14 165 233 / .16); }
[data-theme="light"] .srr-pill.is-api { color: #475569; background: rgb(148 163 184 / .2); }
[data-theme="light"] .srr-pill.is-ok { color: #047857; background: rgb(16 185 129 / .16); }
[data-theme="light"] .srr-pill.is-bad { color: #be123c; background: rgb(244 63 94 / .14); }
[data-theme="light"] .srr-pill.is-auto { color: #047857; background: rgb(16 185 129 / .16); }
[data-theme="light"] .srr-pill.is-review { color: #a16207; background: rgb(245 158 11 / .18); }
[data-theme="light"] .srr-pill.is-fail,
[data-theme="light"] .srr-pill.is-settle-fail { color: #be123c; background: rgb(244 63 94 / .16); }
[data-theme="light"] .srr-pill.is-wait { color: #1d4ed8; background: rgb(59 130 246 / .14); }
[data-theme="light"] .srr-pill.is-settle-ok { color: #166534; background: rgb(34 197 94 / .18); }
[data-theme="light"] .srr-pill.is-settle-none { color: #475569; background: rgb(148 163 184 / .2); }
[data-theme="light"] .srr-pill.is-settle-hold { color: #c2410c; background: rgb(249 115 22 / .16); }
.srr-status, .srr-link, .srr-act {
  height: 28px;
  border-radius: 7px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
}
.srr-status {
  border: 0;
  background: transparent;
  color: var(--muted);
}
.srr-status:hover { color: var(--text); }
.srr-manage {
  white-space: nowrap;
}
.srr-manage .srr-link,
.srr-manage .srr-act {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 2px;
  vertical-align: middle;
}
.srr-link {
  border: 1px solid var(--line-strong);
  background: var(--surface-2);
  color: var(--text);
}
.srr-link:hover { border-color: #93c5fd; color: #e0f2fe; }
.srr-act {
  border: 1px solid rgb(59 130 246 / .45);
  background: rgb(59 130 246 / .18);
  color: #bfdbfe;
}
.srr-act:hover { background: rgb(59 130 246 / .28); }
.srr-empty { height: 72px !important; color: var(--muted); text-align: center !important; }
.modal.is-srr-modal { width: min(720px, 100%); }
.modal.is-srr-modal .modal-head { align-items: flex-start; padding: 18px 22px 14px; }
.modal.is-srr-modal .modal-head h2 { display: grid; gap: 4px; font-size: 18px; font-weight: 800; letter-spacing: -0.04em; }
.modal.is-srr-modal .modal-head h2 p { margin: 0; color: var(--muted); font-size: 12px; font-weight: 500; }
.modal.is-srr-modal .modal-body { padding: 8px 22px 18px; }
.modal.is-srr-form #modalSave { min-width: 120px; background: #3b82f6; border-color: #3b82f6; color: #fff; }
.modal.is-srr-detail #modalSave { display: none !important; }
.srr-board {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-2);
  text-align: center;
}
.srr-board small { display: block; margin-bottom: 6px; color: var(--muted); font-size: 11px; }
.srr-board strong { font-size: 16px; font-weight: 800; }
.srr-board-score { display: grid; gap: 6px; justify-items: center; }
.srr-board-score .srr-score { font-size: 28px; }
.srr-board-score em { font-style: normal; color: var(--muted); font-size: 11px; font-weight: 700; }
.srr-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 16px;
  margin: 0 0 16px;
}
.srr-meta div { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 32px; }
.srr-meta dt { color: var(--muted); font-size: 12px; }
.srr-meta dd { margin: 0; font-size: 12px; font-weight: 700; }
.srr-split { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.srr-split h3 { margin: 0 0 8px; font-size: 13px; }
.srr-markets, .srr-log { margin: 0; padding: 0; list-style: none; }
.srr-markets li, .srr-log li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 32px;
  padding: 0 2px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
}
.srr-markets b, .srr-log em { font-variant-numeric: tabular-nums; }
.srr-log em { color: var(--muted); font-style: normal; }
.srr-markets .is-empty, .srr-log .is-empty { color: var(--muted); justify-content: center; border: 0; }
.srr-note { margin: 14px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); color: var(--text); font-size: 12px; }
.srr-note b { display: block; margin-bottom: 4px; color: var(--muted); font-size: 11px; }
.srr-detail-acts { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.srr-form { display: grid; gap: 14px; }
.srr-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
.srr-form label, .srr-form-grid label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 700; }
.srr-span { grid-column: 1 / -1; }
.srr-score-edit {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: end;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-2);
  text-align: center;
}
.srr-score-edit div { display: grid; gap: 8px; }
.srr-score-edit b { font-size: 14px; }
.srr-score-edit .input { width: 100%; height: 48px; text-align: center; font-size: 22px; font-weight: 800; }
.srr-score-edit em { color: var(--muted); font-style: normal; font-weight: 800; padding-bottom: 12px; }
.srr-warn {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid #fbbf24;
  border-radius: 8px;
  background: rgb(251 191 36 / .12);
  color: #fbbf24;
  font-size: 11px;
  font-style: normal;
  font-weight: 650;
  line-height: 1.45;
}
.srr-warn svg { width: 14px; height: 14px; flex: 0 0 14px; margin-top: 1px; }
.srr-settle-check { display: inline-flex; align-items: center; gap: 8px; color: var(--text); font-size: 12px; font-weight: 700; }
[data-theme="dark"] .srr-card, [data-theme="dark"] .srr-kpis { background: #111827; border-color: #243044; }
[data-theme="dark"] .srr-table th { background: #0f1724; }
[data-theme="dark"] .srr-date-box { background: #172033; }
@media (max-width: 1100px) {
  .srr-filters { flex-wrap: wrap; }
  .srr-date { flex: 1 1 340px; min-width: 320px; }
  .srr-split, .srr-form-grid, .srr-score-edit { grid-template-columns: 1fr; }
  .srr-score-edit em { padding: 0; }
}

.main-app:has(.sbh-page) { min-width: 0; overflow: visible; }
.content:has(.sbh-page) { flex: 1 1 auto; min-width: 0 !important; max-width: 100%; overflow: visible; }
.sbh-page { display: grid; gap: 0; min-width: 0; max-width: 100%; overflow: visible; }
html:has(.sbh-page:not(.spb-page)),
body:has(.sbh-page:not(.spb-page)) {
  overflow: auto;
  height: auto;
  max-height: none;
}
.shell:has(.sbh-page:not(.spb-page)) {
  height: auto;
  min-height: 100vh;
  align-items: start;
  overflow: visible;
  grid-template-columns: var(--sidebar) minmax(min-content, 1fr);
}
.main-app:has(.sbh-page:not(.spb-page)) {
  height: auto;
  min-height: 100vh;
  max-height: none;
  overflow: visible;
  max-width: none;
}
.content:has(.sbh-page:not(.spb-page)) {
  flex: 1 0 auto;
  height: auto;
  max-height: none;
  overflow: visible;
  min-width: 0;
  max-width: none;
}
.sbh-page:not(.spb-page) {
  overflow: visible;
  max-width: none;
}
.sbh-page:not(.spb-page) .sbh-table-card,
.sbh-page:not(.spb-page) .sbh-scroll.wd-table-scroll,
.sbh-page:not(.spb-page) .sbh-scroll {
  overflow: visible !important;
  max-height: none !important;
  max-width: none;
  width: 100%;
}
.sbh-game-tabs.attb-tabs {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 10px;
  padding: 5px;
  border-radius: 12px;
  background: var(--surface-2);
}
.sbh-game-tabs.attb-tabs button,
.sbh-game-tabs.attb-tabs a.sbh-game-link {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  border-radius: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: -0.03em;
  text-decoration: none;
}
.sbh-game-tabs.attb-tabs button.active,
.sbh-game-tabs.attb-tabs a.sbh-game-link.active {
  background: var(--bg);
  color: var(--text);
  font-weight: 700;
  box-shadow: var(--shadow);
}
.sbh-sub-tabs {
  margin: 0 0 10px;
  border-top: 1px solid var(--line);
  overflow: visible;
}
.sbh-sub-tabs > button {
  flex: 1 1 0;
  min-width: 0;
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 8px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: -0.03em;
  white-space: nowrap;
  cursor: pointer;
}
.sbh-sub-tabs > button:last-child { border-right: 0; }
.sbh-sub-tabs > button.is-active {
  background: var(--primary-soft);
  color: var(--text);
}
.sbh-poly-tabs { flex-wrap: wrap; }
.sbh-poly-tabs > button {
  flex: 1 1 7%;
  min-width: 88px;
  border-bottom: 1px solid var(--line);
}
.sbh-mini-tabs,
.sbh-vs-tabs {
  display: flex;
  width: 100%;
  flex-wrap: nowrap;
}
.sbh-mini-tabs > button,
.sbh-vs-tabs > button {
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sbh-mini-tabs > button {
  font-size: 11px;
  padding: 6px 4px;
}
.sbh-vs-tabs > button {
  justify-content: center;
  gap: 6px;
  padding: 6px 4px;
}
.sbh-vs-tabs > button svg {
  width: 16px;
  height: 16px;
  flex: none;
  color: var(--text);
}
.sbh-vs-tabs > button.is-active svg { color: var(--primary); }
.sbh-tabs.attb-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 0;
  padding: 0;
  border-radius: 0;
  border-color: var(--line);
}
.sbh-tabs.attb-tabs button {
  flex: 1 1 0;
  min-width: 0;
  min-height: 38px;
  gap: 6px;
  border-radius: 0;
  padding: 6px 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.03em;
}
.sbh-filter {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  flex-wrap: nowrap;
  align-items: end;
  gap: 6px;
  overflow: visible;
  border-top: 0;
}
.sbh-filter > label,
.sbh-filter .sbh-dates,
.sbh-filter .sbh-keyword {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  margin-left: 0;
}
.sbh-filter .sbh-dates { flex: 1.55 1 0; }
.sbh-filter .sbh-keyword { flex: 1.4 1 0; }
.sbh-filter > label .input,
.sbh-filter > label .select,
.sbh-filter .sbh-keyword .input,
.sbh-filter .sbh-dates .input {
  width: 100%;
  min-width: 0;
}
.sbh-filter .sbh-search,
.users-search-button.sbh-search {
  flex: 0 0 auto;
  align-self: end;
  height: 26px;
  min-height: 26px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  padding: 0 12px;
  color: var(--text);
  background: var(--surface);
}
.sbh-filter .sbh-search:hover,
.users-search-button.sbh-search:hover {
  color: var(--text);
  background: var(--surface-3);
}
.sbh-actions {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--surface);
}
.sbh-actions .sbh-page-size {
  margin: 0 auto 0 0;
}
.sbh-actions .btn,
.bh-actions .btn {
  min-height: 28px;
  padding: 5px 10px;
  font-size: 12px;
}
.bh-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 7px;
  margin: -4px 0 12px;
}
.sbh-page-size {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.sbh-page-size label {
  display: inline-flex;
  align-items: center;
}
.sbh-page-size .select {
  width: auto;
  min-width: 124px;
  height: 28px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
}
.sbh-table-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 40px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--surface);
}
.sbh-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--surface);
}
.sbh-result {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}
.sbh-result strong, .sbh-result b {
  color: var(--text);
  font-variant-numeric: tabular-nums;
}
.sbh-sorts {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin-left: auto;
}
.sbh-sorts button {
  height: 26px;
  border: 0;
  border-radius: 4px;
  padding: 0 8px;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.03em;
  cursor: pointer;
}
.sbh-sorts button:hover { color: var(--text); background: var(--surface-2); }
.sbh-sorts button.active { color: var(--text); background: var(--primary-soft); }
.sbh-expand {
  min-height: 26px;
  height: 26px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 700;
}
.sbh-expand.is-on {
  border-color: var(--primary);
  color: var(--primary);
  background: var(--primary-soft);
}
.sbh-card { border-radius: 0; border-top: 0; overflow: visible; }
.sbh-table-card { max-width: 100%; width: 100%; overflow: visible; }
.sbh-ledger { width: max-content; min-width: 100%; table-layout: auto; }
.sbh-table.sbh-ledger {
  table-layout: auto;
  width: max-content;
  min-width: 100%;
}
.sbh-ledger th,
.sbh-ledger td { white-space: nowrap; vertical-align: middle; }
.sbh-ledger .sbh-txid {
  display: inline-block;
  font-size: 11px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.sbh-ledger th.sbh-led-txid,
.sbh-ledger td.sbh-led-txid {
  min-width: 232px;
  width: 232px;
  white-space: nowrap;
}
.sbh-ledger th.sbh-led-agent,
.sbh-ledger td.sbh-led-agent {
  min-width: 96px;
  width: 96px;
  white-space: nowrap;
}
.sbh-ledger td.sbh-led-txid,
.sbh-ledger td.sbh-led-agent { text-align: left; }
.sbh-table.sbh-ledger-cs {
  table-layout: fixed;
  width: 100%;
  min-width: 1280px;
}
.sbh-ledger-cs th,
.sbh-ledger-cs td {
  overflow: hidden;
  text-overflow: ellipsis;
}
.sbh-ledger-cs th.parent-head,
.sbh-ledger-cs td.sbh-led-parent,
.sbh-ledger-cs td.sbh-led-account { overflow: visible; }
.sbh-ledger-cs th.sbh-led-txid,
.sbh-ledger-cs td.sbh-led-txid { width: 18%; min-width: 0; }
.sbh-ledger-slot .sbh-txid-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.sbh-ledger-slot .sbh-txid-wrap .sbh-txid {
  display: block;
  flex: 1 1 0;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sbh-ledger-slot .sbh-txid-copy {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 3px;
  color: var(--muted);
  background: var(--surface-2);
  cursor: pointer;
}
.sbh-ledger-slot .sbh-txid-copy svg { width: 11px; height: 11px; }
.sbh-ledger-slot .sbh-txid-copy:hover {
  color: var(--text);
  border-color: #46617b;
}
.sbh-ledger-cs th.sbh-led-agent,
.sbh-ledger-cs td.sbh-led-agent { width: 7%; min-width: 0; }
.sbh-ledger-cs th.sbh-led-time,
.sbh-ledger-cs td.sbh-led-time { width: 8%; }
.sbh-ledger-cs th.sbh-led-parent,
.sbh-ledger-cs td.sbh-led-parent,
.sbh-ledger-cs th.sbh-led-account,
.sbh-ledger-cs td.sbh-led-account { width: 8%; }
.sbh-ledger-cs th.sbh-led-kind,
.sbh-ledger-cs td.sbh-led-kind { width: 7%; }
.sbh-ledger-cs th.sbh-led-table,
.sbh-ledger-cs td.sbh-led-table { width: 10%; }
.sbh-ledger-cs .sbh-txid {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sbh-ledger-cs th.sbh-led-prev,
.sbh-ledger-cs td.sbh-led-prev,
.sbh-ledger-cs th.sbh-led-stake,
.sbh-ledger-cs td.sbh-led-stake,
.sbh-ledger-cs th.sbh-led-after,
.sbh-ledger-cs td.sbh-led-after,
.sbh-ledger-cs th.sbh-led-profit,
.sbh-ledger-cs td.sbh-led-profit {
  width: 8%;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.sbh-ledger-cs th.sbh-led-status,
.sbh-ledger-cs td.sbh-led-status { width: 5%; text-align: center; }
.sbh-ledger-cs th.sbh-led-act,
.sbh-ledger-cs td.sbh-led-act { width: 6%; text-align: center; }
.sbh-ledger-slot th.sbh-led-txid,
.sbh-ledger-slot td.sbh-led-txid {
  width: 12.6%;
  min-width: 0;
  overflow: hidden;
}
.sbh-ledger-slot th.sbh-led-vendor,
.sbh-ledger-slot td.sbh-led-vendor { width: 8%; }
.sbh-ledger-slot th.sbh-led-table,
.sbh-ledger-slot td.sbh-led-table { width: 9%; }
.sbh-ledger-slot th.sbh-led-kind,
.sbh-ledger-slot td.sbh-led-kind { width: 6%; }
.sbh-ledger .sbh-event { display: inline-block; max-width: 280px; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; }
.sbh-ledger-cs .sbh-event { max-width: 100%; }
.sbh-ledger .writer-copy { display: grid; }
.sbh-ledger .writer-copy small { color: var(--muted); font-size: 11px; }
.sbh-ledger th.parent-head,
.sbh-ledger td.sbh-led-parent,
.sbh-ledger td.sbh-led-account {
  overflow: visible;
  text-align: center;
}
.sbh-ledger td.sbh-led-parent,
.sbh-ledger td.sbh-led-account { min-width: 108px; }
.sbh-ledger .sbh-led-parent .writer-copy strong,
.sbh-ledger .sbh-led-account .link,
.sbh-ledger .sbh-led-account strong {
  display: block;
  font-size: 11px;
  font-weight: 700;
}
.sbh-ledger .sbh-led-account small { display: block; }
.sbh-scroll.wd-table-scroll,
.sbh-scroll {
  border-radius: 0;
  overflow: visible !important;
  max-width: 100%;
  width: 100%;
  max-height: none;
}
.sbh-page.spb-page .sbh-table-card .sbh-scroll {
  overflow-x: auto !important;
  overflow-y: visible !important;
}
.sbh-page:not(.spb-page) .sbh-table-card .sbh-scroll {
  overflow: visible !important;
  max-width: none;
}
.sbh-table {
  table-layout: fixed;
  width: 100%;
  min-width: 0;
}
.sbh-table th,
.sbh-table td,
.sbh-subtable th,
.sbh-subtable td {
  display: table-cell;
}
.sbh-table .sbh-col-id { width: 108px; }
.sbh-table .sbh-col-member { width: 122px; }
.sbh-table .sbh-col-time { width: 102px; font-variant-numeric: tabular-nums; }
.sbh-table .sbh-col-sport { width: 72px; }
.sbh-table .sbh-col-country { width: 86px; }
.sbh-table .sbh-col-league { width: 108px; }
.sbh-table .sbh-col-home,
.sbh-table .sbh-col-draw,
.sbh-table .sbh-col-away { width: 128px; }
.spb-page .sbh-table .sbh-col-home,
.spb-page .sbh-table .sbh-col-draw,
.spb-page .sbh-table .sbh-col-away { width: 154px; }
.spb-page .sbh-table .sbh-col-people { width: 72px; }
.spb-page .sbh-col-home .sbh-side-name,
.spb-page .sbh-col-draw .sbh-side-name { justify-content: space-between; }
.spb-page .sbh-col-away .sbh-side-name { flex-direction: row-reverse; justify-content: space-between; }
.spb-page .sbh-side-team {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: inherit;
}
.spb-page .sbh-side-odd {
  flex: none;
  color: #fbbf24;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.spb-page .sbh-side.is-empty .sbh-side-odd { color: #fbbf24; }
.spb-page .sbh-col-home .sbh-side-stat,
.spb-page .sbh-col-draw .sbh-side-stat { justify-content: flex-end; }
.spb-page .sbh-col-away .sbh-side-stat { justify-content: flex-start; }
.sbh-table .sbh-col-num { width: 64px; }
.sbh-table .sbh-col-kind { width: 78px; }
.sbh-table .sbh-col-choice { width: 52px; }
.sbh-table .sbh-col-folder { width: 46px; }
.sbh-table .sbh-col-people { width: 46px; }
.sbh-table .sbh-col-odd { width: 52px; }
.sbh-table .sbh-col-status { width: 56px; }
.sbh-table .sbh-col-act { width: 72px; }
.sbh-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 34px;
  padding: 6px 8px;
  color: var(--muted);
  background: var(--surface-3);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  letter-spacing: -0.03em;
}
.sbh-table td {
  height: auto;
  min-height: 58px;
  padding: 6px 8px;
  font-size: 11px;
  text-align: center;
  vertical-align: middle;
}
.sbh-table .numeric,
.sbh-subtable .numeric { text-align: center; }
.sbh-side {
  display: grid;
  justify-items: stretch;
  gap: 4px;
  padding: 5px 2px;
}
.sbh-side + .sbh-side { border-top: 1px solid var(--line); }
.sbh-side-name {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 4px;
  border: 1px solid transparent;
  font-size: 11px;
  font-weight: 800;
  font-style: normal;
  letter-spacing: -0.03em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sbh-side-name.is-home {
  color: #8fd0ff;
  background: rgb(22 140 255 / .18);
  border-color: rgb(22 140 255 / .38);
  box-shadow: inset 0 1px rgb(255 255 255 / .08);
}
.sbh-side-name.is-draw,
.sbh-side-name.is-vs {
  color: #fbbf24;
  background: rgb(251 191 36 / .16);
  border-color: rgb(251 191 36 / .38);
  box-shadow: inset 0 1px rgb(255 255 255 / .08);
}
.sbh-side-name.is-away {
  color: #f87171;
  background: rgb(248 113 113 / .16);
  border-color: rgb(248 113 113 / .36);
  box-shadow: inset 0 1px rgb(255 255 255 / .08);
}
.sbh-side-stat {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 20px;
  gap: 4px;
  padding: 0 3px 0 7px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--surface-2);
  white-space: nowrap;
}
.sbh-side-stat em {
  color: #34d399;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}
.sbh-side-stat i {
  min-width: 18px;
  height: 14px;
  display: grid;
  place-items: center;
  border-radius: 4px;
  padding: 0 5px;
  color: #edf2f5;
  background: #4a5c68;
  font-size: 9px;
  font-style: normal;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
[data-theme="dark"] .sbh-side-stat i {
  color: #e8eef2;
  background: #4e616c;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .06);
}
.sbh-side.is-empty .sbh-side-name,
.sbh-side.is-empty .sbh-side-name.is-home,
.sbh-side.is-empty .sbh-side-name.is-draw,
.sbh-side.is-empty .sbh-side-name.is-away,
.sbh-side.is-empty .sbh-side-name.is-vs {
  color: #7b8794;
  background: rgb(148 163 184 / .08);
  border-color: var(--line);
  box-shadow: none;
  font-weight: 700;
}
.sbh-side.is-empty .sbh-side-stat {
  opacity: .55;
}
.sbh-side-stat.is-empty {
  border-color: var(--line);
  background: transparent;
}
.sbh-side-stat.is-empty em { color: var(--muted); font-weight: 700; }
.sbh-row { cursor: pointer; }
.sbh-row.is-open { background: var(--primary-soft); }
.sbh-id-wrap,
.sbh-member-wrap,
.sbh-act-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  max-width: 100%;
}
.sbh-id-wrap { justify-content: center; white-space: nowrap; gap: 8px; }
.sbh-table td.sbh-col-time .sbh-id-wrap {
  width: 100%;
  justify-content: center;
}
.sbh-table td.sbh-col-id,
.sbh-subtable td.sbh-col-id { text-align: center; overflow: hidden; }
.sbh-table td.sbh-col-member { overflow: visible; }
.sbh-fold {
  flex: none;
  width: 16px;
  height: 16px;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  background: var(--surface);
  cursor: pointer;
}
.sbh-fold::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin: 0 auto;
  border-left: 4px solid var(--muted);
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
}
.sbh-row.is-open .sbh-fold::before {
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 4px solid var(--text);
  border-bottom: 0;
}
.sbh-id {
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}
.sbh-folder {
  display: inline-flex;
  align-items: center;
  height: 16px;
  border-radius: 3px;
  padding: 0 5px;
  background: rgb(22 140 255 / .14);
  color: #7cc4ff;
  font-size: 9px;
  font-style: normal;
  font-weight: 800;
}
.sbh-member-wrap { gap: 10px; }
.spb-page .sbh-member-wrap {
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.spb-page .sbh-subtable .sbh-col-parent,
.spb-page .sbh-subtable .sbh-col-login { width: 108px; }
.spb-page .sbh-subtable th.sbh-col-folder,
.spb-page .sbh-subtable td.sbh-col-folder {
  width: auto;
  min-width: 58px;
  white-space: nowrap;
}
.spb-page .sbh-subtable .sbh-folder {
  white-space: nowrap;
  flex: none;
}
.spb-page .sbh-col-parent .writer-inner,
.spb-page .sbh-col-login .writer-copy { justify-content: center; }
.spb-pick-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
}
.spb-pick-card {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-2) 82%, #000 8%);
}
.spb-page .spb-pick-card .sbh-col-home,
.spb-page .spb-pick-card .sbh-col-draw,
.spb-page .spb-pick-card .sbh-col-away {
  width: auto;
  min-width: 0;
}
.spb-pick-card .sbh-side-stat.is-odd {
  opacity: 1;
}
.spb-pick-card .sbh-side-stat.is-odd em {
  color: #34d399;
  font-weight: 800;
}
.spb-pick-card .sbh-side.is-on .sbh-side-stat {
  border-color: rgb(52 211 153 / .7);
  box-shadow: inset 0 0 0 1px rgb(52 211 153 / .28);
}
.spb-page .sbh-sub { overflow-x: auto; }
.spb-page .sbh-subtable { table-layout: auto; width: 100%; min-width: 0; }
.spb-page .sbh-subtable td.sbh-col-act,
.spb-page .sbh-subtable th.sbh-col-act {
  width: 1%;
  white-space: nowrap;
  overflow: visible;
}
.spb-page .sbh-subtable .sbh-act-wrap {
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  gap: 4px;
  max-width: none;
  white-space: nowrap;
}
.spb-page .sbh-subtable .sbh-act-wrap .btn {
  flex: 0 0 auto;
  min-width: 46px;
  height: 26px;
  padding: 0 10px;
  white-space: nowrap;
}
.sbh-member-wrap .writer-inner { justify-content: center; }
.sbh-table .writer-copy,
.sbh-subtable .writer-copy { text-align: center; }
.sbh-account { min-width: 0; text-align: center; }
.sbh-account .link, .sbh-account strong {
  display: block;
  font-size: 11px;
  font-weight: 700;
}
.sbh-account small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.35;
}
.sbh-profit.is-plus { color: #34d399; font-weight: 800; }
.sbh-profit.is-minus { color: #f87171; font-weight: 800; }
.sbh-table th.sbh-col-sport,
.sbh-table th.sbh-col-country,
.sbh-table th.sbh-col-league,
.sbh-table td.sbh-col-sport,
.sbh-table td.sbh-col-country,
.sbh-table td.sbh-col-league {
  text-align: center;
  padding-left: 8px;
  white-space: nowrap;
}
.sbh-table .lg-chip {
  gap: 6px;
  justify-content: center;
  color: var(--text);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.03em;
}
.sbh-table .lg-ico-sport,
.sbh-table .lg-ico-sport svg {
  width: 16px;
  height: 16px;
}
.sbh-table .lg-ico-flag {
  width: 18px;
  height: 13px;
}
.sbh-table .lg-ico-league {
  width: 16px;
  height: 16px;
  border-radius: 50%;
}
.sbh-odds { font-weight: 800; color: #fbbf24; }
.sbh-act-wrap { gap: 4px; }
.sbh-act-wrap .btn { min-height: 24px; height: 24px; padding: 0 8px; font-size: 10px; }
.sbh-subtable .sbh-col-act { width: 168px; }
.sbh-subtable .sbh-col-market { width: 112px; }
.sbh-subtable .sbh-col-choice { width: 84px; }
.sbh-market-wrap {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px;
  max-width: 100%;
}
.sbh-subtable .sbh-col-market .sbh-side-name,
.sbh-subtable .sbh-col-choice .sbh-side-name,
.sbh-table .sbh-col-choice .sbh-side-name {
  width: auto;
  min-width: 48px;
  max-width: 100%;
}
.sbh-act-cancel {
  color: #f87171;
  border-color: rgb(248 113 113 / .42);
}
.sbh-act-void {
  color: #7dd3fc;
  border-color: rgb(56 189 248 / .42);
}
.sbh-act-result,
.sbh-act-win {
  color: #34d399;
  border-color: rgb(52 211 153 / .42);
}
.sbh-act-detail.is-on {
  color: var(--text);
  background: var(--primary-soft);
}
.sbh-act-lose {
  color: #f87171;
  border-color: rgb(248 113 113 / .42);
}
.sbh-act-wrap .btn:disabled {
  opacity: .38;
  cursor: default;
}
.modal.is-sbh-result #modalSave { display: none; }
.sbh-result-modal { display: grid; gap: 14px; }
.sbh-result-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 16px;
  margin: 0;
}
.sbh-result-meta div { display: grid; gap: 3px; }
.sbh-result-meta dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}
.sbh-result-meta dd { margin: 0; font-size: 12px; font-weight: 700; }
.sbh-result-picks {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
  list-style: none;
}
.sbh-result-picks li {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) 52px;
  align-items: center;
  gap: 8px;
}
.sbh-result-picks .sbh-side-name { width: 100%; }
.sbh-result-picks span { font-size: 11px; font-weight: 700; }
.sbh-result-picks em {
  color: #fbbf24;
  font-style: normal;
  font-weight: 800;
  text-align: right;
}
.sbh-result-actions {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
}
.sbh-detail td {
  height: auto !important;
  padding: 0;
  overflow: visible;
  white-space: normal;
  background: var(--surface-2);
}
.sbh-detail:not(.is-open) { display: none; }
.sbh-detail.is-open { display: table-row; }
.sbh-sub {
  padding: 8px 10px 12px 36px;
  overflow: visible;
}
.sbh-subtable {
  table-layout: fixed;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  border-collapse: separate;
  border-spacing: 0;
}
.sbh-subtable th,
.sbh-subtable td {
  height: auto;
  min-height: 48px;
  padding: 6px 8px;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid var(--line);
}
.sbh-subtable thead th {
  height: 32px;
  color: var(--muted);
  background: var(--surface-3);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.03em;
  border-bottom: 1px solid var(--line-strong);
}
.sbh-sub-caption th {
  height: 28px;
  padding: 5px 10px;
  color: #dbe7f2;
  background: rgb(22 140 255 / .12);
  font-size: 11px;
  font-weight: 800;
  text-align: left;
  letter-spacing: -0.03em;
}
.sbh-sub-caption em {
  margin-left: 8px;
  color: var(--muted);
  font-style: normal;
  font-weight: 700;
}
.sbh-fold-gap td {
  height: 10px;
  padding: 0;
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
  background: var(--surface-2);
}
.sbh-fold-group + .sbh-fold-group {
  border-top: 0;
}
.sbh-people {
  display: inline-grid;
  place-items: center;
  min-width: 28px;
  height: 18px;
  padding: 0 7px;
  border-radius: 4px;
  color: #edf2f5;
  background: #4a5c68;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
[data-theme="dark"] .sbh-people {
  color: #e8eef2;
  background: #4e616c;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .06);
}
.sbh-sub-row { cursor: pointer; }
.sbh-sub-row.is-open { background: var(--primary-soft); }
[data-theme="dark"] .sbh-sub-row.is-open { background: rgb(22 140 255 / .08); }
.sbh-time-wrap {
  display: grid;
  justify-items: center;
  gap: 2px;
  min-width: 0;
  text-align: center;
}
.sbh-time-wrap strong {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.sbh-time-wrap small {
  color: var(--muted);
  letter-spacing: -0.03em;
}
.sbh-fold-group .sbh-sub-picks:last-child td { border-bottom: 0; }
.sbh-subtable .sbh-col-time { width: 136px; white-space: nowrap; }
.sbh-subtable .sbh-col-kind { width: 112px; }
.sbh-subtable .sbh-col-bonus { width: 88px; }
.sbh-bonus {
  display: grid;
  justify-items: center;
  gap: 1px;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: -0.03em;
}
.sbh-bonus.is-on b {
  color: #fbbf24;
  font-size: 12px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.sbh-bonus small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
}
.sbh-kind {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  height: 24px;
  border-radius: 6px;
  padding: 0 8px;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.sbh-kind.is-prematch {
  color: #93c5fd;
  background: rgb(59 130 246 / .16);
  border: 1px solid rgb(59 130 246 / .42);
}
.sbh-kind.is-special {
  color: #fbbf24;
  background: rgb(251 191 36 / .14);
  border: 1px solid rgb(251 191 36 / .38);
}
.sbh-kind.is-live {
  color: #86efac;
  background: rgb(34 197 94 / .16);
  border: 1px solid rgb(34 197 94 / .4);
}
.sbh-kind.is-esport {
  color: #c4b5fd;
  background: rgb(139 92 246 / .18);
  border: 1px solid rgb(139 92 246 / .42);
}
.sbh-sub-picks td {
  padding: 8px 10px 10px !important;
  background: rgb(255 255 255 / .02);
  text-align: left !important;
  vertical-align: top;
}
.sbh-pick-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.sbh-pick-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 6px 6px 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.sbh-pick-card p {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin: 0;
  min-width: 0;
}
.sbh-pick-card b {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sbh-pick-card p > span {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 10px;
  font-weight: 650;
  white-space: nowrap;
}
.sbh-pick-odds {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
}
.sbh-pick-opt {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 1px;
  min-height: 34px;
  padding: 3px 3px 4px;
  border: 1px solid rgb(148 163 184 / .16);
  border-radius: 6px;
  background: #151c27;
  color: #8b9aab;
  overflow: hidden;
}
.sbh-pick-opt b {
  max-width: 100%;
  overflow: hidden;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sbh-pick-opt em {
  color: #7b8794;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
  line-height: 1;
}
.sbh-pick-opt.is-on.is-home {
  color: #60a5fa;
  border-color: rgb(59 130 246 / .72);
  background: rgb(37 99 235 / .18);
}
.sbh-pick-opt.is-on.is-draw {
  color: #e5e7eb;
  border-color: rgb(148 163 184 / .5);
  background: rgb(148 163 184 / .16);
}
.sbh-pick-opt.is-on.is-away {
  color: #fb7185;
  border-color: rgb(244 63 94 / .72);
  background: rgb(244 63 94 / .16);
}
.sbh-pick-opt.is-on em { color: #fbbf24; }
[data-theme="light"] .sbh-pick-opt {
  background: #eef2f6;
  color: #64748b;
  border-color: #d1d5db;
}
[data-theme="light"] .sbh-pick-opt.is-on.is-home {
  color: #1d4ed8;
  background: #dbeafe;
  border-color: #60a5fa;
}
[data-theme="light"] .sbh-pick-opt.is-on.is-draw {
  color: #111827;
  background: #e5e7eb;
  border-color: #9ca3af;
}
[data-theme="light"] .sbh-pick-opt.is-on.is-away {
  color: #be123c;
  background: #ffe4e6;
  border-color: #fb7185;
}
[data-theme="light"] .sbh-pick-opt em { color: #94a3b8; }
[data-theme="light"] .sbh-pick-opt.is-on em { color: #d97706; }
[data-theme="light"] .sbh-sub-picks td { background: #f8fafc; }
.sbh-col-choice strong {
  color: #f8fafc;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.sbh-empty td {
  height: 180px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}
[data-theme="dark"] .sbh-folder { background: rgb(22 140 255 / .16); color: #8fd0ff; }
[data-theme="dark"] .sbh-row.is-open { background: rgb(22 140 255 / .08); }
[data-theme="dark"] .sbh-subtable { background: #121a24; }
[data-theme="dark"] .sbh-game-tabs.attb-tabs {
  background: #121a28;
  border-color: #243044;
}
[data-theme="dark"] .sbh-game-tabs.attb-tabs button,
[data-theme="dark"] .sbh-game-tabs.attb-tabs a.sbh-game-link { color: #8b9cb3; }
[data-theme="dark"] .sbh-game-tabs.attb-tabs a.sbh-game-link:hover { color: #e8eef6; background: #1a2740; }
[data-theme="dark"] .sbh-game-tabs.attb-tabs button.active,
[data-theme="dark"] .sbh-game-tabs.attb-tabs a.sbh-game-link.active {
  background: #1a2740;
  color: #e8eef6;
  box-shadow: none;
}
[data-theme="dark"] .sbh-sub-tabs {
  background: #0f1622;
  border-color: #243044;
}
[data-theme="dark"] .sbh-sub-tabs > button { border-color: #243044; color: #8b9cb3; }
[data-theme="dark"] .sbh-sub-tabs > button.is-active {
  background: rgb(22 140 255 / .14);
  color: #e8eef6;
}
[data-theme="dark"] .sbh-vs-tabs > button.is-active {
  background: rgb(22 140 255 / .14);
}
@media (max-width: 1280px) {
  .sbh-game-tabs.attb-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sbh-tabs.attb-tabs { flex-wrap: wrap; }
  .sbh-tabs.attb-tabs button { flex: 1 1 18%; }
  .sbh-filter .sbh-dates { flex: 1.4 1 0; }
  .sbh-filter .sbh-keyword { flex: 1.2 1 0; max-width: none; }
  .sbh-pick-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .sbh-pick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.smk-page { display: grid; gap: 10px; min-width: 0; }
.smk-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.smk-kpi {
  display: grid;
  gap: 4px;
  min-height: 64px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--muted);
  background: var(--surface);
  text-align: left;
  cursor: pointer;
}
.smk-kpi span { font-size: 11px; font-weight: 600; }
.smk-kpi strong {
  color: var(--text);
  font-size: 20px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.smk-kpi.is-on {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--line));
  background: color-mix(in srgb, var(--primary-soft) 80%, var(--surface));
}
.smk-kpi.ok strong { color: #67e8f9; }
.smk-kpi.info strong { color: #7dd3fc; }
.smk-kpi.warn strong { color: #fbbf24; }
.smk-sports.lg-tabs.attb-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  margin-bottom: 0;
}
.smk-sports.lg-tabs.attb-tabs button {
  min-height: 40px;
  padding: 8px 6px;
  font-size: 12px;
}
.smk-sports.lg-tabs.attb-tabs button em {
  background: color-mix(in srgb, #0891b2 24%, transparent);
  color: #67e8f9;
}
.smk-sports.lg-tabs.attb-tabs button.active em {
  background: #0891b2;
  color: #fff;
}
@media (max-width: 1400px) {
  .smk-sports.lg-tabs.attb-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .smk-sports.lg-tabs.attb-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.smk-filter { flex-wrap: wrap; border-radius: 12px; padding: 10px 12px; }
.smk-filter .users-keyword { margin-left: 0; min-width: 220px; max-width: none; flex: 1 1 220px; }
.smk-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
  color: var(--muted);
  font-size: 12px;
}
.smk-meta p { margin: 0; }
.smk-meta strong, .smk-meta b { color: var(--text); }
.smk-lane {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
}
.smk-lane-head {
  display: flex;
  align-items: center;
  gap: 10px;
}
.smk-lane-head h2 { margin: 0; font-size: 15px; letter-spacing: -.02em; }
.smk-lane-head span {
  margin-left: auto;
  min-width: 28px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--surface-3, var(--surface));
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}
.smk-cards {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.smk-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  container-type: inline-size;
}
.smk-card.is-off { opacity: .72; }
.smk-card.is-결과 { box-shadow: inset 3px 0 0 #38bdf8; }
.smk-card.is-스코어 { box-shadow: inset 3px 0 0 #34d399; }
.smk-card.is-스페셜 { box-shadow: inset 3px 0 0 #c084fc; }
.smk-card-head {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 8px 8px 0;
}
.smk-card-head div { min-width: 0; flex: 1; }
.smk-card-head strong {
  display: block;
  overflow: hidden;
  font-size: 12px;
  letter-spacing: -.02em;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.smk-card-head em {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .03em;
}
.smk-pill {
  flex: 0 0 auto;
  padding: 1px 5px;
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-3, var(--surface-2));
  font-size: 9px;
  font-weight: 800;
}
.smk-pill.is-on { color: #67e8f9; background: color-mix(in srgb, #0891b2 22%, transparent); }
.smk-outs {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin: 6px 8px 8px;
}
.smk-outs span {
  padding: 2px 5px;
  border-radius: 999px;
  color: var(--text);
  background: color-mix(in srgb, var(--surface-3, var(--bg)) 70%, transparent);
  font-size: 9px;
  font-weight: 650;
}
.smk-card-foot {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: end;
  gap: 8px 6px;
  margin-top: auto;
  padding: 8px 8px 10px;
  border-top: 1px solid var(--line);
}
.smk-flag {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 0;
  color: var(--muted);
  font-size: 10px;
  font-weight: 650;
}
.smk-flag span { white-space: nowrap; }
.smk-flag .switch {
  flex: none;
  width: 36px;
  height: 20px;
  min-width: 36px;
  min-height: 20px;
  max-width: 36px;
  max-height: 20px;
}
.smk-del {
  grid-column: 1 / -1;
  margin-top: 2px;
  border: 0;
  padding: 0;
  color: #f87171;
  background: none;
  font-size: 11px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
@container (max-width: 250px) {
  .smk-card-foot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .smk-flag:nth-child(3) { grid-column: 1 / -1; }
}
.smk-empty {
  margin: 0;
  padding: 36px 12px;
  color: var(--muted);
  text-align: center;
}
.modal.is-smk-add { width: min(560px, 100%); }
@media (max-width: 1180px) {
  .smk-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .smk-kpis, .smk-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.content:has(.smk-page) { padding-top: 16px; }
.content:has(.smk-page) .page-head { margin-bottom: 12px; align-items: flex-end; }
.content:has(.smk-page) .head-actions .btn { min-width: 76px; }

.content:has(.sbs-page) { padding-top: 16px; }
.content:has(.sbs-page) .page-head { margin-bottom: 12px; align-items: flex-end; }
.content:has(.sbs-page) .head-actions .btn { min-width: 76px; }
.sbs-page {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.sbs-compact { padding: 2px 0; overflow: hidden; }
.sbs-compact-row {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 6px 20px;
  align-items: center;
  padding: 8px 14px;
  border-bottom: 1px solid var(--line);
}
.sbs-compact-row.is-full { grid-template-columns: 1fr; }
.sbs-compact-row:last-child { border-bottom: 0; }
.sbs-group {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.sbs-group > b {
  flex: 0 0 92px;
  color: var(--text);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: -.2px;
}
.sbs-group-fields {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 10px;
  min-width: 0;
}
.sbs-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.sbs-inline > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  white-space: nowrap;
}
.sbs-inline .input {
  width: 58px;
  height: 28px;
  padding: 2px 8px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.sbs-control {
  display: flex;
  min-width: 0;
}
.sbs-control .input { flex: 1 1 auto; }
.sbs-control.has-unit .input {
  width: 48px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.sbs-control em {
  display: grid;
  place-items: center;
  flex: 0 0 26px;
  height: 28px;
  border: 1px solid var(--line-strong);
  border-left: 0;
  border-radius: 0 6px 6px 0;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 650;
}
.sbs-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
}
.sbs-toggle em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 650;
}
.sbs-toggle:has(.switch[aria-checked="true"]) em { color: var(--primary); }
.sbs-cuts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  min-width: 0;
}
.sbs-cut {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px 14px 16px;
  overflow: visible;
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface) 92%, #000 8%);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.sbs-cut-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px 12px;
}
.sbs-cut-add {
  min-height: 34px;
  padding: 0 14px;
  border-radius: 8px;
  font-weight: 700;
}
.sbs-cut-title {
  margin: 0;
  color: var(--text);
  font-size: 15px;
  font-weight: 750;
  letter-spacing: -.3px;
  text-align: center;
  line-height: 1.2;
}
.sbs-cut-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.sbs-cut-count {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.sbs-cut-count b { color: var(--text); font-weight: 750; }
.sbs-cut-count span { color: var(--muted); font-weight: 550; }
.sbs-cut-help {
  position: relative;
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 20px;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  cursor: help;
}
.sbs-cut-help:hover,
.sbs-cut-help:focus,
.sbs-cut-help:focus-visible,
.sbs-cut-help.is-open {
  z-index: 40;
  color: var(--text);
  border-color: var(--primary);
  background: var(--primary-soft);
}
.sbs-cut-tip {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 30;
  display: none;
  width: 320px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #0f172a;
  color: #f8fafc;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.55;
  text-align: left;
  white-space: normal;
  box-shadow: 0 10px 24px rgb(15 23 42 / .38);
  pointer-events: none;
}
.sbs-cut-tip::before {
  content: "";
  position: absolute;
  right: 6px;
  bottom: 100%;
  border: 6px solid transparent;
  border-bottom-color: #0f172a;
}
.sbs-cut-help:hover .sbs-cut-tip,
.sbs-cut-help:focus .sbs-cut-tip,
.sbs-cut-help:focus-visible .sbs-cut-tip,
.sbs-cut-help.is-open .sbs-cut-tip { display: block; }
.sbs-cut-scroll { overflow: hidden; border-radius: 10px; }
.sbs-cut-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.sbs-cut-col-check { width: 56px; }
.sbs-cut-col-range { width: 64px; }
.sbs-cut-col-cut { width: 110px; }
.sbs-cut-col-act { width: 78px; }
.sbs-cut-table th,
.sbs-cut-table td {
  height: 44px;
  padding: 6px 8px;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}
.sbs-cut-table thead th {
  height: 42px;
  background: color-mix(in srgb, var(--surface-2) 88%, #000 12%);
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: -.2px;
}
.sbs-cut-table thead th:first-child { border-radius: 10px 0 0 0; }
.sbs-cut-table thead th:last-child { border-radius: 0 10px 0 0; }
.sbs-cut-table tbody td { background: color-mix(in srgb, var(--surface-2) 55%, transparent); }
.sbs-cut-table tbody tr:last-child td { border-bottom: 0; }
.sbs-cut-table tbody tr.is-off td { opacity: .46; }
.sbs-cut-range {
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.sbs-cut-odds {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.sbs-cut-odds em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 650;
}
.sbs-cut-table .input {
  width: 72px;
  height: 30px;
  margin: 0 auto;
  padding: 0 8px;
  text-align: center;
  border-radius: 6px;
  background: color-mix(in srgb, var(--surface-3) 80%, #000 8%);
  font-variant-numeric: tabular-nums;
}
.sbs-cut-val { width: 72px !important; }
.sbs-cut-check {
  width: 18px;
  height: 18px;
  margin: 0;
  appearance: none;
  border: 1.5px solid color-mix(in srgb, var(--primary) 55%, var(--line-strong));
  border-radius: 4px;
  background: var(--surface);
  vertical-align: middle;
  cursor: pointer;
}
.sbs-cut-check:checked {
  border-color: var(--primary);
  background: var(--primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3.5 8.5 6.5 11.5 12.5 4.5'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.sbs-cut-del {
  min-width: 52px;
  min-height: 28px;
  padding: 0 10px;
  border-color: #ef4444;
  background: #ef4444;
  color: #fff;
  font-weight: 700;
}
.sbs-cut-del:hover { border-color: #dc2626; background: #dc2626; color: #fff; }
.sbs-cut-empty td {
  height: 72px;
  color: var(--muted);
  font-size: 12px;
}
.sbs-cut-foot {
  display: flex;
  justify-content: center;
  padding-top: 2px;
}
.sbs-cut-save {
  min-width: 132px;
  min-height: 36px;
  border-color: #16a34a;
  background: #22c55e;
  color: #fff;
  font-weight: 750;
}
.sbs-cut-save:hover { border-color: #15803d; background: #16a34a; color: #fff; }
.sbs-cut-save svg { width: 14px; height: 14px; }
@media (max-width: 1280px) {
  .sbs-compact-row { grid-template-columns: 1fr; }
  .sbs-cuts { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .sbs-group { align-items: flex-start; flex-direction: column; gap: 8px; }
  .sbs-cut-col-range { width: 48px; }
  .sbs-cut-col-cut { width: 88px; }
}

.nt-card { padding: 16px 18px 18px; margin-bottom: 14px; }
.nt-card .coupon-catalog-head { margin-bottom: 14px; }
.nt-ticker {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 0 14px;
  border-radius: 12px;
  background: #10161f;
  color: #e8eef6;
  overflow: hidden;
}
.nt-ticker.is-off { opacity: .55; }
.nt-ticker-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 10px 0 8px;
  border-radius: 999px;
  background: #1d6dff;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
}
.nt-ticker-badge svg { width: 13px; height: 13px; }
.nt-ticker-view { min-width: 0; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 12px), transparent); }
.nt-ticker-track {
  display: flex;
  align-items: center;
  gap: 28px;
  width: max-content;
  font-size: 13px;
  font-weight: 650;
  white-space: nowrap;
  animation: nt-marquee var(--nt-speed, 18s) linear infinite;
}
.nt-ticker.is-paused .nt-ticker-track,
.nt-ticker.is-off .nt-ticker-track { animation-play-state: paused; }
.nt-ticker-track i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #5b6b80;
  flex: 0 0 auto;
}
.nt-ticker-live {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #8b9cb3;
  font-size: 11px;
  font-weight: 800;
}
.nt-ticker-live em {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #f3f6fb;
  font-style: normal;
}
.nt-ticker-live em i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff4d4f;
  box-shadow: 0 0 0 4px rgb(255 77 79 / .16);
}
.nt-ticker-pause {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 8px;
  background: rgb(255 255 255 / .06);
  color: #d5deea;
  display: grid;
  place-items: center;
}
.nt-ticker-pause svg { width: 14px; height: 14px; }
@keyframes nt-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.nt-ticker-edit {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 16px;
  margin-top: 14px;
}
.nt-ticker-flags {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
}
.nt-speed { display: grid; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 650; }
.nt-speed input { width: 100%; }
.nt-ticker-items { display: grid; gap: 8px; }
.nt-ticker-item {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 36px;
  gap: 8px;
  align-items: center;
}
.nt-web {
  padding: 16px;
  border-radius: 16px;
  background: #121821;
  color: #dce6f2;
}
.nt-hero {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 18px 20px;
  margin-bottom: 14px;
  border-radius: 14px;
  background: linear-gradient(180deg, #1a2432, #151c28);
  border: 1px solid #243042;
}
.nt-hero-copy { display: flex; gap: 12px; align-items: flex-start; min-width: 0; }
.nt-hero-copy > i {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #1d6dff;
  color: #fff;
  flex: 0 0 auto;
}
.nt-hero-copy svg { width: 18px; height: 18px; }
.nt-hero-copy strong { display: block; font-size: 15px; letter-spacing: -.02em; }
.nt-hero-copy p { margin: 4px 0 0; color: #8ea0b5; font-size: 12px; }
.nt-hero-marks { display: flex; gap: 18px; color: #7d8fa6; }
.nt-hero-marks span { display: grid; justify-items: center; gap: 6px; font-size: 11px; }
.nt-hero-marks svg { width: 22px; height: 22px; color: #3d8bff; }
.nt-search {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 86px;
  gap: 8px;
  margin-bottom: 12px;
}
.nt-cat {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #2a3648;
  border-radius: 12px;
  background: #171f2b;
  color: #9aabc0;
  font-size: 12px;
  white-space: nowrap;
}
.nt-cat .select {
  border: 0;
  background: transparent;
  color: #e8eef6;
  height: 38px;
  padding: 0;
}
.nt-search .input {
  height: 40px;
  border-radius: 12px;
  border-color: #2a3648;
  background: #171f2b;
  color: #e8eef6;
}
.nt-table-wrap { overflow: auto; }
.nt-table { width: 100%; border-collapse: collapse; }
.nt-table th {
  height: 42px;
  color: #7d8fa6;
  font-size: 12px;
  font-weight: 650;
  text-align: left;
  border-bottom: 1px solid #243042;
}
.nt-table td {
  height: 52px;
  padding: 6px 8px 6px 0;
  border-bottom: 1px solid #1c2633;
  font-size: 13px;
  color: #c9d6e5;
}
.nt-table td:first-child, .nt-table th:first-child { width: 64px; text-align: center; }
.nt-table td:nth-child(3), .nt-table th:nth-child(3),
.nt-table td:nth-child(4), .nt-table th:nth-child(4) { width: 110px; color: #8ea0b5; }
.nt-table td:nth-child(5), .nt-table th:nth-child(5) { width: 72px; }
.nt-table td:last-child, .nt-table th:last-child { width: 118px; }
.nt-title-cell { display: flex; align-items: center; gap: 8px; min-width: 0; }
.nt-table tr:hover td { background: rgb(255 255 255 / .02); }
.nt-no, .nt-title {
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
}
.nt-title { color: #e8eef6; font-weight: 650; }
.nt-star {
  width: 28px;
  height: 28px;
  border: 0;
  background: transparent;
  color: #3d4b5d;
  display: grid;
  place-items: center;
}
.nt-star svg { width: 15px; height: 15px; fill: currentColor; stroke: none; }
.nt-star.is-on { color: #f3c453; }
.nt-chip {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 800;
  font-style: normal;
}
.nt-chip.is-notice { color: #6ec8ff; background: rgb(110 200 255 / .12); }
.nt-chip.is-event { color: #5eead4; background: rgb(94 234 212 / .12); }
.nt-chip.is-check { color: #f0b15a; background: rgb(240 177 90 / .14); }
.nt-chip.is-guide { color: #9aa8ba; background: rgb(154 168 186 / .12); }
.nt-ops { display: flex; gap: 6px; }
.nt-ops .btn { min-width: 44px; }
.nt-table tr.is-hidden td { opacity: .5; }
.nt-empty { text-align: center; color: #7d8fa6; padding: 28px 0; }
.nt-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  color: #8ea0b5;
  font-size: 12px;
}
.nt-pages { display: flex; align-items: center; gap: 6px; }
.nt-pages button {
  min-width: 32px;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #9aabc0;
}
.nt-pages button.is-on { background: #1d6dff; color: #fff; font-weight: 800; }
.nt-pages em { color: #5b6b80; font-style: normal; }
.nt-pager .select {
  width: 118px;
  height: 34px;
  border-color: #2a3648;
  background: #171f2b;
  color: #dce6f2;
}
.nt-edit-work {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.nt-editor { display: grid; gap: 12px; }
.nt-editor .form-field > span { color: var(--muted); font-size: 10px; font-weight: 550; }
.nt-editor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.nt-editor-flags { display: flex; gap: 18px; }
.nt-textarea { min-height: 120px; resize: vertical; line-height: 1.55; }
.nt-detail { padding: 22px; }
.nt-detail-chips { display: flex; gap: 6px; margin-bottom: 10px; }
.nt-detail h2 { margin: 0; font-size: 26px; letter-spacing: -.03em; line-height: 1.3; color: #f3f6fb; }
.nt-detail-meta {
  display: flex;
  gap: 16px;
  margin: 12px 0 18px;
  color: #8ea0b5;
  font-size: 12px;
}
.nt-detail-meta span { display: inline-flex; align-items: center; gap: 6px; }
.nt-detail-meta svg { width: 14px; height: 14px; }
.nt-lead {
  margin: 0 0 18px;
  padding: 14px 16px;
  border-radius: 10px;
  border-left: 3px solid #3d8bff;
  background: #1a2433;
  color: #d7e4f4;
  font-weight: 650;
}
.nt-body { display: grid; gap: 10px; color: #c5d2e2; line-height: 1.7; font-size: 14px; }
.nt-body p { margin: 0; }
.nt-note {
  margin-top: 22px;
  padding: 16px 18px;
  border-radius: 12px;
  background: #182230;
  border: 1px solid #243042;
}
.nt-note strong {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #6ec8ff;
  font-size: 13px;
}
.nt-note svg { width: 16px; height: 16px; }
.nt-note ul { margin: 10px 0 0; padding-left: 18px; color: #b7c6d8; }
.nt-note li { margin: 4px 0; }
.nt-nav {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid #243042;
}
.nt-nav > div { display: grid; gap: 8px; min-width: 0; }
.nt-nav > div button {
  border: 0;
  background: transparent;
  color: #9aabc0;
  text-align: left;
}
.nt-nav small { display: block; font-size: 11px; color: #6d7e93; }
.nt-nav b { display: block; color: #dce6f2; font-size: 13px; font-weight: 650; }
.nt-web > .nt-ticker { margin-bottom: 14px; }
.nt-chip.is-cs { color: #7db4ff; background: rgb(125 180 255 / .14); }
.nt-note.is-wait { border-color: #3a3220; }
.nt-note .nt-body { margin-top: 10px; }
.nt-sign { margin: 22px 0 0; color: #c5d2e2; line-height: 1.7; }
.nt-sign b { color: #e8eef6; }
.nt-table tr.is-wait td { background: rgb(240 177 90 / .04); }
@media (max-width: 1180px) {
  .nt-ticker-edit,
  .nt-edit-work,
  .nt-hero { grid-template-columns: 1fr; display: grid; }
  .nt-hero-marks { justify-content: start; }
}

.cs-shell {
  --cs-bg: #10151c;
  --cs-card: #171d26;
  --cs-line: #242c38;
  --cs-text: #e8eef6;
  --cs-muted: #8b99ad;
  --cs-blue: #5eb3ff;
  --cs-blue-deep: #4aa3ff;
  margin-top: 4px;
  display: grid;
  gap: 12px;
  color: var(--cs-text);
}
.content:has(.cs-shell) .page-head { align-items: center; }
.content:has(.cs-shell) .head-actions {
  align-items: center;
  gap: 16px;
}
.content:has(.cs-shell) .cs-daybar {
  margin: 0 4px 0 0;
}
.cs-tabs.attb-tabs {
  grid-template-columns: repeat(8, minmax(0, 1fr));
  margin-bottom: 0;
  width: 100%;
}
.cs-tabs.attb-tabs button {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 6px;
  font-size: 13px;
}
.cs-tabs.attb-tabs button em {
  min-width: 22px;
  border-radius: 999px;
  padding: 1px 7px;
  background: rgb(220 38 38 / .18);
  color: #fca5a5;
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.cs-tabs.attb-tabs button.active em {
  background: #dc2626;
  color: #fff;
}
.cs-work {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(340px, 1fr);
  gap: 12px;
  align-items: start;
}
.cs-work > .cs-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.cs-list-panel .cs-table-wrap {
  flex: none;
  height: auto;
  min-height: 0;
  overflow: visible;
}
.cs-ask-panel .cs-field-body,
.cs-ask-panel .cs-tpl-preview { flex: 1; display: flex; flex-direction: column; min-height: 280px; }
.cs-ask-panel .cs-area {
  flex: 1;
  min-height: 280px;
  height: 100%;
}
.cs-thread.is-empty {
  display: grid;
  place-items: center;
  min-height: 88px;
  color: var(--cs-muted);
}
.cs-tpl-board { min-height: 640px; }
.cs-mode-tabs.attb-tabs {
  grid-template-columns: 1fr 1fr;
  margin-bottom: 0;
}
.cs-table td.cs-ops {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.cs-wait-btn {
  min-width: 68px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  padding: 0 10px;
  background: rgb(210 176 72 / .18);
  color: #e2c56a;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.cs-wait-btn:hover { background: rgb(210 176 72 / .32); }
.cs-del-btn {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 8px;
  background: rgb(239 68 68 / .12);
  color: #fca5a5;
  cursor: pointer;
}
.cs-del-btn svg { width: 14px; height: 14px; }
.cs-tpl-preview {
  margin-top: 12px;
  padding: 14px 16px;
  border-radius: 14px;
  background: #141b24;
  border: 1px solid var(--cs-line);
  color: #c5d0de;
  line-height: 1.65;
  font-size: 13px;
  flex: 1;
  overflow: auto;
}
.cs-tpl-preview strong { display: block; margin-bottom: 6px; color: var(--cs-text); }
.cs-tpl-preview p { margin: 0; }
.cs-tpl-form { display: grid; gap: 0; }
@media (max-width: 1280px) {
  .cs-tabs.attb-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cs-work { grid-template-columns: 1fr; }
}
.cs-front {
  --cs-bg: #10151c;
  --cs-card: #171d26;
  --cs-line: #242c38;
  --cs-text: #e8eef6;
  --cs-muted: #8b99ad;
  --cs-blue: #5eb3ff;
  --cs-blue-deep: #4aa3ff;
  display: grid;
  gap: 14px;
  padding: 4px 0 8px;
  color: var(--cs-text);
  font-family: Pretendard Variable, Pretendard, "Apple SD Gothic Neo", sans-serif;
}
.cs-kpi {
  display: grid;
  grid-template-columns: 1.35fr repeat(3, 1fr) 1.15fr;
  gap: 12px;
}
.cs-kpi-card,
.cs-ask,
.cs-panel {
  background: var(--cs-card);
  border: 1px solid var(--cs-line);
  border-radius: 18px;
  box-shadow: 0 10px 24px rgb(0 0 0 / .18);
}
.cs-kpi-card {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 92px;
  padding: 16px 18px;
}
.cs-kpi-card i {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgb(94 179 255 / .12);
  color: var(--cs-blue);
  flex: none;
}
.cs-kpi-card i svg { width: 20px; height: 20px; }
.cs-kpi-card.is-heart i { background: rgb(94 179 255 / .16); }
.cs-kpi-card.is-heart i svg { fill: currentColor; stroke: none; }
.cs-kpi-card em {
  display: block;
  color: var(--cs-muted);
  font-size: 11px;
  font-style: normal;
  letter-spacing: -.01em;
}
.cs-kpi-card strong {
  display: block;
  margin-top: 2px;
  color: var(--cs-text);
  font-size: 15px;
  font-weight: 750;
  letter-spacing: -.03em;
}
.cs-kpi-card.is-time strong { font-size: 26px; line-height: 1.15; }
.cs-kpi-card p { margin: 4px 0 0; color: var(--cs-muted); font-size: 11px; }
.cs-ask {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 16px 20px;
  border: 0;
  background: linear-gradient(180deg, #74c0ff, #4aa3ff);
  color: #fff;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 10px 24px rgb(74 163 255 / .28);
}
.cs-ask b {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -.03em;
}
.cs-ask svg { width: 18px; height: 18px; }
.cs-ask span { color: rgb(255 255 255 / .86); font-size: 12px; }
.cs-mid,
.cs-low {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(320px, 1fr);
  gap: 12px;
  align-items: stretch;
}
.cs-panel { display: flex; flex-direction: column; padding: 20px 22px 18px; }
.cs-panel h2 {
  margin: 0;
  color: var(--cs-text);
  font-size: 17px;
  font-weight: 750;
  letter-spacing: -.03em;
}
.cs-panel > p,
.cs-panel-head p {
  margin: 6px 0 0;
  color: var(--cs-muted);
  font-size: 12px;
  line-height: 1.5;
}
.cs-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.cs-more {
  border: 0;
  background: transparent;
  color: var(--cs-muted);
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}
.cs-faq-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding: 6px 6px 6px 16px;
  border-radius: 14px;
  background: #121821;
  border: 1px solid #222a36;
}
.cs-faq-search .input {
  flex: 1;
  height: 42px;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--cs-text);
  font-size: 13px;
}
.cs-faq-search .input::placeholder { color: #6d7b8f; }
.cs-faq-go {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 12px;
  background: #1a222d;
  color: #d5deea;
  cursor: pointer;
}
.cs-faq-go svg { width: 18px; height: 18px; }
.cs-faq-hits { display: grid; gap: 8px; margin-top: 12px; }
.cs-faq-hits button {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--cs-line);
  border-radius: 12px;
  background: #141b24;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.cs-faq-hits b { font-size: 13px; }
.cs-faq-hits span { color: var(--cs-muted); font-size: 12px; line-height: 1.5; }
.cs-empty { margin: 14px 0 0; color: var(--cs-muted); font-size: 12px; }
.cs-cats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 16px;
}
.cs-cat {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 10px;
  min-height: 74px;
  padding: 12px 14px;
  border: 1px solid var(--cs-line);
  border-radius: 14px;
  background: #141b24;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.cs-cat.is-on,
.cs-cat:hover { border-color: #33506f; background: #182230; }
.cs-cat i {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgb(94 179 255 / .1);
  color: #9ec4ea;
}
.cs-cat i svg,
.cs-cat em svg { width: 16px; height: 16px; }
.cs-cat span { display: grid; gap: 3px; min-width: 0; }
.cs-cat b { font-size: 14px; font-weight: 750; }
.cs-cat small { color: var(--cs-muted); font-size: 11px; }
.cs-cat em { color: #6d7c90; }
.cs-table-wrap { overflow: visible; margin-top: 4px; }
.cs-table {
  width: 100%;
  min-width: 0;
  border-collapse: collapse;
  table-layout: fixed;
}
.cs-table th,
.cs-table td {
  height: 52px;
  padding: 6px 5px;
  border: 0;
  background: transparent;
  color: #c5d0de;
  font-size: 11px;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}
.cs-table th {
  height: 38px;
  color: #7e8ea3;
  font-weight: 700;
  line-height: 1.3;
}
.cs-table col.cs-col-no { width: 48px; }
.cs-table col.cs-col-parent { width: 96px; }
.cs-table col.cs-col-account { width: 78px; }
.cs-table col.cs-col-grade { width: 68px; }
.cs-table col.cs-col-level { width: 40px; }
.cs-table col.cs-col-set { width: 84px; }
.cs-table col.cs-col-memo { width: 52px; }
.cs-table col.cs-col-title { width: auto; }
.cs-table col.cs-col-cat { width: 64px; }
.cs-table col.cs-col-at { width: 118px; }
.cs-table col.cs-col-state { width: 72px; }
.cs-table col.cs-col-ops { width: 80px; }
.cs-table .writer-inner { justify-content: center; }
.cs-table td.writer-cell,
.cs-table td.account-cell,
.cs-table td.memo-cell { overflow: visible; }
.cs-table .writer-cell strong,
.cs-table .account-cell .link,
.cs-table .account-cell strong { color: var(--cs-text); }
.cs-table .account-cell .link {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: var(--cs-blue);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.cs-table .writer-cell small,
.cs-table .account-cell small { color: var(--cs-muted); }
.cs-table td.member-settings { overflow: hidden; }
.cs-table td.cs-title { overflow: hidden; text-overflow: ellipsis; }
.cs-table .org-tree-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}
.cs-table tbody tr,
.cs-table tbody tr:nth-child(odd),
.cs-table tbody tr:nth-child(even) { background: transparent; }
.cs-table tbody tr { cursor: pointer; }
.cs-table tbody tr + tr td { border-top: 1px solid #1f2733; }
.cs-table tbody tr:hover td,
.cs-table tbody tr.is-on td { background: rgb(94 179 255 / .05); }
.cs-state {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}
.cs-state.is-success { color: #7ee0c2; background: rgb(62 196 154 / .16); }
.cs-state.is-wait { color: #e2c56a; background: rgb(210 176 72 / .16); }
.cs-state.is-info { color: #8ec8ff; background: rgb(94 179 255 / .16); }
.cs-tag {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}
.cs-tag.is-money { color: #7ee0c2; background: rgb(62 196 154 / .14); }
.cs-tag.is-game { color: #8ec8ff; background: rgb(94 179 255 / .14); }
.cs-tag.is-account { color: #c4b5ff; background: rgb(167 139 250 / .14); }
.cs-tag.is-event { color: #ffc089; background: rgb(255 168 76 / .14); }
.cs-pages {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding-top: 14px;
}
.cs-pages button {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #8b99ad;
  font-size: 12px;
  cursor: pointer;
}
.cs-pages button.is-on { background: #3d8bff; color: #fff; font-weight: 700; }
.cs-pages button:disabled { opacity: .35; cursor: default; }
.cs-field {
  display: grid;
  gap: 7px;
  margin-top: 14px;
  color: var(--cs-muted);
  font-size: 12px;
  font-weight: 650;
}
.cs-field .input,
.cs-field .select {
  width: 100%;
  min-height: 44px;
  border: 1px solid #222a36;
  border-radius: 12px;
  background: #121821;
  color: var(--cs-text);
  box-shadow: none;
}
.cs-area { min-height: 280px; resize: vertical; line-height: 1.65; padding-top: 12px; }
.cs-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 48px;
  margin-top: 18px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(180deg, #74c0ff, #4aa3ff);
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 10px 22px rgb(74 163 255 / .24);
}
.cs-submit svg { width: 16px; height: 16px; }
.cs-thread {
  padding: 14px 16px;
  border-radius: 14px;
  background: #141b24;
  border: 1px solid var(--cs-line);
}
.cs-thread-top { display: flex; gap: 6px; margin-bottom: 8px; }
.cs-thread strong { display: block; font-size: 15px; }
.cs-thread p { margin: 8px 0 0; color: #c5d0de; line-height: 1.65; font-size: 13px; }
.cs-reply-actions { display: flex; gap: 8px; margin-top: auto; padding-top: 16px; }
.cs-reply-actions .cs-submit { width: auto; flex: 1; margin-top: 0; }
.cs-submit:disabled { opacity: .45; cursor: default; box-shadow: none; }
@media (max-width: 1280px) {
  .cs-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-ask { grid-column: 1 / -1; min-height: 84px; }
  .cs-mid, .cs-low { grid-template-columns: 1fr; }
}

.cl-kpis { margin-bottom: 14px; }
.cl-stage {
  padding: 18px 18px 16px;
  border: 1px solid #1c2430;
  border-radius: 18px;
  background:
    radial-gradient(ellipse at 50% 0%, rgb(56 189 248 / .08), transparent 46%),
    #0b1018;
}
.cl-stage-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.cl-stage-head h2 { margin: 0; font-size: 18px; }
.cl-stage-head p { margin: 4px 0 0; color: #93a4b8; font-size: 13px; }
.cl-modes { display: flex; flex-wrap: wrap; gap: 6px; }
.cl-mode {
  height: 32px;
  padding: 0 12px;
  border: 1px solid #243044;
  border-radius: 999px;
  background: #121826;
  color: #9fb0c3;
  font-size: 12px;
  font-weight: 700;
}
.cl-mode.is-on {
  border-color: #38bdf8;
  background: rgb(56 189 248 / .14);
  color: #e8f6ff;
}
.cl-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.cl-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid #1e293b;
  border-radius: 12px;
  background: #141b24;
  color: #f8fafc;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
}
.cl-chip.is-all { font-size: 13px; letter-spacing: 0; }
.cl-chip.is-on {
  border-color: #38bdf8;
  box-shadow: inset 0 0 0 1px rgb(56 189 248 / .35);
  background: #1b2838;
}
.cl-mark {
  display: grid;
  place-items: center;
  min-width: 22px;
  height: 18px;
  border-radius: 4px;
  font-size: 9px;
  font-weight: 900;
  background: #0f172a;
}
.cl-mark.is-pp, .cl-mark.is-ev, .cl-mark.is-pt, .cl-mark.is-bt { color: #f8fafc; }
.cl-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}
.cl-card {
  min-width: 0;
  border-radius: 16px;
  background: #10161f;
}
.cl-card.is-dragging { opacity: .45; }
.cl-card.is-drop .cl-cover { outline: 2px solid #38bdf8; }
.cl-cover {
  position: relative;
  aspect-ratio: 16 / 10.4;
  overflow: hidden;
  border: 1px solid rgb(56 189 248 / .42);
  border-radius: 14px;
  background:
    radial-gradient(ellipse at 50% 120%, rgb(0 0 0 / .15), transparent 50%),
    linear-gradient(180deg, rgb(255 255 255 / .06), rgb(0 0 0 / .55)),
    var(--cl-scene, #123);
}
.cl-cover::after {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: 18%;
  height: 28%;
  border-radius: 50%;
  background: rgb(0 0 0 / .28);
  box-shadow: 0 0 30px rgb(0 0 0 / .35);
}
.cl-card.is-pp { --cl-scene: linear-gradient(160deg, #1b2a4a, #0c1220 58%, #c4a574); }
.cl-card.is-ev { --cl-scene: linear-gradient(160deg, #3a1020, #12080d 55%, #8a1a28); }
.cl-card.is-pt { --cl-scene: linear-gradient(160deg, #16324d, #0b1522 55%, #1d4e89); }
.cl-card.is-bt { --cl-scene: linear-gradient(160deg, #0f3a38, #071614 55%, #1d6b63); }
.cl-card.is-bg { --cl-scene: linear-gradient(160deg, #12325c, #08101c 55%, #1e4b9c); }
.cl-card.is-dg { --cl-scene: linear-gradient(160deg, #4a1420, #14080c 55%, #b4233a); }
.cl-card.is-ae { --cl-scene: linear-gradient(160deg, #4a3410, #161008 55%, #c9a227); }
.cl-card.is-mg { --cl-scene: linear-gradient(160deg, #3d2a12, #120e08 55%, #b08a3a); }
.cl-card.is-mt { --cl-scene: linear-gradient(160deg, #2d1650, #10081c 55%, #7c3aed); }
.cl-card.is-sa { --cl-scene: linear-gradient(160deg, #4a1220, #12080c 55%, #dc2626); }
.cl-card.is-wm { --cl-scene: linear-gradient(160deg, #0f3b34, #071412 55%, #0f766e); }
.cl-card.is-gp { --cl-scene: linear-gradient(160deg, #4a1638, #140814 55%, #db2777); }
.cl-card.is-dw { --cl-scene: linear-gradient(160deg, #3a2a10, #120e08 55%, #ca8a04); }
.cl-card.is-sg { --cl-scene: linear-gradient(160deg, #1e293b, #0b1220 55%, #94a3b8); }
.cl-card.is-sw { --cl-scene: linear-gradient(160deg, #312e81, #0f172a 55%, #22d3ee); }
.cl-card.is-og { --cl-scene: linear-gradient(160deg, #3f1212, #120808 55%, #ef4444); }
.cl-card.is-cg { --cl-scene: linear-gradient(160deg, #111827, #0b1220 55%, #e5e7eb); }
.cl-card.is-pg { --cl-scene: linear-gradient(160deg, #1f2937, #0b1220 55%, #f8fafc); }
.cl-brand {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-shadow: 0 1px 8px rgb(0 0 0 / .65);
}
.cl-hot {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  padding: 2px 6px;
  border-radius: 999px;
  background: linear-gradient(180deg, #fbbf24, #d97706);
  color: #1a1205;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .04em;
}
.cl-live {
  position: absolute;
  left: 8px;
  bottom: 8px;
  z-index: 2;
  color: #67e8f9;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .18em;
}
.cl-order {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 2;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgb(15 23 42 / .8);
  color: #e0f2fe;
  font-size: 11px;
  font-weight: 800;
}
.cl-maint, .cl-hide {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-content: center;
  text-align: center;
  background: rgb(8 12 18 / .72);
  color: #fff;
}
.cl-maint b, .cl-hide b { font-size: 14px; }
.cl-maint small, .cl-hide small { display: block; margin-top: 4px; color: #cbd5e1; font-size: 10px; }
.cl-meta { padding: 8px 2px 0; }
.cl-meta strong {
  display: block;
  color: #e2e8f0;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}
.cl-tools {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}
.cl-tool {
  height: 24px;
  padding: 0 6px;
  border: 1px solid #243044;
  border-radius: 8px;
  background: #151c27;
  color: #9fb0c3;
  font-size: 10px;
  font-weight: 700;
}
.cl-tool svg { width: 12px; height: 12px; }
.cl-tool.is-up svg { transform: rotate(-90deg); }
.cl-tool.is-down svg { transform: rotate(90deg); }
.cl-tool.is-on { border-color: #f59e0b; color: #fbbf24; background: rgb(245 158 11 / .12); }
.cl-tool.is-warn { border-color: #fb7185; color: #fb7185; background: rgb(251 113 133 / .12); }
.cl-tool.is-off { border-color: #64748b; color: #cbd5e1; }
.cl-tool:disabled { opacity: .35; }
.cl-grid.is-preview .cl-tools { display: none; }
.cl-grid.is-order .cl-card { cursor: grab; }
.cl-grid.is-hot .cl-tool:not([data-cl="hot"]) { opacity: .4; }
.cl-grid.is-maint .cl-tool:not([data-cl="maint"]) { opacity: .4; }
.cl-hint { margin: 12px 2px 0; color: #7d8ea3; font-size: 12px; }
.cl-card.is-hidden { opacity: .55; }
@media (max-width: 1280px) {
  .cl-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
  .cl-stage-head { flex-direction: column; align-items: stretch; }
}
@media (max-width: 860px) {
  .cl-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

.sl-tabs.attb-tabs {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 16px;
}
.sl-tabs.attb-tabs button {
  min-height: 40px;
  padding: 8px 18px;
}
.sl-stage { overflow: hidden; }
.sl-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 4px 0 12px;
}
.sl-toolbar strong {
  color: #e8eef8;
  font-size: 14px;
}
.sl-toolbar b { color: #7dd3fc; font-weight: 800; }
.sl-search { min-width: 220px; }
.sl-search .input {
  height: 34px;
  padding: 0 12px;
  border-radius: 10px;
}
.sl-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}
.sl-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 10px;
  border: 1px solid #243044;
  border-radius: 10px;
  background: #141b24;
  color: #d5e0ee;
  font-size: 11px;
  font-weight: 700;
}
.sl-chip img {
  height: 14px;
  width: auto;
  max-width: 64px;
  object-fit: contain;
  filter: brightness(1.1);
}
.sl-chip.is-all { font-size: 12px; }
.sl-chip.is-on {
  border-color: #38bdf8;
  background: #172433;
  box-shadow: inset 0 0 0 1px rgb(56 189 248 / .28);
}
.sl-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 12px;
}
.sl-card {
  min-width: 0;
  padding: 8px 8px 10px;
  border-radius: 14px;
  background: #121820;
  border: 1px solid #1c2532;
}
.sl-card.is-dragging { opacity: .45; }
.sl-card.is-drop { outline: 2px solid #38bdf8; }
.sl-card.is-hidden { opacity: .5; }
.sl-art {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.sl-art img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid rgb(56 189 248 / .35);
  box-shadow: 0 0 0 1px rgb(14 165 233 / .12);
}
.sl-hot {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  display: grid;
  place-items: center;
  min-width: 32px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: linear-gradient(180deg, #fbbf24, #d97706);
  color: #1a1205;
  font-size: 9px;
  font-weight: 900;
  font-style: normal;
  letter-spacing: .08em;
  box-shadow: 0 4px 10px rgb(245 158 11 / .45);
}
.sl-order {
  position: absolute;
  left: 8px;
  bottom: 8px;
  z-index: 2;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgb(15 23 42 / .82);
  color: #e0f2fe;
  font-size: 11px;
  font-weight: 800;
  font-style: normal;
}
.sl-mask {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-content: center;
  text-align: center;
  border-radius: 10px;
  background: rgb(8 12 18 / .72);
  color: #fff;
}
.sl-mask b { font-size: 13px; }
.sl-mask small { display: block; margin-top: 4px; color: #cbd5e1; font-size: 10px; }
.sl-card > strong {
  display: block;
  margin-top: 8px;
  color: #e8eef8;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  word-break: keep-all;
}
.sl-tools {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 3px;
  margin-top: 7px;
}
.sl-tool {
  height: 22px;
  padding: 0 6px;
  border: 1px solid #243044;
  border-radius: 7px;
  background: #151c27;
  color: #9fb0c3;
  font-size: 10px;
  font-weight: 700;
}
.sl-tool svg { width: 11px; height: 11px; }
.sl-tool.is-up svg { transform: rotate(-90deg); }
.sl-tool.is-down svg { transform: rotate(90deg); }
.sl-tool.is-on { border-color: #f59e0b; color: #fbbf24; background: rgb(245 158 11 / .12); }
.sl-tool.is-warn { border-color: #fb7185; color: #fb7185; background: rgb(251 113 133 / .12); }
.sl-tool.is-off { border-color: #64748b; color: #cbd5e1; }
.sl-tool:disabled { opacity: .35; }
.sl-grid.is-preview .sl-tools { display: none; }
.sl-grid.is-order .sl-card { cursor: grab; }
.sl-grid.is-hot .sl-tool:not([data-sl="hot"]) { opacity: .4; }
.sl-grid.is-maint .sl-tool:not([data-sl="maint"]) { opacity: .4; }
.sl-empty { grid-column: 1 / -1; color: #7d8ea3; font-size: 13px; }
.sl-lobby {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 16px;
  min-height: 560px;
  margin-top: 6px;
}
.sl-side {
  padding: 12px;
  border: 1px solid #223042;
  border-radius: 14px;
  background: #10161f;
}
.sl-side h3 {
  display: flex;
  justify-content: space-between;
  margin: 0 0 10px;
  color: #dbe7f4;
  font-size: 13px;
}
.sl-side h3 b { color: #7dd3fc; }
.sl-side-all,
.sl-prov {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 34px;
  padding: 0 8px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #c5d3e2;
  font-size: 12px;
  text-align: left;
}
.sl-side-all { margin-bottom: 6px; font-weight: 800; }
.sl-prov i {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #334155;
}
.sl-prov svg { width: 12px; height: 12px; margin-left: auto; }
.sl-side-all.is-on,
.sl-prov.is-on {
  background: #1a2736;
  color: #f8fafc;
}
.sl-prov.is-on i { background: #38bdf8; }
.sl-side nav {
  display: grid;
  gap: 2px;
  max-height: 520px;
  overflow: auto;
}
.sl-main-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.sl-main-head h3 { margin: 0; font-size: 16px; }
.sl-main-head b { color: #93c5fd; font-size: 13px; }
.sl-sort .select {
  min-width: 120px;
  height: 34px;
  border-radius: 10px;
}
.sl-games {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  gap: 12px;
}
.sl-game {
  min-width: 0;
  color: #e8eef8;
}
.sl-game.is-dragging { opacity: .45; }
.sl-game.is-drop figure { outline: 2px solid #38bdf8; }
.sl-game.is-drag { cursor: grab; }
.sl-game figure {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 10px;
  background: #0b1118;
}
.sl-game img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}
.sl-rank,
.sl-game time {
  position: absolute;
  top: 6px;
  left: 6px;
  z-index: 1;
  padding: 2px 6px;
  border-radius: 6px;
  background: rgb(5 9 15 / .76);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  font-style: normal;
}
.sl-game strong,
.sl-game small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sl-game strong { margin-top: 7px; font-size: 12px; }
.sl-game small { margin-top: 2px; color: #8ea0b5; font-size: 10px; }
.sl-game label {
  display: grid;
  gap: 4px;
  margin-top: 6px;
  color: #93a4b8;
  font-size: 10px;
  font-weight: 700;
}
.sl-game .input {
  height: 28px;
  padding: 0 8px;
  font-size: 11px;
}
@media (max-width: 1400px) {
  .sl-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
  .sl-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sl-lobby { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .sl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sl-toolbar { flex-direction: column; align-items: stretch; }
}

.form-span-2 { grid-column: 1 / -1; }
.tm-tabs.attb-tabs {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 16px;
}
.tm-tabs.attb-tabs button {
  min-height: 40px;
  padding: 8px 18px;
}
.tm-work {
  display: grid;
  grid-template-columns: minmax(360px, .98fr) minmax(520px, 1.12fr);
  gap: 16px;
  align-items: start;
}
.tm-editor { display: grid; gap: 12px; }
.tm-list {
  display: grid;
  gap: 8px;
  max-height: 280px;
  overflow: auto;
}
.tm-list-item {
  display: grid;
  gap: 4px;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
  color: inherit;
  text-align: left;
}
.tm-list-item strong { font-size: 13px; }
.tm-list-item small { color: var(--muted); font-size: 11px; }
.tm-list-item.active {
  border-color: #3b82f6;
  background: rgb(59 130 246 / .12);
  box-shadow: inset 3px 0 0 #3b82f6;
}
.tm-status {
  display: inline-flex;
  width: max-content;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
}
.tm-status.is-live { color: #86efac; background: rgb(34 197 94 / .16); }
.tm-status.is-upcoming { color: #93c5fd; background: rgb(59 130 246 / .16); }
.tm-status.is-ended { color: #cbd5e1; background: rgb(148 163 184 / .16); }
.tm-mini-tabs,
.tm-preview-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin: 0 0 14px;
}
.tm-preview-tabs { grid-template-columns: repeat(4, 1fr); }
.tm-mini-tabs button,
.tm-preview-tabs button {
  min-height: 36px;
  border: 0;
  border-radius: 8px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.tm-mini-tabs button.active,
.tm-preview-tabs button.active {
  background: var(--bg);
  color: var(--text);
  box-shadow: var(--shadow);
}
.tm-rows,
.tm-benefits-edit { display: grid; gap: 8px; margin-bottom: 12px; }
.tm-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) minmax(0, .7fr) 36px;
  gap: 8px;
  align-items: center;
}
.tm-benefits-edit .tm-row { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.tm-row em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  text-align: center;
}
.tm-rule {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.tm-rule textarea {
  height: auto;
  min-height: 120px;
  padding: 10px 12px;
  line-height: 1.55;
  resize: vertical;
}
.tm-rule-head { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 8px; align-items: center; }
.tm-rule-head em {
  display: grid;
  place-items: center;
  height: 28px;
  border-radius: 8px;
  background: #1d4ed8;
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}
.tm-prize-table { overflow: auto; margin: 8px 0 12px; }
.tm-prize-table table { width: 100%; }
.tm-rank {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #1e293b;
  font-size: 11px;
}
.tm-rank.is-1 { background: #eab308; color: #111; }
.tm-rank.is-2 { background: #94a3b8; color: #111; }
.tm-rank.is-3 { background: #b45309; color: #fff; }
.tm-preview {
  overflow: auto;
  max-height: calc(100vh - 240px);
  border: 1px solid #1c2a3c;
  border-radius: 18px;
  padding: 16px;
  background: #0b1220;
}
.tm-phone { display: grid; gap: 12px; color: #d7e3f0; }
.tm-phone.is-off { opacity: .55; }
.tm-off {
  border: 1px dashed #3b4b60;
  border-radius: 12px;
  padding: 8px 12px;
  color: #f2c14e;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  background: rgb(242 193 78 / .08);
}
.tm-hub-head small,
.tm-detail-head small {
  color: #7dd3fc;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .16em;
}
.tm-hub-head h3,
.tm-detail-head h3 { margin: 4px 0; font-size: 22px; letter-spacing: -.03em; }
.tm-hub-head p,
.tm-detail-head p { margin: 0; color: #93a4bb; font-size: 12px; }
.tm-hub-filters {
  display: flex;
  gap: 6px;
}
.tm-hub-filters span {
  padding: 6px 10px;
  border-radius: 8px;
  background: #152033;
  color: #7f93a8;
  font-size: 11px;
  font-weight: 700;
}
.tm-hub-filters .is-on { background: #1d4ed8; color: #fff; }
.tm-featured {
  display: grid;
  gap: 6px;
  padding: 18px;
  border-radius: 16px;
  background:
    linear-gradient(90deg, rgb(29 78 216 / .28), rgb(8 17 32 / .2)),
    #101a2c;
}
.tm-featured em,
.tm-hub-grid em {
  width: max-content;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgb(34 197 94 / .18);
  color: #86efac;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}
.tm-featured h4 { margin: 4px 0; font-size: 18px; }
.tm-featured strong,
.tm-hub-grid b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #f3c35a;
}
.tm-featured strong svg,
.tm-hub-grid b svg,
.tm-cup svg { width: 16px; height: 16px; }
.tm-featured b {
  width: max-content;
  margin-top: 6px;
  padding: 8px 12px;
  border-radius: 10px;
  background: #2563eb;
  color: #fff;
  font-size: 12px;
}
.tm-hub-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
}
.tm-hub-grid article {
  display: grid;
  gap: 4px;
  min-height: 118px;
  padding: 12px;
  border-radius: 14px;
  background: #121c2c;
}
.tm-hub-grid h5 { margin: 0; font-size: 12px; line-height: 1.35; }
.tm-hub-grid .is-upcoming em { background: rgb(59 130 246 / .18); color: #93c5fd; }
.tm-hub-grid .is-ended em { background: rgb(148 163 184 / .16); color: #cbd5e1; }
.tm-detail-head {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 12px;
  padding: 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, #14315c, #0f1a2c);
}
.tm-cup {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: rgb(234 179 8 / .16);
  color: #f3c35a;
}
.tm-detail-head em {
  margin-left: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-style: normal;
}
.tm-detail-head em.is-live { background: rgb(34 197 94 / .18); color: #86efac; }
.tm-detail-head em.is-upcoming { background: rgb(59 130 246 / .18); color: #93c5fd; }
.tm-detail-head em.is-ended { background: rgb(148 163 184 / .16); color: #cbd5e1; }
.tm-detail-head dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  grid-column: 1 / -1;
  margin: 8px 0 0;
}
.tm-detail-head dt { color: #7f93a8; font-size: 10px; }
.tm-detail-head dd { margin: 2px 0 0; font-size: 13px; font-weight: 800; }
.tm-detail-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
  border-radius: 10px;
  background: #152033;
}
.tm-detail-tabs span {
  padding: 10px;
  color: #7f93a8;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}
.tm-detail-tabs .is-on { background: #1e3a5f; color: #fff; }
.tm-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 10px;
}
.tm-meta small { display: block; color: #7f93a8; font-size: 10px; }
.tm-game-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.tm-game-grid button {
  display: grid;
  gap: 2px;
  min-height: 72px;
  padding: 10px 8px;
  border: 0;
  border-radius: 12px;
  background: #152033;
  color: #e8eef6;
  text-align: left;
}
.tm-game-grid small { color: #7f93a8; }
.tm-prev-rules { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.tm-prev-rules li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; }
.tm-prev-rules b {
  display: grid;
  place-items: center;
  height: 28px;
  border-radius: 8px;
  background: #1d4ed8;
  color: #fff;
  font-size: 11px;
}
.tm-prev-rules h4 { margin: 0 0 4px; font-size: 13px; }
.tm-prev-rules ul { margin: 0; padding-left: 16px; color: #93a4bb; font-size: 11px; }
.tm-podium {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}
.tm-podium article {
  display: grid;
  gap: 4px;
  padding: 12px 8px;
  border-radius: 14px;
  background: #152033;
  text-align: center;
}
.tm-podium .is-0 { background: linear-gradient(180deg, #3b2f12, #1b2433); }
.tm-podium .is-1 { background: linear-gradient(180deg, #2a3340, #1b2433); }
.tm-podium .is-2 { background: linear-gradient(180deg, #3a2718, #1b2433); }
.tm-podium em { color: #7dd3fc; font-size: 18px; font-style: normal; font-weight: 800; }
.tm-prev-rewards table { width: 100%; font-size: 11px; }
.tm-prev-rewards th,
.tm-prev-rewards td { padding: 6px 8px; text-align: left; }
.tm-board {
  display: grid;
  gap: 6px;
  padding: 12px;
  border-radius: 16px;
  background: #101a2b;
}
.tm-board nav { display: grid; grid-template-columns: 1fr 1fr; }
.tm-board nav span {
  padding: 7px;
  color: #7f93a8;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}
.tm-board nav .is-on { color: #fff; border-bottom: 2px solid #3b82f6; }
.tm-board p { margin: 0; color: #4ade80; font-size: 10px; }
.tm-board-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  font-size: 11px;
}
.tm-board-row em { font-style: normal; color: #7f93a8; }
.tm-board-row.is-1 em,
.tm-board-row.is-2 em,
.tm-board-row.is-3 em { color: #f3c35a; font-weight: 800; }
@media (max-width: 1180px) {
  .tm-work { grid-template-columns: 1fr; }
  .tm-hub-grid,
  .tm-game-grid { grid-template-columns: 1fr 1fr; }
}

.pm-tabs.attb-tabs {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 16px;
}
.pm-tabs.attb-tabs button {
  min-height: 44px;
  padding: 10px 18px;
}
.pm-page .pm-editor > .card,
.pm-page .pm-preview-card {
  padding: 18px 20px 20px;
}
.pm-work {
  display: grid;
  grid-template-columns: minmax(360px, .92fr) minmax(520px, 1.18fr);
  gap: 16px;
  align-items: start;
}
.pm-editor { display: grid; gap: 12px; }
.pm-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pm-cat {
  min-height: 34px;
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.pm-cat.is-on {
  border-color: #22c55e;
  background: rgb(34 197 94 / .14);
  color: #86efac;
}
.pm-chip-edit {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}
.pm-chip-edit label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.pm-news-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1.2fr) minmax(0, .9fr);
  gap: 8px;
  margin-bottom: 8px;
}
.pm-list {
  display: grid;
  gap: 8px;
  max-height: 320px;
  overflow: auto;
}
.pm-list-item {
  display: grid;
  gap: 4px;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
  color: inherit;
  text-align: left;
}
.pm-list-item strong { font-size: 13px; }
.pm-list-item small { color: var(--muted); font-size: 11px; }
.pm-list-item.active {
  border-color: #22c55e;
  background: rgb(34 197 94 / .1);
  box-shadow: inset 3px 0 0 #22c55e;
}
.pm-status {
  display: inline-flex;
  width: max-content;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
}
.pm-status.is-open { color: #86efac; background: rgb(34 197 94 / .16); }
.pm-status.is-closed { color: #93c5fd; background: rgb(59 130 246 / .16); }
.pm-preview-card {
  padding: 16px 18px 18px;
}
.pm-preview-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 0 0 12px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
}
.pm-preview-tabs button {
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.pm-preview-tabs button.active {
  background: var(--bg);
  color: var(--text);
  box-shadow: var(--shadow);
}
.pm-preview {
  overflow: auto;
  max-height: calc(100vh - 220px);
  border: 1px solid #1c2a3c;
  border-radius: 18px;
  padding: 16px;
  background: #0b1220;
}
.pm-phone { display: grid; gap: 12px; color: #d7e3f0; }
.pm-phone.is-off { opacity: .55; }
.pm-off {
  margin: 0;
  padding: 10px 12px;
  border: 1px dashed #3b4b60;
  border-radius: 12px;
  color: #f2c14e;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  background: rgb(242 193 78 / .08);
}
.pm-hub-head h3 {
  margin: 0 0 8px;
  font-size: 18px;
  letter-spacing: -.03em;
}
.pm-hub-head em {
  margin-left: 8px;
  color: #f87171;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}
.pm-tools { display: flex; gap: 6px; }
.pm-tools span {
  padding: 5px 10px;
  border-radius: 8px;
  background: #152033;
  color: #93a4bb;
  font-size: 11px;
  font-weight: 700;
}
.pm-hub {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(240px, .8fr);
  gap: 12px;
  min-width: 0;
}
.pm-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.pm-card {
  display: grid;
  gap: 6px;
  min-height: 118px;
  padding: 12px;
  border-radius: 14px;
  background: #121c2c;
}
.pm-card header { display: grid; gap: 3px; }
.pm-card small { color: #7f93a8; font-size: 10px; }
.pm-card strong { font-size: 12px; line-height: 1.35; }
.pm-out,
.pm-bar {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 36px;
  gap: 6px;
  align-items: center;
  font-size: 11px;
}
.pm-out b,
.pm-bar b {
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(90deg, #34d399, #6ee7b7);
}
.pm-out em,
.pm-bar em {
  color: #cbd5e1;
  font-style: normal;
  font-weight: 800;
  text-align: right;
}
.pm-card footer {
  display: flex;
  justify-content: space-between;
  color: #7f93a8;
  font-size: 10px;
}
.pm-hub aside {
  display: grid;
  gap: 10px;
  align-content: start;
}
.pm-hub aside section,
.pm-guide,
.pm-related,
.pm-detail {
  padding: 12px;
  border-radius: 14px;
  background: #101a2b;
}
.pm-hub aside header,
.pm-related h4 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 8px;
}
.pm-hub aside h4 { margin: 0; font-size: 12px; }
.pm-hub aside b { color: #93c5fd; font-size: 10px; }
.pm-hub aside p { margin: 0 0 8px; color: #7f93a8; font-size: 10px; }
.pm-hub ol,
.pm-hub ul { margin: 0; padding: 0; list-style: none; }
.pm-hub .pm-rank li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
  padding: 6px 0;
  border-top: 1px solid #1c2a3c;
  font-size: 11px;
}
.pm-hub .pm-rank span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pm-hub li em { color: #93c5fd; font-style: normal; font-weight: 800; }
.pm-hub li b { color: #86efac; }
.pm-news li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 8px 0;
  border-top: 1px solid #1c2a3c;
}
.pm-news strong {
  min-width: 0;
  color: #e8eef6;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.pm-news small {
  padding-top: 1px;
  color: #7f93a8;
  font-size: 11px;
  white-space: nowrap;
}
.pm-guide strong { display: block; margin-bottom: 4px; }
.pm-guide p { margin: 0 0 8px; color: #93a4bb; font-size: 11px; }
.pm-guide span { color: #93c5fd; font-size: 11px; font-weight: 700; }
.pm-phone.is-detail {
  grid-template-columns: minmax(0, 1.5fr) minmax(180px, .7fr);
  align-items: start;
}
.pm-detail small { color: #7f93a8; font-size: 11px; }
.pm-detail h3 { margin: 6px 0 8px; font-size: 20px; letter-spacing: -.03em; }
.pm-detail p {
  display: flex;
  gap: 12px;
  margin: 0 0 12px;
  color: #7f93a8;
  font-size: 11px;
}
.pm-bar { grid-template-columns: 48px minmax(0, 1fr) 40px; margin-bottom: 8px; }
.pm-bar b { height: 10px; background: #1d4ed8; }
.pm-chips {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  margin: 14px 0 10px;
}
.pm-chips span {
  display: grid;
  place-items: center;
  min-height: 32px;
  border-radius: 8px;
  background: #152033;
  color: #cbd5e1;
  font-size: 10px;
  font-weight: 800;
}
.pm-chips .is-reset { background: #3b2f16; color: #e8c37a; }
.pm-chips .is-max { background: #166534; color: #bbf7d0; }
.pm-detail label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #0b1220;
  font-size: 12px;
}
.pm-detail button {
  width: 100%;
  min-height: 40px;
  border: 0;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 800;
}
.pm-detail button.is-closed { background: #334155; color: #cbd5e1; }
.pm-detail button.is-go { background: #2563eb; color: #fff; }
.pm-related h4 { font-size: 13px; }
.pm-related p { display: grid; gap: 2px; margin: 0; padding: 8px 0; border-top: 1px solid #1c2a3c; }
.pm-related small { color: #7f93a8; font-size: 10px; }
.su-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.su-kpi {
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.su-kpi span {
  display: block;
  color: var(--muted);
  font-size: 11px;
}
.su-kpi strong {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.su-kpi.is-ok strong { color: var(--success); }
.su-kpi.is-wait strong { color: var(--warning); }
.su-kpi.is-off strong { color: var(--danger); }
.su-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}
.su-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  padding: 14px 14px 10px;
}
.su-card .su-row { flex: 1 1 auto; }
.su-card-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.su-card-head h3 { margin: 0; font-size: 14px; letter-spacing: -.02em; }
.su-card-head p {
  margin: 3px 0 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.su-card-head > div { min-width: 0; flex: 1; }
.su-ico {
  display: grid;
  flex: 0 0 28px;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  color: var(--primary);
  background: var(--primary-soft);
}
.su-ico svg { width: 14px; height: 14px; }
.su-legend {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 46%;
  margin-left: auto;
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.su-legend i {
  display: grid;
  flex: 0 0 14px;
  place-items: center;
  width: 14px;
  height: 14px;
  border-radius: 4px;
  color: var(--primary);
  background: var(--primary-soft);
  font-style: normal;
  font-size: 9px;
}
.su-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 38px;
  padding: 4px 0;
}
.su-row > span {
  flex: 0 0 96px;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -.02em;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.su-segs {
  display: grid;
  grid-template-columns: repeat(var(--su-n, 2), minmax(0, 1fr));
  flex: 1 1 auto;
  align-items: stretch;
  width: 100%;
  min-width: 0;
  height: 32px;
  padding: 3px;
  gap: 2px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-3);
  box-shadow: inset 0 1px 1px rgb(0 0 0 / .08);
}
.su-chip {
  display: grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  height: auto;
  padding: 0 4px;
  overflow: hidden;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -.03em;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.su-chip:hover {
  color: var(--text);
  background: color-mix(in srgb, var(--surface) 42%, transparent);
}
.su-chip.is-on {
  background: var(--surface);
  color: var(--text);
  font-weight: 750;
  box-shadow: 0 1px 2px rgb(0 0 0 / .16), 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent);
}
.su-chip.is-on:hover { color: var(--text); }
.ut-page .su-kpis,
.va-page .su-kpis {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 10px;
}
.ut-quotes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  margin: 0 0 12px;
}
.ut-quote {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 100%;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  color: inherit;
  text-align: left;
  cursor: default;
}
button.ut-quote { cursor: pointer; }
.ut-quote.is-on {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--line));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent);
}
.ut-quote-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}
.ut-quote .io-quote-brand { min-width: 0; flex: 1 1 auto; }
.ut-quote .io-quote-mark {
  width: 18px;
  height: 18px;
  color: #fff;
  font-size: 10px;
}
.ut-quote .io-quote-brand > span:not(.io-quote-mark) {
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  text-overflow: ellipsis;
}
.ut-quote .io-quote-live {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 10px;
}
.ut-quote strong {
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  font-weight: 750;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ut-quote.is-wait strong { color: var(--muted); font-weight: 650; }
.ut-field .input[readonly] { color: var(--text); }
.ut-page .su-grid,
.va-page .su-grid { align-items: start; }
.ut-page .su-card,
.va-page .su-card { height: auto; }
.ut-page .su-card-head,
.va-page .su-card-head { margin-bottom: 6px; padding-bottom: 8px; }
.ut-page .su-card .su-row,
.va-page .su-card .su-row {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 1px 0;
  gap: 10px;
}
.ut-page .su-row > span,
.va-page .su-row > span { flex-basis: 96px; }
.ut-page .su-segs,
.va-page .su-segs { height: 30px; }
.ut-field {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  height: 30px;
  padding: 2px 8px 2px 2px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-3);
  box-shadow: inset 0 1px 1px rgb(0 0 0 / .08);
}
.ut-field .input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  height: 100%;
  padding: 0 8px;
  border: 0;
  border-radius: 7px;
  background: var(--surface);
  text-align: right;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.ut-field i {
  flex: 0 0 auto;
  color: var(--muted);
  font-style: normal;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: -.02em;
  white-space: nowrap;
}
.ut-field.is-addr { padding-right: 2px; }
.ut-field.is-addr .input {
  text-align: left;
  font-size: 11px;
  font-weight: 650;
}
.ut-split {
  margin: 4px 0 0;
  padding: 6px 0 2px;
  border-top: 1px dashed var(--line);
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: -.02em;
}
.va-note {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
  padding-top: 6px;
}
.va-note > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -.02em;
}
.va-note .input {
  width: 100%;
  min-height: 86px;
  padding: 8px 10px;
  resize: vertical;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
  letter-spacing: -.02em;
  white-space: pre-wrap;
}
@media (max-width: 1280px) {
  .su-grid { grid-template-columns: 1fr; }
  .su-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ut-page .su-kpis,
  .va-page .su-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ut-quotes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.gr-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}
.gr-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 16px 16px 14px;
}
.gr-card-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.gr-card-head h3 { margin: 0; font-size: 14px; letter-spacing: -.02em; }
.gr-card-head p {
  margin: 3px 0 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gr-card-head > div { min-width: 0; flex: 1; }
.gr-ico {
  display: grid;
  flex: 0 0 28px;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  color: var(--primary);
  background: var(--primary-soft);
}
.gr-ico svg { width: 14px; height: 14px; }
.gr-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 10px;
}
.gr-field > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.gr-name { height: 38px; }
.gr-drop {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 108px;
  margin-bottom: 10px;
  padding: 16px 12px;
  border: 1px dashed color-mix(in srgb, var(--primary) 35%, var(--line-strong));
  border-radius: 12px;
  background: color-mix(in srgb, var(--primary-soft) 70%, transparent);
  text-align: center;
}
.gr-drop small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}
.gr-meta {
  margin: 0 0 12px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gr-meta b { color: var(--text); font-weight: 700; }
.gr-apply { width: max-content; margin-top: auto; }
.bk-board { overflow: hidden; padding: 0; }
.bk-board-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--line);
}
.bk-board-head h2 { margin: 0; font-size: 14px; font-weight: 700; letter-spacing: -.02em; }
.bk-board-head p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.bk-count {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.bk-composer {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--primary-soft) 55%, transparent);
}
.bk-composer .input { height: 36px; max-width: 280px; }
.bk-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 240px;
}
.bk-col {
  margin: 0;
  padding: 8px;
  list-style: none;
}
.bk-col + .bk-col { border-left: 1px solid var(--line); }
.bk-empty-wrap {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  min-height: 220px;
  color: var(--muted);
  font-size: 13px;
}
.bk-row {
  display: grid;
  grid-template-columns: 18px 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 6px 10px;
  border-radius: 8px;
  cursor: grab;
}
.bk-row:hover { background: color-mix(in srgb, var(--primary-soft) 70%, transparent); }
.bk-row.is-dragging {
  opacity: .42;
  cursor: grabbing;
  background: var(--primary-soft);
}
.bk-row.is-drop {
  background: var(--primary-soft);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 55%, transparent);
}
.bk-grip {
  display: grid;
  place-items: center;
  color: var(--muted);
}
.bk-grip svg { width: 12px; height: 12px; }
.bk-no {
  color: var(--muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: .02em;
}
.bk-name {
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bk-del {
  min-height: 26px;
  padding: 4px 10px;
  border-color: transparent;
  background: transparent;
  color: var(--danger);
  font-size: 12px;
  font-weight: 650;
}
.bk-del:hover {
  border-color: transparent;
  background: var(--danger-soft);
  color: var(--danger);
}
@media (max-width: 900px) {
  .bk-cols { grid-template-columns: 1fr; }
  .bk-col + .bk-col { border-left: 0; border-top: 1px solid var(--line); }
}
@media (max-width: 1280px) {
  .gr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .su-grid { grid-template-columns: 1fr; }
  .su-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .gr-grid { grid-template-columns: 1fr; }
  .su-kpis { grid-template-columns: 1fr; }
  .ut-page .su-kpis,
  .va-page .su-kpis,
  .ut-quotes { grid-template-columns: 1fr; }
}

@media (max-width: 1180px) {
  .pm-work,
  .pm-phone.is-detail,
  .pm-hub { grid-template-columns: 1fr; }
  .pm-grid,
  .pm-chip-edit { grid-template-columns: 1fr 1fr; }
  .pm-news-row { grid-template-columns: 1fr; }
}

.mg-page { display: grid; gap: 12px; }
.mg-kpis { margin-bottom: 0; }
.mg-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.mg-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
}
.mg-filters button {
  min-height: 34px;
  padding: 6px 14px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.mg-filters button.is-on {
  background: var(--bg);
  color: var(--text);
  box-shadow: var(--shadow);
}
.mg-search {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: min(420px, 100%);
  position: relative;
}
.mg-search .nav-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--muted);
  pointer-events: none;
}
.mg-search .input { padding-left: 36px; min-width: 220px; flex: 1; }
.mg-work {
  display: grid;
  grid-template-columns: minmax(320px, .9fr) minmax(480px, 1.2fr);
  gap: 16px;
  align-items: start;
}
.mg-side { display: grid; gap: 12px; }
.mg-list-card { padding: 16px 16px 12px; }
.mg-list { display: grid; gap: 6px; }
.mg-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.mg-row.is-on {
  border-color: rgb(56 189 248 / .55);
  background: rgb(14 165 233 / .12);
}
.mg-mark {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  color: #fff;
  font-size: 15px;
  font-weight: 800;
}
.mg-mark.is-lotto { background: linear-gradient(160deg, #f59e0b, #b45309); }
.mg-mark.is-hash { background: linear-gradient(160deg, #8b5cf6, #5b21b6); }
.mg-mark.is-coin { background: linear-gradient(160deg, #14b8a6, #0f766e); }
.mg-row-body { display: grid; gap: 2px; min-width: 0; }
.mg-row-body strong { font-size: 13px; font-weight: 800; letter-spacing: -.02em; }
.mg-row-body small { color: var(--muted); font-size: 11px; }
.mg-row-meta { display: grid; justify-items: end; gap: 4px; }
.mg-row-meta em { color: var(--muted); font-size: 11px; font-style: normal; font-variant-numeric: tabular-nums; }
.mg-status {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}
.mg-status.is-on { color: #86efac; background: rgb(34 197 94 / .16); }
.mg-status.is-maint { color: #fbbf24; background: rgb(245 158 11 / .16); }
.mg-status.is-off { color: #fda4af; background: rgb(244 63 94 / .16); }
.mg-detail { padding: 18px 20px 20px; }
.mg-detail-kicker { margin: 0 0 4px; color: var(--muted); font-size: 11px; font-weight: 700; }
.mg-sub { margin: 16px 0 8px; font-size: 13px; font-weight: 800; }
.mg-sub-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 16px 0 8px;
}
.mg-sub-row .mg-sub { margin: 0; }
.mg-form { margin-top: 12px; }
.mg-markets {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.mg-market {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 88px auto;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-2);
  color: var(--muted);
}
.mg-market.is-on { color: var(--text); background: var(--bg); }
.mg-market span { font-size: 12px; font-weight: 700; }
.mg-market-name { min-width: 0; }
.mg-market-del { min-height: 32px; padding: 0 10px; }
.mg-common { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 16px; align-items: start; }
.mg-preview {
  overflow: hidden;
  border: 1px solid #1c2a3c;
  border-radius: 18px;
  padding: 16px;
  background: #0b1220;
}
.mg-phone { display: grid; gap: 12px; color: #d7e3f0; }
.mg-phone.is-off { opacity: .7; }
.mg-phone-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.mg-phone-head small { color: #93a4bb; font-size: 11px; font-weight: 700; }
.mg-phone-head h3 { margin: 2px 0 0; font-size: 18px; letter-spacing: -.03em; }
.mg-phone-head em { margin-left: 8px; color: #f87171; font-size: 11px; font-style: normal; font-weight: 800; }
.mg-round {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(180deg, #152033, #101828);
  border: 1px solid #24344a;
}
.mg-round span { display: block; color: #93a4bb; font-size: 11px; font-weight: 700; }
.mg-round strong { display: block; margin-top: 2px; font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; }
.mg-round p { margin: 0; color: #fbbf24; font-size: 12px; font-weight: 800; white-space: nowrap; }
.mg-phone-markets { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mg-phone-markets button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid #2a3c54;
  border-radius: 12px;
  background: #132033;
  color: #e2e8f0;
  font-size: 12px;
  font-weight: 700;
}
.mg-phone-markets b { color: #7dd3fc; font-variant-numeric: tabular-nums; }
.mg-phone-foot { display: flex; justify-content: space-between; color: #93a4bb; font-size: 11px; font-weight: 700; }
.mg-empty { margin: 12px 0; color: var(--muted); font-size: 12px; }
@media (max-width: 1180px) {
  .mg-work,
  .mg-common,
  .mg-markets,
  .mg-phone-markets { grid-template-columns: 1fr; }
}

.vg-page { display: grid; gap: 12px; }
.vg-page .mg-list-card { padding: 18px 20px 16px; }
.vg-page .mg-detail,
.vg-page .pm-preview-card,
.vg-page .mg-common > .card { padding: 18px 20px 20px; }
.vg-mark {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  color: #fff;
  font-size: 15px;
  font-weight: 800;
}
.vg-mark.is-ball { background: linear-gradient(160deg, #22c55e, #15803d); }
.vg-mark.is-race { background: linear-gradient(160deg, #f59e0b, #b45309); }
.vg-order { display: flex; gap: 8px; margin-top: 14px; }
.vg-preview {
  overflow: hidden;
  border: 1px solid #1c2a3c;
  border-radius: 18px;
  padding: 16px;
  background: #0b1220;
}
.vg-phone { display: grid; gap: 12px; color: #d7e3f0; }
.vg-phone.is-off { opacity: .7; }
.vg-phone-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.vg-phone-head small { color: #93a4bb; font-size: 11px; font-weight: 700; }
.vg-phone-head h3 { margin: 2px 0 0; font-size: 18px; letter-spacing: -.03em; }
.vg-phone-head em { margin-left: 8px; color: #f87171; font-size: 11px; font-style: normal; font-weight: 800; }
.vg-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.vg-tile {
  display: grid;
  justify-items: start;
  gap: 4px;
  min-height: 88px;
  padding: 12px;
  border: 1px solid #2a3c54;
  border-radius: 14px;
  background: #132033;
  color: #e2e8f0;
  text-align: left;
}
.vg-tile.is-on { border-color: #22c55e; background: rgb(34 197 94 / .12); }
.vg-tile span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #1f3d2b;
  font-size: 12px;
  font-weight: 800;
}
.vg-tile.is-race span { background: #3d2e12; }
.vg-tile strong { font-size: 13px; font-weight: 800; }
.vg-tile small { color: #93a4bb; font-size: 11px; }
.vg-phone-markets { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.vg-phone-markets button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid #2a3c54;
  border-radius: 12px;
  background: #132033;
  color: #e2e8f0;
  font-size: 12px;
  font-weight: 700;
}
.vg-phone-markets b { color: #7dd3fc; font-variant-numeric: tabular-nums; }
.vg-phone-foot { display: flex; justify-content: space-between; color: #93a4bb; font-size: 11px; font-weight: 700; }
@media (max-width: 1180px) {
  .vg-tiles,
  .vg-phone-markets { grid-template-columns: 1fr; }
}

.aim-page { display: grid; gap: 10px; }
.aim-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}
.aim-kpi {
  display: grid;
  gap: 4px;
  min-height: 64px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--muted);
  background: var(--surface);
  text-align: left;
  cursor: pointer;
}
.aim-kpi span { font-size: 11px; font-weight: 600; }
.aim-kpi strong {
  color: var(--text);
  font-size: 20px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
}
.aim-kpi.is-on {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--line));
  background: color-mix(in srgb, var(--primary-soft) 80%, var(--surface));
}
.aim-kpi.lock strong { color: #f59e0b; }
.aim-kpi.live strong { color: #34d399; }
.aim-kpi.warn strong { color: #fbbf24; }
.aim-kpi.ok strong { color: #67e8f9; }
.aim-filter {
  flex-wrap: wrap;
  border-radius: 12px;
  padding: 10px 12px;
}
.aim-filter .period-shortcuts { flex: 0 0 auto; }
.aim-filter .users-date-range { flex: 0 1 340px; }
.aim-filter .users-keyword { margin-left: 0; min-width: 220px; max-width: none; flex: 1 1 220px; }
.aim-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
  color: var(--muted);
  font-size: 12px;
}
.aim-meta p { margin: 0; }
.aim-meta strong { color: var(--text); }
.aim-board { overflow: hidden; }
.aim-table { width: 100%; }
.aim-table th,
.aim-table td { white-space: nowrap; }
.aim-table tr.is-super td { background: color-mix(in srgb, #c9a227 14%, transparent); }
.aim-table tr.is-lock td { background: color-mix(in srgb, #eab308 16%, transparent); }
.aim-table tr.is-online td { box-shadow: inset 3px 0 0 #34d399; }
.aim-id {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.aim-admin { min-width: 148px; }
.aim-admin-name {
  display: flex;
  align-items: center;
  gap: 6px;
}
.aim-admin .link {
  color: var(--text);
  font-weight: 700;
}
.aim-admin em {
  display: inline-flex;
  flex: 0 0 auto;
  padding: 1px 6px;
  border-radius: 999px;
  color: #fde68a;
  background: color-mix(in srgb, #b45309 55%, transparent);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}
.aim-admin small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}
.aim-same { color: var(--muted); }
.aim-dup {
  border: 0;
  padding: 0;
  color: #fbbf24;
  background: none;
  font-weight: 800;
  cursor: pointer;
}
.aim-acts {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  white-space: nowrap;
}
.aim-table th:last-child,
.aim-table td.aim-acts { text-align: center; }
.aim-act {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  min-width: 46px;
  margin: 0;
  padding: 0 8px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--surface-2);
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  vertical-align: middle;
  cursor: pointer;
}
.aim-act:hover { border-color: #93c5fd; }
.aim-act.is-warn {
  border-color: #f59e0b;
  background: rgb(245 158 11 / .16);
  color: #fcd34d;
}
.aim-act.is-ok {
  border-color: #34d399;
  background: rgb(52 211 153 / .14);
  color: #a7f3d0;
}
.aim-act.is-danger {
  border-color: #f87171;
  background: rgb(248 113 113 / .14);
  color: #fecaca;
}
.aim-act:disabled { opacity: .35; cursor: not-allowed; }
[data-theme="light"] .aim-act.is-warn { color: #92400e; background: #fef3c7; }
[data-theme="light"] .aim-act.is-ok { color: #065f46; background: #d1fae5; }
[data-theme="light"] .aim-act.is-danger { color: #991b1b; background: #fee2e2; }
.modal.is-aim-staff { width: min(760px, 100%); }
.modal.is-aim-staff .modal-body { max-height: min(72vh, 740px); overflow: auto; }
.aim-form { display: grid; gap: 16px; }
.aim-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.aim-form-grid .full { grid-column: 1 / -1; }
.aim-form-hint {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.aim-hist h3 {
  margin: 0 0 8px;
  font-size: 13px;
}
.aim-hist table { width: 100%; }
.aim-hist th,
.aim-hist td { padding: 8px 6px; font-size: 12px; }
@media (max-width: 1180px) {
  .aim-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .aim-filter .users-date-range { flex-basis: 100%; }
}
@media (max-width: 760px) {
  .aim-kpis,
  .aim-form-grid { grid-template-columns: 1fr; }
}

.ms-page { display: grid; gap: 10px; }
.ms-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}
.ms-kpi {
  display: grid;
  gap: 4px;
  min-height: 64px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--muted);
  background: var(--surface);
  text-align: left;
  cursor: pointer;
}
.ms-kpi span { font-size: 11px; font-weight: 600; }
.ms-kpi strong {
  color: var(--text);
  font-size: 20px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
}
.ms-kpi.is-on {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--line));
  background: color-mix(in srgb, var(--primary-soft) 80%, var(--surface));
}
.ms-kpi.ok strong { color: #67e8f9; }
.ms-kpi.warn strong { color: #fbbf24; }
.ms-kpi.gold strong { color: #fde68a; }
.ms-kpi.info strong { color: #7dd3fc; }
.ms-filter { flex-wrap: wrap; border-radius: 12px; padding: 10px 12px; }
.ms-filter .users-keyword { margin-left: 0; min-width: 220px; max-width: none; flex: 1 1 220px; }
.ms-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
  color: var(--muted);
  font-size: 12px;
}
.ms-meta p { margin: 0; }
.ms-meta strong { color: var(--text); }
.ms-lane {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
}
.ms-lane-head {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ms-lane-head > div { min-width: 0; flex: 1; }
.ms-lane-head h2 { margin: 0; font-size: 15px; letter-spacing: -.02em; }
.ms-lane-head p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.ms-lane-count {
  display: grid;
  place-items: center;
  min-width: 36px;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  color: var(--text);
  background: var(--surface-3, var(--surface));
  font-size: 12px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.ms-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.ms-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}
.ms-card.is-default { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 40%, transparent); }
.ms-card.is-maint { box-shadow: inset 3px 0 0 #fbbf24; }
.ms-card.is-ssl { box-shadow: inset 3px 0 0 #f59e0b; }
.ms-card.is-off { opacity: .78; }
.ms-card-stripe {
  height: 5px;
  min-height: 5px;
  display: block;
  border-radius: 0;
}
.ms-card-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px 0;
}
.ms-card-title {
  min-width: 0;
  flex: 1;
  border: 0;
  padding: 0;
  color: inherit;
  background: none;
  text-align: left;
  cursor: pointer;
}
.ms-card-title strong {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--text);
  font-size: 14px;
  letter-spacing: -.02em;
}
.ms-card-title .ms-code {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
}
.ms-card-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.ms-card-meta {
  display: grid;
  gap: 8px;
  margin: 12px 14px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--surface-3, var(--bg)) 55%, transparent);
}
.ms-card-meta dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}
.ms-card-meta dd {
  margin: 3px 0 0;
  overflow: hidden;
  color: var(--text);
  font-size: 12px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ms-card-meta dd:has(.ms-copy) {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ms-card-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.ms-card-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  margin-top: auto;
  padding: 10px 14px 12px;
  border-top: 1px solid var(--line);
}
.ms-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 28px 12px;
  color: var(--muted);
  text-align: center;
}
.ms-themes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.ms-theme {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--muted);
  background: var(--surface);
  cursor: pointer;
}
.ms-theme span { font-size: 12px; font-weight: 700; }
.ms-theme.is-on {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--line));
  color: var(--text);
  background: color-mix(in srgb, var(--primary-soft) 70%, var(--surface));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent);
}
.ms-theme .ms-shot { min-height: 88px; }
.ms-filter { flex-wrap: wrap; border-radius: 12px; padding: 10px 12px; }
.ms-filter .users-keyword { margin-left: 0; min-width: 220px; max-width: none; flex: 1 1 220px; }
.ms-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
  color: var(--muted);
  font-size: 12px;
}
.ms-meta p { margin: 0; }
.ms-meta strong { color: var(--text); }
.ms-board { overflow: hidden; }
.ms-table { width: 100%; }
.ms-table th, .ms-table td { white-space: nowrap; }
.ms-table tr.is-default td { background: color-mix(in srgb, var(--primary) 10%, transparent); }
.ms-table tr.is-maint td { background: color-mix(in srgb, #eab308 12%, transparent); }
.ms-table tr.is-ssl td { box-shadow: inset 3px 0 0 #fbbf24; }
.ms-table tr.is-off td { opacity: .78; }
.ms-code { color: var(--muted); font-weight: 700; font-variant-numeric: tabular-nums; }
.ms-name .link { color: var(--text); font-weight: 700; }
.ms-name em,
.ms-hero h1 em,
.ms-card-title em {
  display: inline-flex;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 999px;
  color: #fde68a;
  background: color-mix(in srgb, #b45309 55%, transparent);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  vertical-align: 2px;
}
.ms-name small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }
.ms-domain {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ms-copy {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 6px;
  color: var(--muted);
  background: var(--surface-2, transparent);
  cursor: pointer;
}
.ms-copy svg { width: 12px; height: 12px; }
.ms-acts { display: flex; align-items: center; gap: 8px; }
.ms-act {
  border: 0;
  padding: 0;
  color: #7dd3fc;
  background: none;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.ms-act.is-warn { color: var(--muted); }
.ms-act.is-danger { color: #f87171; }
.ms-act:disabled { opacity: .35; cursor: not-allowed; }
.ms-back {
  width: max-content;
  border: 0;
  padding: 0;
  color: var(--muted);
  background: none;
  font-weight: 700;
  cursor: pointer;
}
.ms-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.ms-hero h1 { margin: 0; font-size: 22px; }
.ms-hero p { margin: 4px 0 0; color: var(--muted); }
.ms-facts {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.ms-fact { padding: 12px 14px; }
.ms-fact span { display: block; color: var(--muted); font-size: 11px; }
.ms-fact strong { display: block; margin-top: 4px; font-size: 13px; }
.ms-detail {
  display: grid;
  grid-template-columns: 168px minmax(0, 1fr) 240px;
  gap: 12px;
}
.ms-side { display: grid; align-content: start; gap: 4px; padding: 8px; }
.ms-side button {
  text-align: left;
  border: 0;
  border-radius: 8px;
  padding: 10px 12px;
  color: var(--text);
  background: transparent;
}
.ms-side button.is-on { background: var(--primary-soft); color: var(--primary); font-weight: 700; }
.ms-side button.is-danger { color: #f87171; }
.ms-main h2 { margin: 0 0 14px; font-size: 16px; }
.ms-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.ms-grid .full { grid-column: 1 / -1; }
.ms-flag-list { display: grid; gap: 8px; margin-top: 4px; }
.ms-flag {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.ms-flag strong { display: block; }
.ms-flag p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.ms-alias { margin-top: 16px; }
.ms-alias-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.ms-alias-head h3 { margin: 0; font-size: 13px; }
.ms-alias-add { display: flex; gap: 8px; min-width: 0; flex: 1; justify-content: flex-end; }
.ms-alias-add .input { max-width: 260px; }
.ms-alias ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.ms-alias li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.ms-alias em { color: var(--muted); font-size: 11px; font-style: normal; }
.ms-preview {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 16px;
  margin-top: 16px;
}
.ms-shot {
  min-height: 110px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: #f5e6b8;
  text-align: center;
  background: linear-gradient(160deg, #0b1220, #1f2937);
}
.ms-shot small { display: block; margin-top: 4px; opacity: .7; }
.ms-shot-dark { background: linear-gradient(160deg, #0b1220, #1f2937); }
.ms-shot-gold { background: linear-gradient(135deg, #1a1208, #c9a227); }
.ms-shot-violet { background: linear-gradient(135deg, #1b1028, #7c3aed); }
.ms-shot-light { background: linear-gradient(135deg, #e5e7eb, #ffffff); color: #1f2937; }
.ms-copy-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ms-copy-row code { font-size: 12px; }
.ms-hint { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.ms-log { margin: 0; padding-left: 18px; }
.ms-log li { margin: 8px 0; }
.ms-log span { display: block; color: var(--muted); font-size: 11px; }
.ms-danger p { margin: 0 0 14px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.ms-danger-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.modal.is-ms-site { width: min(640px, 100%); }
@media (max-width: 1180px) {
  .ms-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ms-facts, .ms-detail { grid-template-columns: 1fr; }
  .ms-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ms-themes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .ms-kpis, .ms-grid, .ms-preview, .ms-cards, .ms-themes { grid-template-columns: 1fr; }
}

.gs-card { min-width: 0; }
.gs-board { min-width: 0; }
.gs-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.gs-tools.operation-tools { flex-wrap: wrap; gap: 8px; }
.gs-tools .period-shortcuts button {
  min-width: 52px;
  height: 32px;
  font-size: 12px;
}
.gs-tools .operation-date-range { gap: 6px; }
.gs-tools .operation-date-range input {
  width: 176px;
  height: 32px;
  font-size: 12px;
}
.gs-tools .date-separator { font-size: 12px; }
.gs-tools .operation-search {
  height: 32px;
  padding: 0 12px;
  font-size: 12px;
}
.gs-toolbar em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  white-space: nowrap;
}
.gs-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  margin: 4px 0 8px;
}
.gs-kpis-extra {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: 0 0 14px;
}
.gs-kpi {
  position: relative;
  display: grid;
  justify-items: stretch;
  gap: 8px;
  min-width: 0;
  padding: 10px 10px 9px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: inherit;
  background: var(--surface);
  text-align: left;
}
.gs-kpi.is-on {
  border-color: #38bdf8;
  box-shadow: inset 0 0 0 1px rgba(56, 189, 248, .35);
}
.gs-bang {
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border: 1px solid #f59e0b;
  border-radius: 50%;
  color: #fbbf24;
  background: rgba(15, 23, 42, .72);
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
.gs-bang::after {
  content: attr(data-tip);
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 5;
  width: max-content;
  max-width: 240px;
  padding: 8px 10px;
  border: 1px solid #334155;
  border-radius: 8px;
  background: #0f172a;
  color: #f8fafc;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
  text-align: left;
  white-space: normal;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .4);
  opacity: 0;
  pointer-events: none;
}
.gs-bang:hover::after,
.gs-bang:focus-visible::after { opacity: 1; }
.gs-toolbar em { display: inline-flex; align-items: center; }
.gs-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}
.gs-calc {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 10px;
  padding: 5px 12px 5px 6px;
  border: 1px solid #f59e0b;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(245, 158, 11, .28), rgba(245, 158, 11, .1));
  color: #fde68a;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, .2), 0 0 18px rgba(245, 158, 11, .28);
}
.gs-calc i {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #f59e0b;
  color: #1c1406;
  font-style: normal;
  font-weight: 900;
}
.gs-calc-pop {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 6;
  display: none;
  width: min(380px, 70vw);
  padding: 12px 14px;
  border: 1px solid #f59e0b;
  border-radius: 12px;
  background: #1a1408;
  color: #fff7e6;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.55;
  text-align: left;
  box-shadow: 0 16px 36px rgba(0, 0, 0, .45), 0 0 0 1px rgba(245, 158, 11, .35);
}
.gs-calc:hover .gs-calc-pop,
.gs-calc:focus-visible .gs-calc-pop { display: block; }
.gs-kpi-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}
.gs-kpi-head svg { width: 14px; height: 14px; }
.gs-kpi-head strong { color: var(--text); font-size: 13px; font-weight: 800; }
.gs-kpi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 8px;
}
.gs-kpi-grid span {
  display: grid;
  justify-items: start;
  gap: 1px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 650;
  text-align: left;
}
.gs-kpi-grid b {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.gs-kpi.is-sports { background: linear-gradient(180deg, rgba(34, 197, 94, .08), transparent 42%); }
.gs-kpi.is-casino { background: linear-gradient(180deg, rgba(139, 92, 246, .1), transparent 42%); }
.gs-kpi.is-slot { background: linear-gradient(180deg, rgba(99, 102, 241, .1), transparent 42%); }
.gs-kpi.is-poly { background: linear-gradient(180deg, rgba(245, 158, 11, .1), transparent 42%); }
.gs-kpi.is-mini { background: linear-gradient(180deg, rgba(56, 189, 248, .1), transparent 42%); }
.gs-kpi.is-virtual { background: linear-gradient(180deg, rgba(20, 184, 166, .1), transparent 42%); }
.gs-kpi.is-point { background: linear-gradient(180deg, rgba(244, 114, 182, .1), transparent 42%); }
.gs-kpi.is-lost { background: linear-gradient(180deg, rgba(56, 189, 248, .1), transparent 42%); }
.gs-kpi.is-total { background: linear-gradient(180deg, rgba(148, 163, 184, .14), transparent 42%); }
.gs-kpi.is-admin { background: linear-gradient(180deg, rgba(244, 114, 182, .1), transparent 42%); }
.gs-kpi.is-void { background: linear-gradient(180deg, rgba(245, 158, 11, .12), transparent 42%); }
.gs-kpi.is-event { background: linear-gradient(180deg, rgba(52, 211, 153, .1), transparent 42%); }
.gs-split {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 4fr);
  gap: 12px;
  align-items: start;
}
.gs-pane { min-width: 0; }
.gs-view-inline { min-height: 32px; margin: 0 0 8px; }
.gs-view-inline.is-spacer {
  visibility: hidden;
  pointer-events: none;
  border-color: transparent;
}
.gs-event-table { min-width: 0; }
.gs-event-table th,
.gs-event-table td { padding: 8px 12px; text-align: center; }
.gs-event-table th:first-child,
.gs-event-table td:first-child,
.gs-event-table th:last-child,
.gs-event-table td:last-child { text-align: center; }
.gs-board-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin: 4px 0 8px;
}
.gs-board-head h3 { margin: 0 0 4px; font-size: 15px; }
.gs-board-head span { color: var(--muted); font-size: 12px; font-weight: 600; }
.gs-board-head p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.gs-board-head p b { color: var(--text); }
.gs-board-head em { color: var(--muted); font-size: 11px; font-style: normal; white-space: nowrap; }
.gs-board-wrap { margin-bottom: 16px; }
.gs-table-head {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  text-align: center;
  gap: 12px;
  min-height: 52px;
  margin: 4px 0 10px;
}
.gs-table-head h3 { margin: 0 0 4px; font-size: 15px; }
.gs-table-head p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.gs-view {
  display: inline-flex;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.gs-view button {
  height: 32px;
  border: 0;
  padding: 0 12px;
  color: var(--muted);
  background: transparent;
  font-size: 12px;
  font-weight: 650;
}
.gs-view button + button { border-left: 1px solid var(--line); }
.gs-view button.active {
  color: var(--text);
  background: var(--surface-3);
  font-weight: 800;
}
.gs-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.gs-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
}
.gs-table.gs-event-table {
  min-width: 0;
  table-layout: fixed;
}
.gs-table th,
.gs-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  text-align: center;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.gs-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  height: 40px;
  box-sizing: border-box;
  color: #e2e8f0;
  text-align: center;
  background: #1e293b;
  font-size: 11px;
  font-weight: 800;
}
.gs-table tbody tr:first-child > * {
  height: 42px;
  box-sizing: border-box;
}
.gs-table .gs-date {
  width: 92px;
  color: var(--text);
  text-align: center;
  vertical-align: top;
  padding-top: 14px;
  background: var(--surface-3);
  font-weight: 800;
  letter-spacing: .02em;
  position: sticky;
  left: 0;
  z-index: 1;
}
.gs-table .gs-date small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 650;
}
.gs-table .gs-date.is-flat { font-weight: 700; }
.gs-kind {
  text-align: center !important;
  font-weight: 700;
}
.gs-kind-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 6px;
  border-radius: 99px;
  background: #64748b;
  vertical-align: 1px;
}
.gs-kind-dot.is-sports { background: #22c55e; }
.gs-kind-dot.is-casino { background: #8b5cf6; }
.gs-kind-dot.is-slot { background: #6366f1; }
.gs-kind-dot.is-poly { background: #f59e0b; }
.gs-kind-dot.is-mini { background: #38bdf8; }
.gs-kind-dot.is-virtual { background: #14b8a6; }
.gs-count { color: var(--muted); }
.gs-num.is-plus { color: #2563eb; font-weight: 800; }
.gs-num.is-minus,
.gs-num.is-zero,
.gs-kpi-grid b.is-zero,
.gs-kpi-grid b.is-minus { color: #ef4444; }
.gs-kpi-grid b.is-plus { color: #38bdf8; }
.gs-table tr.is-sum th,
.gs-table tr.is-sum td {
  background: #f8d7dc;
  font-weight: 800;
}
.gs-table tr.is-sub td,
.gs-table tr.is-sub th {
  background: var(--surface-3);
  font-weight: 800;
}
.gs-table tr.is-extra td,
.gs-table tr.is-extra th {
  background: #f4faf6;
}
.gs-table tr.is-extra .gs-kind { color: #355e45; }
[data-theme="dark"] .gs-table tr.is-extra td,
[data-theme="dark"] .gs-table tr.is-extra th { background: #172821; }
[data-theme="dark"] .gs-table tr.is-extra .gs-kind { color: #b7e0c8; }
[data-theme="dark"] .gs-table thead th { background: #0f172a; color: #cbd5e1; }
[data-theme="dark"] .gs-table tr.is-sum th,
[data-theme="dark"] .gs-table tr.is-sum td { background: #3d2430; color: #f8c9d0; }
[data-theme="dark"] .gs-num.is-plus { color: #7dd3fc; }
[data-theme="light"] .gs-table thead th { background: #334155; }
@media (max-width: 1280px) {
  .gs-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gs-toolbar,
  .gs-table-head,
  .gs-board-head { flex-direction: column; align-items: stretch; }
}
@media (max-width: 980px) {
  .gs-split { grid-template-columns: 1fr; }
  .gs-kpis-extra { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .gs-kpis { grid-template-columns: 1fr 1fr; }
}

.alm-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}
.alm-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.alm-card-head { display: flex; align-items: center; gap: 8px; }
.alm-card-head i {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 8px;
  color: #fff;
  background: #4f6ef7;
}
.alm-card-head svg { width: 15px; height: 15px; }
.alm-card-head h2 { margin: 0; color: #4f6ef7; font-size: 15px; font-weight: 800; letter-spacing: -.03em; }
.alm-field { display: grid; gap: 6px; }
.alm-field > span,
.alm-vol > span { color: var(--text); font-size: 12px; font-weight: 700; }
.alm-card .select { width: 100%; height: 36px; }
.alm-drop {
  display: grid;
  justify-items: center;
  gap: 4px;
  min-height: 132px;
  padding: 18px 12px;
  border: 1px dashed var(--line-strong);
  border-radius: 10px;
  color: var(--muted);
  background: var(--surface-2);
  text-align: center;
  cursor: pointer;
}
.alm-drop i {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin-bottom: 4px;
  border-radius: 999px;
  color: #4f6ef7;
  background: color-mix(in srgb, #4f6ef7 14%, transparent);
}
.alm-drop svg { width: 18px; height: 18px; }
.alm-drop b { color: var(--text); font-size: 12px; font-weight: 700; line-height: 1.4; }
.alm-drop small { font-size: 11px; }
.alm-status { margin: 0; color: var(--muted); font-size: 12px; }
.alm-vol { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; }
.alm-vol input { width: 100%; accent-color: #4f6ef7; }
.alm-vol b { min-width: 4ch; color: var(--text); font-size: 12px; font-variant-numeric: tabular-nums; text-align: right; }
.alm-card audio { width: 100%; height: 36px; }
.alm-apply { align-self: flex-start; min-width: 92px; }
@media (max-width: 1400px) {
  .alm-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .alm-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .alm-grid { grid-template-columns: 1fr; }
}

.sms-page {
  display: grid;
  grid-template-columns: minmax(240px, 20%) minmax(0, 80%);
  gap: 20px;
  align-items: start;
}
.sms-phone-col {
  position: sticky;
  top: 72px;
  display: grid;
  justify-items: center;
  gap: 10px;
}
.sms-device {
  position: relative;
  width: 100%;
  max-width: 280px;
  aspect-ratio: 9 / 19.4;
  padding: 10px;
  border-radius: 38px;
  background: linear-gradient(160deg, #3a3a3e, #111114 38%, #0a0a0c);
  box-shadow: 0 24px 50px rgb(0 0 0 / .45), inset 0 0 0 1px rgb(255 255 255 / .08);
}
.sms-side {
  position: absolute;
  background: #0c0c0e;
  border-radius: 2px;
}
.sms-silent { top: 86px; left: -2px; width: 3px; height: 18px; }
.sms-vol { top: 118px; left: -2px; width: 3px; height: 46px; box-shadow: 0 58px 0 #0c0c0e; }
.sms-power { top: 132px; right: -2px; width: 3px; height: 62px; }
.sms-glass {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border-radius: 28px;
  background: #000;
  color: #f5f5f7;
}
.sms-island {
  position: absolute;
  top: 18px;
  left: 50%;
  z-index: 2;
  width: 86px;
  height: 22px;
  border-radius: 999px;
  background: #000;
  transform: translateX(-50%);
  box-shadow: 0 0 0 3px #000;
}
.sms-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px 4px;
  font-size: 10px;
  font-weight: 700;
}
.sms-status em {
  display: inline-block;
  width: 18px;
  height: 8px;
  margin-left: 4px;
  border: 1px solid #f5f5f7;
  border-radius: 2px;
  vertical-align: middle;
  position: relative;
}
.sms-status em::after {
  content: "";
  position: absolute;
  inset: 1px 3px 1px 1px;
  background: #34d399;
  border-radius: 1px;
}
.sms-imsg {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px 10px;
  border-bottom: 1px solid rgb(255 255 255 / .08);
}
.sms-avatar {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(180deg, #5b8def, #3b6bd6);
  font-size: 11px;
  font-weight: 800;
}
.sms-imsg strong { display: block; font-size: 11px; letter-spacing: -.03em; }
.sms-imsg small { color: #8e8e93; font-size: 9px; }
.sms-thread {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 10px;
  background: #000;
}
.sms-thread time {
  align-self: center;
  color: #636366;
  font-size: 9px;
  font-weight: 600;
}
.sms-bubble {
  max-width: 86%;
  padding: 8px 10px;
  border-radius: 16px;
  font-size: 11px;
  line-height: 1.45;
  letter-spacing: -.02em;
  white-space: pre-wrap;
  word-break: keep-all;
}
.sms-bubble.in {
  align-self: flex-start;
  color: #f5f5f7;
  background: #26252b;
  border-bottom-left-radius: 5px;
}
.sms-bubble.is-new { animation: smsPop .28s ease; }
@keyframes smsPop {
  from { transform: translateY(8px); opacity: 0; }
  to { transform: none; opacity: 1; }
}
.sms-composer {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px 4px;
}
.sms-composer-input {
  flex: 1;
  min-width: 0;
  height: 32px;
  border: 0;
  border-radius: 999px;
  padding: 0 12px;
  color: #f5f5f7;
  background: #1c1c1e;
}
.sms-send {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #fff;
  background: #0a84ff;
}
.sms-send svg { width: 14px; height: 14px; }
.sms-home {
  display: block;
  width: 108px;
  height: 4px;
  margin: 6px auto 8px;
  border-radius: 999px;
  background: #3a3a3c;
}
.sms-phone-cap {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -.02em;
}
.sms-panel { display: grid; gap: 12px; min-width: 0; }
.sms-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid color-mix(in srgb, #34d399 28%, var(--line));
  border-radius: 14px;
  background: linear-gradient(135deg, color-mix(in srgb, #34d399 16%, var(--surface)), var(--surface));
}
.sms-hero em {
  display: inline-block;
  margin-bottom: 4px;
  color: #34d399;
  font-size: 10px;
  font-weight: 800;
  font-style: normal;
  letter-spacing: .08em;
}
.sms-hero h2 { margin: 0 0 4px; font-size: 18px; letter-spacing: -.04em; }
.sms-hero p { margin: 0; color: var(--muted); }
.sms-hero:not(.is-on) {
  border-color: var(--line);
  background: var(--surface);
}
.sms-hero:not(.is-on) em { color: var(--muted); }
.sms-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.sms-kpi {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.sms-kpi span { display: block; color: var(--muted); font-size: 11px; font-weight: 650; }
.sms-kpi strong { display: block; margin-top: 4px; font-size: 15px; letter-spacing: -.03em; }
.sms-kpi.is-ok strong { color: #34d399; }
.sms-kpi.is-wait strong { color: #fbbf24; }
.sms-kpi.is-off strong { color: #f87171; }
.sms-card { padding: 16px 18px 18px; }
.sms-card-head { margin-bottom: 14px; }
.sms-card-head h3 { margin: 0 0 4px; font-size: 14px; }
.sms-card-head p { margin: 0; color: var(--muted); }
.sms-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 14px;
}
.sms-span { grid-column: 1 / -1; }
.sms-field { display: grid; gap: 6px; min-width: 0; }
.sms-field > span { color: var(--text); font-size: 12px; font-weight: 700; }
.sms-rows { display: grid; gap: 0; }
.sms-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}
.sms-row:first-child { border-top: 0; padding-top: 0; }
.sms-row p { margin: 4px 0 0; color: var(--muted); }
.sms-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.sms-chip {
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 12px;
  color: var(--muted);
  background: var(--surface-2);
  font-weight: 700;
}
.sms-chip.is-on {
  border-color: var(--primary);
  color: var(--text);
  background: var(--primary-soft);
}
.sms-body { min-height: 120px; resize: vertical; }
.sms-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
@media (max-width: 1100px) {
  .sms-page { grid-template-columns: 1fr; }
  .sms-phone-col { position: static; }
  .sms-kpis { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .sms-grid { grid-template-columns: 1fr; }
}

.content .btn.csv-excel,
.bulk-actions .btn.csv-excel,
.bulk-right-actions .btn.csv-excel,
.content:has(.slm-page) .head-actions .btn.csv-excel,
.content:has(.sbs-page) .head-actions .btn.csv-excel {
  border: 0;
  border-radius: 5px;
  background: #4a76a8;
  color: #fff;
}
.content .btn.csv-excel:hover,
.bulk-actions .btn.csv-excel:hover,
.bulk-right-actions .btn.csv-excel:hover {
  background: #3d6796;
  color: #fff;
}

.ipb-kpis { margin-bottom: 12px; }
.ipb-kpi {
  display: block;
  width: 100%;
  text-align: left;
  cursor: pointer;
  border: 1px solid transparent;
}
.ipb-kpi.is-on { border-color: color-mix(in srgb, var(--primary) 55%, var(--line)); }
.ipb-composer { padding: 16px 18px 18px; margin-bottom: 12px; }
.ipb-composer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.ipb-composer-head h2 { margin: 0 0 4px; font-size: 14px; font-weight: 800; }
.ipb-composer-head p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.ipb-kind, .ipb-chips { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.ipb-chip {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 10px;
  color: var(--muted);
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.ipb-chip.is-on {
  color: #fff;
  border-color: #2563eb;
  background: #2563eb;
}
.ipb-ip-field { display: grid; gap: 6px; margin-bottom: 12px; }
.ipb-ip-field span,
.ipb-composer-grid span { color: var(--muted); font-size: 11px; font-weight: 700; }
.ipb-ip-field textarea {
  min-height: 78px;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px;
  line-height: 1.45;
}
.ipb-composer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.2fr) minmax(0, 1fr) auto;
  gap: 12px 16px;
  align-items: end;
}
.ipb-composer-grid > div,
.ipb-composer-grid > label { display: grid; gap: 6px; }
.ipb-composer-go { display: flex; align-items: end; }
.ipb-composer-go .btn { min-width: 108px; height: 36px; }
.ipb-board { padding: 0; overflow: hidden; }
.ipb-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--line);
}
.ipb-tabs button {
  height: 42px;
  border: 0;
  border-bottom: 2px solid transparent;
  padding: 0 18px;
  color: var(--muted);
  background: transparent;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.ipb-tabs button em {
  margin-left: 6px;
  color: inherit;
  font-style: normal;
  font-weight: 800;
}
.ipb-tabs button.active {
  color: var(--text);
  border-bottom-color: #2563eb;
}
.ipb-hint {
  margin: 0;
  padding: 10px 16px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.ipb-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
}
.ipb-search {
  position: relative;
  flex: 1 1 220px;
  min-width: 180px;
}
.ipb-search .nav-search-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  color: var(--muted);
  pointer-events: none;
}
.ipb-search input { padding-left: 32px; }
.ipb-toolbar .select { width: auto; min-width: 108px; }
.ipb-table { width: 100%; min-width: 860px; border-collapse: collapse; table-layout: auto; }
.ipb-table th,
.ipb-table td {
  padding: 10px 12px;
  border-top: 1px solid var(--line);
  font-size: 12px;
  text-align: left;
  vertical-align: middle;
}
.ipb-table th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  background: color-mix(in srgb, var(--surface-2) 80%, transparent);
}
.ipb-table .ipb-manage,
.ipb-table td:last-child {
  width: 118px;
  min-width: 118px;
  white-space: nowrap;
}
.ipb-ip {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  overflow: visible;
  white-space: nowrap;
}
.ipb-ip code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  font-weight: 700;
}
.ipb-ip small {
  margin-left: 6px;
  color: #38bdf8;
  font-size: 10px;
  font-weight: 800;
}
.ipb-until, .ipb-at { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--muted); }
.ipb-memo { color: var(--text); max-width: 220px; }
.ipb-acts {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 94px;
  white-space: nowrap;
}
.ipb-acts .switch {
  flex: 0 0 36px;
  width: 36px;
  height: 20px;
}
.ipb-del {
  flex: 0 0 auto;
  width: auto;
  min-width: 44px;
  height: 24px;
  min-height: 24px;
  padding: 0 8px;
}
.ipb-empty-row td {
  padding: 28px 16px;
  color: var(--muted);
  text-align: center;
}
@media (max-width: 980px) {
  .ipb-composer-grid { grid-template-columns: 1fr 1fr; }
  .ipb-composer-go { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .ipb-composer-head { flex-direction: column; }
  .ipb-composer-grid { grid-template-columns: 1fr; }
}

.ham-kpis { margin-bottom: 12px; }
.ham-kpi {
  display: block;
  width: 100%;
  text-align: left;
  cursor: pointer;
  border: 1px solid transparent;
}
.ham-kpi.is-on { border-color: color-mix(in srgb, var(--primary) 55%, var(--line)); }
.ham-composer { padding: 16px 18px 18px; margin-bottom: 12px; }
.ham-composer-head { margin-bottom: 12px; }
.ham-composer-head h2 { margin: 0 0 4px; font-size: 14px; font-weight: 800; }
.ham-composer-head p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.ham-composer-grid {
  display: grid;
  grid-template-columns: minmax(160px, 220px) 1fr 1fr auto;
  gap: 12px 16px;
  align-items: end;
}
.ham-composer-grid > div > span,
.ham-composer-grid label > span {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.ham-composer-go { display: flex; flex-wrap: wrap; gap: 6px; }
.ham-board { padding: 0 0 8px; overflow: hidden; }
.ham-board .table-scroll { overflow-x: auto; }
.ham-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: 1px solid var(--line);
}
.ham-tabs button {
  height: 42px;
  padding: 0 14px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--muted);
  background: transparent;
  font-size: 12px;
  font-weight: 750;
}
.ham-tabs button em {
  margin-left: 6px;
  color: #94a3b8;
  font-style: normal;
  font-weight: 700;
}
.ham-tabs button.active {
  color: var(--text);
  border-bottom-color: var(--primary);
}
.ham-hint {
  margin: 10px 16px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.ham-hint b { color: var(--text); }
.ham-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px 8px;
}
.ham-search { position: relative; flex: 1; min-width: 180px; }
.ham-search .nav-search-icon {
  position: absolute;
  top: 50%;
  left: 10px;
  width: 14px;
  transform: translateY(-50%);
  color: var(--muted);
}
.ham-search .input { padding-left: 30px; }
.ham-count { margin-left: auto; color: var(--muted); font-size: 12px; }
.ham-table { width: 100%; min-width: 1140px; }
.ham-table th,
.ham-table td {
  height: auto;
  min-height: 48px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
  font-size: 12px;
  white-space: nowrap;
  overflow: visible;
}
.ham-table th {
  color: var(--muted);
  background: var(--surface-3);
  font-weight: 700;
}
.ham-table td.numeric { text-align: right; font-variant-numeric: tabular-nums; }
.ham-table tr.is-new { background: rgb(239 68 68 / .08); }
.ham-table tr.is-off { opacity: .72; }
.ham-table td.ham-sw { width: 56px; }
.ham-table td.ham-game { width: 220px; }
.ham-table td.ham-money { min-width: 520px; }
.ham-table td.ham-streak { width: 300px; }
.ham-table td.ham-state { width: 84px; }
.ham-game-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.ham-game-cell i {
  width: 16px;
  height: 16px;
  flex: none;
  color: var(--muted);
}
.ham-game-cell span { min-width: 0; }
.ham-game-cell strong {
  display: block;
  line-height: 1.25;
  white-space: nowrap;
}
.ham-game-cell small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  line-height: 1.2;
  white-space: nowrap;
}
.ham-member small { display: block; color: var(--muted); }
.ham-amount {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
}
.ham-amount .input {
  width: 148px;
  min-width: 148px;
  max-width: 148px;
  flex: none;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.ham-chips {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
}
.ham-chip {
  height: 24px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 8px;
  color: var(--muted);
  background: transparent;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.ham-chip.is-on {
  color: #fff;
  background: #365fa8;
  border-color: #365fa8;
}
.ham-empty-row td {
  padding: 28px 16px;
  color: var(--muted);
  text-align: center;
}
[data-theme="dark"] .ham-chip.is-on { background: #3b82f6; border-color: #3b82f6; }
@media (max-width: 1100px) {
  .ham-composer-grid { grid-template-columns: 1fr 1fr; }
  .ham-composer-go { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .ham-composer-grid { grid-template-columns: 1fr; }
}

.sc-page { min-width: 0; }
.sc-hero {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.sc-hero-mark {
  width: 42px;
  height: 42px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: linear-gradient(160deg, #3d7ea8, #1d4f73);
  color: #e8f6ff;
}
.sc-hero-mark svg { width: 20px; height: 20px; stroke-width: 1.8; }
.sc-hero-copy { min-width: 0; flex: 1; }
.sc-crumb {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -.02em;
}
.sc-hero-copy h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -.03em;
}
.sc-hero-copy p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.sc-hero-meta {
  display: grid;
  justify-items: end;
  gap: 6px;
  flex: none;
}
.sc-hero-meta small {
  color: var(--muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.sc-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  padding: 0 10px;
  border: 1px solid color-mix(in srgb, #22c55e 35%, var(--line));
  border-radius: 999px;
  color: #86efac;
  background: color-mix(in srgb, #22c55e 10%, transparent);
  font-size: 11px;
  font-weight: 750;
}
.sc-live i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 3px rgb(34 197 94 / .16);
  animation: sc-live-pulse 1.8s ease-out infinite;
}
@keyframes sc-live-pulse {
  0% { box-shadow: 0 0 0 0 rgb(34 197 94 / .38); }
  100% { box-shadow: 0 0 0 7px rgb(34 197 94 / 0); }
}
@media (prefers-reduced-motion: reduce) {
  .sc-live i { animation: none; }
}
.sc-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.sc-tab {
  height: 40px;
  padding: 0 16px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--muted);
  background: transparent;
  font-size: 12px;
  font-weight: 750;
}
.sc-tab.active {
  color: var(--text);
  border-bottom-color: var(--primary);
}
.sc-kpis {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 10px;
}
button.sc-kpi {
  display: block;
  width: 100%;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.sc-kpi strong {
  margin-top: 6px;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
}
.sc-kpi.is-on {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--line));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 18%, transparent);
}
.sc-tools {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.sc-tools .select {
  width: auto;
  min-width: 108px;
}
.sc-search {
  position: relative;
  flex: 1;
  min-width: 220px;
}
.sc-search .nav-search-icon {
  position: absolute;
  top: 50%;
  left: 10px;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  color: var(--muted);
  pointer-events: none;
}
.sc-search .nav-search-icon svg { width: 14px; height: 14px; display: block; }
.sc-search .input { padding-left: 30px; }
.sc-board { overflow: hidden; }
.sc-table { width: 100%; min-width: 860px; }
.sc-table th,
.sc-table td {
  height: auto;
  min-height: 44px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
  font-size: 12px;
  white-space: nowrap;
}
.sc-table th {
  color: var(--muted);
  background: var(--surface-3);
  font-weight: 700;
}
.sc-table tr.is-crit { background: rgb(239 68 68 / .06); }
.sc-time {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.sc-ip {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow: visible;
  white-space: nowrap;
}
.sc-ip code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  font-weight: 700;
}
.sc-target { max-width: 180px; }
.sc-req b {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
}
.sc-req small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}
.sc-risk .badge {
  min-width: 72px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
}
.sc-empty-row td {
  padding: 28px 16px;
  color: var(--muted);
  text-align: center;
}
[data-theme="dark"] .sc-hero { background: #121a28; border-color: #243044; }
[data-theme="dark"] .sc-hero-mark { background: linear-gradient(160deg, #3d7ea8, #16384f); }
[data-theme="light"] .sc-live { color: #166534; background: #ecfdf3; }
@media (max-width: 1100px) {
  .sc-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .sc-hero { align-items: flex-start; }
  .sc-hero-meta { justify-items: start; }
  .sc-kpis { grid-template-columns: 1fr 1fr; }
}

.db-page { min-width: 0; }
.db-kpis {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 10px;
}
.db-kpi strong {
  overflow: visible;
  white-space: nowrap;
}
.db-kpi b {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
}
.db-kpi i {
  margin-left: 4px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 650;
}
.db-settle {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.db-settle-item {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.db-settle-item span {
  display: block;
  color: var(--muted);
  font-size: 11px;
}
.db-settle-item strong {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
}
.db-charts,
.db-split {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 12px;
  margin-bottom: 12px;
}
.db-chart-card { padding: 14px 16px 12px; }
.db-chart-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.db-chart-head h2 { margin: 0; font-size: 14px; font-weight: 800; letter-spacing: -.02em; }
.db-chart-head p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.db-legend {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  white-space: nowrap;
}
.db-legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #60a5fa;
}
.db-legend i.is-in { background: #34d399; }
.db-svg { display: block; width: 100%; height: 168px; }
.db-svg text { fill: var(--muted); font-size: 11px; }
.db-gbars { display: grid; gap: 9px; }
.db-gbar {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 92px;
  gap: 8px;
  align-items: center;
}
.db-gbar > span { color: var(--muted); font-size: 12px; }
.db-gbar-track {
  display: block;
  height: 8px;
  overflow: hidden;
  border-radius: 99px;
  background: color-mix(in srgb, var(--surface-3) 80%, transparent);
}
.db-gbar-track i {
  display: block;
  height: 8px;
  border-radius: 99px;
}
.db-gbar strong {
  text-align: right;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.db-board { overflow: hidden; }
.db-board .db-chart-head { padding: 14px 16px 0; }
.db-table { width: 100%; min-width: 520px; }
.db-table th,
.db-table td {
  height: auto;
  min-height: 40px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
  font-size: 12px;
  white-space: nowrap;
}
.db-table th {
  color: var(--muted);
  background: var(--surface-3);
  font-weight: 700;
}
.db-table td.numeric { text-align: right; font-variant-numeric: tabular-nums; }
.db-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 50%;
  vertical-align: middle;
}
.db-mix {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}
.db-donut { width: 120px; height: 120px; }
.db-mix-list { margin: 0; padding: 0; list-style: none; }
.db-mix-list li {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 5px 0;
  color: var(--muted);
  font-size: 12px;
}
.db-mix-list i { width: 8px; height: 8px; border-radius: 50%; }
.db-mix-list b { color: var(--text); font-variant-numeric: tabular-nums; }
[data-theme="dark"] .db-chart-card,
[data-theme="dark"] .db-board,
[data-theme="dark"] .db-settle-item { background: #121a28; border-color: #243044; }
@media (max-width: 1100px) {
  .db-kpis,
  .db-settle { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .db-charts,
  .db-split { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .db-kpis,
  .db-settle { grid-template-columns: 1fr 1fr; }
  .db-mix { grid-template-columns: 1fr; justify-items: center; }
}

.rotate-lock {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 100000;
  align-items: center;
  justify-content: center;
  background: #000;
  touch-action: none;
}
.rotate-lock img {
  display: block;
  width: min(86vw, 420px);
  height: auto;
  pointer-events: none;
  user-select: none;
}
@media (max-width: 1024px) and (orientation: portrait) {
  html, body {
    overflow: hidden !important;
    overscroll-behavior: none;
    height: 100%;
    height: 100dvh;
  }
  .rotate-lock { display: flex; }
}