@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap');

:root { --navy:#11253e; --navy-2:#173457; --blue:#2f80ed; --blue-2:#1266d5; --ink:#1f2a37; --muted:#7c8796; --line:#e9edf3; --canvas:#f5f7fa; --white:#fff; --green:#21a366; --green-soft:#e9f8ef; --orange:#ed8b24; --orange-soft:#fff5e7; --red:#e45656; --red-soft:#fff0f0; --purple:#8866d9; --purple-soft:#f1edff; }
* { box-sizing:border-box; }
html, body { margin:0; min-height:100%; background:var(--canvas); color:var(--ink); font-family:'Inter','Noto Sans SC',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; font-size:13px; }
body { -webkit-font-smoothing:antialiased; }
button, input, select, textarea { font:inherit; }
button { cursor:pointer; }
.app-shell { min-height:100vh; display:flex; }
.sidebar { width:232px; flex:0 0 232px; background:var(--navy); color:#c4d1e1; display:flex; flex-direction:column; position:sticky; top:0; height:100vh; z-index:20; }
.brand { height:72px; padding:0 25px; display:flex; align-items:center; gap:11px; color:#fff; font-size:18px; font-weight:700; letter-spacing:.5px; border-bottom:1px solid rgba(255,255,255,.07); }
.brand-mark { width:30px; height:30px; border-radius:9px; display:grid; place-items:center; color:#fff; background:linear-gradient(140deg,#459af8,#125dc5); box-shadow:0 5px 14px rgba(18,102,213,.3); font-size:16px; }
.sidebar-section-label { margin:24px 25px 9px; color:#7288a4; font-size:10px; letter-spacing:1.5px; text-transform:uppercase; }
.nav-list { display:flex; flex-direction:column; gap:3px; padding:0 12px; }
.nav-item { border:0; background:transparent; color:#aebed1; min-height:44px; border-radius:8px; padding:0 14px; display:flex; align-items:center; gap:12px; text-align:left; transition:.18s ease; }
.nav-item:hover { background:rgba(255,255,255,.07); color:#fff; }
.nav-item.active { background:var(--blue); color:#fff; box-shadow:0 7px 16px rgba(24,111,221,.25); }
.nav-icon { width:18px; text-align:center; font-size:17px; line-height:1; opacity:.9; }
.nav-item > span:last-of-type { flex:1; }
.nav-count { flex:0 0 auto!important; min-width:20px; padding:2px 6px; border-radius:9px; background:rgba(255,255,255,.16); color:#fff; text-align:center; font-size:10px; }
.sidebar-bottom { margin-top:auto; padding:15px 16px 20px; }
.sync-pill { display:flex; align-items:center; gap:8px; margin:0 8px 18px; color:#88cfa6; font-size:11px; }
.pulse { width:7px; height:7px; background:#46c57d; border-radius:50%; box-shadow:0 0 0 4px rgba(70,197,125,.1); }
.sidebar-user { border-top:1px solid rgba(255,255,255,.08); padding:16px 7px 0; display:flex; align-items:center; gap:9px; }
.sidebar-user b { display:block; color:#e9f0f8; font-size:12px; font-weight:600; }
.sidebar-user small { display:block; color:#7189a5; font-size:10px; margin-top:3px; }
.sidebar-more { margin-left:auto; color:#7189a5; letter-spacing:2px; }
.main-area { min-width:0; flex:1; }
.topbar { height:72px; padding:0 32px; display:flex; align-items:center; justify-content:space-between; background:#fff; border-bottom:1px solid var(--line); }
.topbar-left, .topbar-right { display:flex; align-items:center; gap:11px; }
.topbar-left { color:var(--muted); font-size:12px; }.topbar-left strong { color:var(--ink); font-weight:600; }.slash { color:#c5ccd6; }.breadcrumb { color:#98a2b1; }
.topbar-right { color:#707b8a; font-size:12px; }.server-state { display:flex; align-items:center; gap:7px; color:#2f8a5c; }.server-state i { width:6px; height:6px; border-radius:50%; background:#31b878; }.top-icon { position:relative; border:0; background:transparent; color:#667486; width:28px; height:28px; padding:6px; }.top-icon svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; }.top-icon em { position:absolute; width:5px; height:5px; border-radius:50%; background:#e45656; top:5px; right:4px; border:1px solid #fff; }.topbar-divider { height:20px; width:1px; background:#e7ebf0; }.avatar { width:26px; height:26px; display:grid; place-items:center; border-radius:50%; color:#fff; background:linear-gradient(145deg,#5e9eee,#2d66bb); font-weight:700; font-size:11px; }.avatar-small { width:29px; height:29px; font-size:12px; }.top-chevron { color:#a4afbc; margin-left:-7px; font-size:14px; }.mobile-menu { display:none; border:0; background:transparent; font-size:18px; color:var(--ink); }
.customer-scope { display:flex; align-items:center; gap:7px; color:#77869a; }.customer-scope span { white-space:nowrap; }.customer-scope select { height:32px; min-width:150px; max-width:220px; border:1px solid #dce5ef; border-radius:8px; padding:0 28px 0 9px; background:#fff; color:#33445a; font:inherit; }.customer-scope-label { max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#52647b; }
.page-content { max-width:1600px; margin:0 auto; padding:31px 38px 50px; }
.page-header { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:23px; }.page-header h1 { margin:0; font-size:24px; letter-spacing:-.5px; color:#1e2b3b; }.page-header p { margin:7px 0 0; color:#8b95a3; font-size:12px; }.page-header-actions { display:flex; gap:9px; }
.btn { min-height:34px; border:1px solid transparent; padding:0 15px; border-radius:6px; display:inline-flex; align-items:center; justify-content:center; gap:7px; font-weight:600; font-size:12px; white-space:nowrap; transition:.18s ease; }.btn svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; }.btn-primary { color:#fff; background:var(--blue); box-shadow:0 5px 12px rgba(47,128,237,.18); }.btn-primary:hover { background:var(--blue-2); }.btn-ghost { background:#fff; color:#5a6777; border-color:#dfe5ec; }.btn-ghost:hover { border-color:#aebdcd; color:var(--blue); }
.panel { background:#fff; border:1px solid #edf0f4; border-radius:9px; box-shadow:0 3px 12px rgba(22,35,54,.025); }.hero-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(300px,.8fr); gap:16px; }.current-panel { padding:22px 24px 20px; }.panel-kicker { display:flex; align-items:center; gap:9px; color:#334156; font-weight:600; font-size:13px; }.kicker-icon { width:27px; height:27px; display:grid; place-items:center; border-radius:7px; font-size:16px; }.kicker-icon.blue { color:var(--blue); background:#eaf3ff; }.live-label { margin-left:auto; color:#2d9d65; font-size:11px; font-weight:500; display:flex; align-items:center; gap:5px; }.live-label i { width:6px; height:6px; border-radius:50%; background:#35b978; }.current-main { padding:22px 8px 18px; display:flex; justify-content:space-between; align-items:center; }.eyebrow { display:block; color:#9aa5b2; font-size:10px; letter-spacing:.5px; text-transform:uppercase; }.period-number { display:inline-block; margin-top:8px; font-size:28px; letter-spacing:1px; color:#26364a; }.period-state { margin-left:12px; vertical-align:5px; }.countdown { text-align:right; }.countdown span { display:block; color:#909baa; font-size:11px; }.countdown strong { display:block; margin-top:5px; font-size:26px; color:#243952; letter-spacing:1px; }.countdown small { display:block; color:#abb4c0; margin-top:3px; font-size:10px; }.divider { height:1px; background:var(--line); }.status-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; padding-top:19px; }.status-tile { padding:12px 13px; background:#f9fbfd; border-radius:7px; }.status-tile-head { display:flex; align-items:center; justify-content:space-between; color:#84909f; font-size:11px; }.status-tile strong { display:block; margin-top:7px; color:#2f3f52; font-size:15px; }.status-tile small { display:block; margin-top:4px; color:#a4adba; font-size:10px; }.status-dot { display:inline-block; width:8px; height:8px; border-radius:50%; background:#b9c1cb; }.status-dot.green { background:#32b476; box-shadow:0 0 0 3px #e5f7ed; }.status-dot.orange { background:#eca139; box-shadow:0 0 0 3px #fff3df; }.status-dot.red { background:#df6262; box-shadow:0 0 0 3px #ffebeb; }.status-dot.blue { background:#4a94ed; box-shadow:0 0 0 3px #e8f2ff; }
.recent-panel { padding:20px 20px 15px; }.panel-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }.panel-title-row h3 { margin:0; color:#2c3b4d; font-size:14px; }.panel-title-row small { display:block; margin-top:5px; color:#a0a9b4; font-size:10px; }.link-btn, .more-btn { border:0; color:var(--blue); background:transparent; display:inline-flex; align-items:center; gap:4px; padding:1px 0; font-size:11px; white-space:nowrap; }.link-btn svg, .more-btn svg { width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:1.8; }.mini-draw-list { margin-top:15px; }.mini-draw-row { min-height:28px; display:grid; grid-template-columns:1fr 27px 27px 27px 27px; align-items:center; color:#6d7886; font-size:10px; }.mini-draw-row > span:first-child { color:#8f9aa7; }.ball { min-width:22px; height:22px; padding:0 3px; border-radius:50%; display:inline-grid; place-items:center; font-size:10px; font-weight:700; }.ball.red { background:#fff0ee; color:#e05858; }.ball.green { background:#e7f8ee; color:#26a968; }.ball.purple { background:#f0edff; color:#8969dc; }.ball.gray { background:#f0f3f6; color:#637384; }.recent-footer { margin:13px -20px -15px; padding:13px 20px; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; color:#8a95a2; font-size:10px; }.trend-tags { display:flex; gap:5px; }.tag { border-radius:4px; padding:3px 5px; font-size:10px; }.tag.red { color:#df5c5c; background:#fff0ee; }.tag.green { color:#25a666; background:#e9f8ef; }.tag.purple { color:#8565d6; background:#f0edff; }
.metrics-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-top:16px; }.metric-card { background:#fff; border:1px solid #edf0f4; border-radius:8px; padding:17px 18px 15px; min-width:0; }.metric-head { display:flex; justify-content:space-between; align-items:center; color:#8c97a5; font-size:11px; }.metric-icon { width:23px; height:23px; display:grid; place-items:center; border-radius:6px; font-weight:700; font-size:13px; }.metric-icon.up { color:#2ba76a; background:#e8f8ef; }.metric-icon.down { color:#e25f5f; background:#fff0f0; }.metric-icon.warn { color:#e59431; background:#fff5e5; }.metric-icon.neutral { color:#4e91df; background:#eaf3ff; }.metric-card > strong { display:block; margin-top:10px; color:#293a4e; font-size:20px; letter-spacing:.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.metric-card > small { display:block; margin-top:8px; color:#a4adb8; font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.metric-meta.up { color:#29a567; }.metric-meta.down { color:#e25f5f; }.metric-meta.warn { color:#e59431; }
.dashboard-columns, .two-col { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:16px; margin-top:16px; }.finance-panel, .shortcut-panel, .event-panel { padding:20px 22px; }.finance-panel .more-btn { color:#8a97a7; }.finance-list { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; padding:21px 0 18px; }.finance-list > div { border-right:1px solid var(--line); padding-left:5px; }.finance-list > div:last-child { border:0; }.finance-list span { display:block; color:#929dac; font-size:11px; }.finance-list strong { display:block; margin-top:7px; color:#2f3e51; font-size:17px; }.finance-list strong small { font-size:10px; color:#aab3bf; font-weight:400; }.text-green { color:#2aa467!important; }.text-red { color:#dd5e5e!important; }.text-orange { color:#df8d2d!important; }.text-blue { color:var(--blue)!important; }.finance-chart { border-top:1px solid var(--line); padding-top:15px; }.chart-label { display:flex; justify-content:space-between; color:#8793a2; font-size:10px; }.chart-label small { color:#b1bac4; }.sparkline { width:100%; height:78px; margin-top:6px; overflow:visible; }.shortcut-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:20px; }.shortcut { padding:14px 9px; border:1px solid #eef1f5; background:#fbfcfd; border-radius:8px; display:flex; flex-direction:column; align-items:flex-start; gap:9px; position:relative; color:#566476; font-size:11px; }.shortcut:hover { border-color:#cad8ec; background:#f8fbff; }.shortcut > svg { position:absolute; right:8px; bottom:9px; width:12px; height:12px; fill:none; stroke:#a6afbb; stroke-width:1.8; }.shortcut-icon { width:27px; height:27px; display:grid; place-items:center; border-radius:7px; font-weight:700; font-size:15px; }.shortcut-icon.blue { color:#3887e6; background:#e9f3ff; }.shortcut-icon.orange { color:#e99030; background:#fff3e1; }.shortcut-icon.purple, .shortcut-icon.indigo { color:#8867d7; background:#f0edff; }.shortcut-icon.red { color:#df6565; background:#fff0f0; }.shortcut-icon.green { color:#25a66a; background:#e8f8ef; }.event-panel { margin-top:16px; }.event-list { margin-top:17px; }.event { display:flex; align-items:center; gap:11px; min-height:50px; border-bottom:1px solid #f0f2f5; }.event:last-child { border-bottom:0; }.event-icon { flex:0 0 25px; width:25px; height:25px; display:grid; place-items:center; border-radius:50%; font-weight:700; }.event-icon.green { color:#27a468; background:#e8f8ef; }.event-icon.orange { color:#e59431; background:#fff3df; }.event-icon.blue { color:#3f89df; background:#eaf3ff; }.event b { font-size:11px; color:#4a596a; }.event p { margin:4px 0 0; color:#9ca6b1; font-size:10px; }.event time { margin-left:auto; color:#adb6c0; font-size:10px; }
.badge { display:inline-flex; align-items:center; gap:5px; padding:3px 7px; border-radius:4px; font-size:10px; line-height:1.2; white-space:nowrap; }.badge i { width:5px; height:5px; border-radius:50%; background:currentColor; }.badge-success { color:#20985b; background:var(--green-soft); }.badge-orange { color:#d58522; background:var(--orange-soft); }.badge-danger, .badge-red { color:#d55454; background:var(--red-soft); }.badge-purple { color:#7b5fc2; background:var(--purple-soft); }.badge-blue { color:#347fcf; background:#eaf3ff; }.badge-gray { color:#7f8a98; background:#f0f3f6; }
.summary-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(175px,1fr)); gap:12px; margin-bottom:16px; }.summary-strip > div { background:#fff; border:1px solid #edf0f4; border-radius:8px; padding:16px 18px; }.summary-strip span, .summary-strip small { display:block; color:#8c97a5; font-size:11px; }.summary-strip strong { display:inline-block; margin-top:8px; color:#2d3d50; font-size:22px; }.summary-strip small { display:inline-block; margin-left:10px; color:#acb5c0; }.table-panel { overflow:hidden; }.filter-bar { display:flex; align-items:center; gap:9px; padding:16px 18px; border-bottom:1px solid var(--line); }.search-box { height:34px; min-width:290px; display:flex; align-items:center; gap:8px; padding:0 11px; border:1px solid #e0e6ed; border-radius:6px; color:#9da8b4; background:#fff; }.search-box svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.7; }.search-box input { border:0; outline:0; flex:1; min-width:0; color:#4c5a6a; font-size:11px; }.search-box input::placeholder { color:#a9b2bd; }.search-box kbd { color:#a9b2bd; border:1px solid #e5e9ee; border-radius:3px; padding:2px 4px; font-size:9px; }.filter-tabs { display:flex; gap:5px; margin-right:auto; }.filter-tab { border:0; background:transparent; color:#8c98a5; border-radius:5px; padding:7px 10px; font-size:11px; }.filter-tab:hover { background:#f4f7fb; }.filter-tab.active { color:var(--blue); background:#edf5ff; font-weight:600; }.table-scroll { overflow:auto; scrollbar-color:#75879a #e7edf3; scrollbar-width:auto; }.table-scroll::-webkit-scrollbar { height:18px; }.table-scroll::-webkit-scrollbar-track { background:#e7edf3; border-radius:10px; box-shadow:inset 0 0 0 1px #d6e0ea; }.table-scroll::-webkit-scrollbar-thumb { background:#75879a; border:3px solid #e7edf3; border-radius:10px; }.table-scroll::-webkit-scrollbar-thumb:hover { background:#4f6479; }.sticky-table-scrollbar { position:fixed; bottom:max(8px, env(safe-area-inset-bottom)); z-index:90; height:20px; overflow-x:auto; overflow-y:hidden; border:1px solid #cfdae5; border-radius:10px; background:#e7edf3; box-shadow:0 4px 15px rgba(30,53,78,.22); scrollbar-color:#58718a #e7edf3; scrollbar-width:auto; }.sticky-table-scrollbar[hidden] { display:none; }.sticky-table-scrollbar::-webkit-scrollbar { height:18px; }.sticky-table-scrollbar::-webkit-scrollbar-track { background:#e7edf3; border-radius:10px; }.sticky-table-scrollbar::-webkit-scrollbar-thumb { background:#58718a; border:3px solid #e7edf3; border-radius:10px; }.sticky-table-scrollbar:hover::-webkit-scrollbar-thumb { background:#36536e; }.sticky-table-scrollbar-spacer { height:1px; min-width:100%; }.table-panel table { width:100%; border-collapse:collapse; min-width:980px; }.table-panel th { text-align:left; color:#9ba5b1; background:#fbfcfd; font-size:10px; font-weight:500; padding:12px 15px; border-bottom:1px solid var(--line); white-space:nowrap; }.table-panel td { padding:13px 15px; color:#687587; font-size:11px; border-bottom:1px solid #f0f2f5; white-space:nowrap; }.table-panel tbody tr:hover { background:#fbfdff; }.player-cell { display:flex; align-items:center; gap:9px; min-width:150px; }.player-cell b { display:block; color:#3c4c60; font-weight:600; }.player-cell small { display:block; color:#a3adb8; font-size:9px; margin-top:4px; }.avatar-1 { background:linear-gradient(145deg,#f5af72,#d87947); }.avatar-2 { background:linear-gradient(145deg,#73b8dc,#4185ba); }.avatar-3 { background:linear-gradient(145deg,#b58fe5,#7d57bd); }.avatar-4 { background:linear-gradient(145deg,#74c8aa,#349d79); }.avatar-5 { background:linear-gradient(145deg,#f19b95,#d86061); }.avatar-6 { background:linear-gradient(145deg,#8bb4e8,#5374bb); }.avatar-7 { background:linear-gradient(145deg,#efc97e,#c69034); }.avatar-agent { background:#eaf3ff; color:#3a84dd; }.row-actions { display:flex; gap:4px; }.row-actions button, .table-link, .tiny-btn { border:0; background:transparent; color:var(--blue); font-size:10px; padding:3px 5px; }.row-actions button:hover, .table-link:hover { color:var(--blue-2); text-decoration:underline; }.table-footer { display:flex; align-items:center; justify-content:space-between; padding:12px 18px; color:#9ba5b1; font-size:10px; }.pagination { display:flex; align-items:center; gap:4px; }.pagination button { min-width:25px; height:25px; padding:0 6px; border:1px solid transparent; background:#fff; border-radius:4px; color:#8a96a4; font-size:10px; }.pagination button:hover { border-color:#dce5ef; }.pagination button.active { background:#eaf3ff; color:var(--blue); font-weight:600; }.pagination select { margin-left:8px; height:26px; border:1px solid #e2e7ed; border-radius:4px; color:#8995a2; font-size:10px; }.mini-panel { padding:20px; }.review-row, .bet-row { display:flex; align-items:center; gap:10px; border-bottom:1px solid #f0f2f5; padding:13px 0; }.review-row:last-child, .bet-row:last-child { border:0; }.review-avatar { width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:#f0edff; color:#7b5fc2; font-weight:700; font-size:11px; }.review-info { flex:1; }.review-info b { display:block; color:#4c5a6a; font-size:11px; }.review-info small { display:block; color:#a3adb8; font-size:9px; margin-top:3px; }.review-row > strong { color:#344459; font-size:12px; }.tiny-btn { border:1px solid #d9e8fa; background:#f3f8ff; border-radius:4px; padding:4px 8px; }.bet-time { color:#a2acb7; font-size:10px; }.bet-row b { min-width:32px; color:#526173; font-size:11px; }.bet-content { flex:1; color:#4a8ad7; }.bet-row strong { color:#374a60; font-size:11px; }
.current-period-bets-panel { box-sizing:border-box; height:250px; min-height:250px; display:flex; flex-direction:column; overflow:hidden; contain:layout paint; }.current-period-bets-panel > .panel-title-row { flex:0 0 auto; }.current-period-bets-list { height:156px; min-height:156px; margin-top:auto; overflow:hidden; }.current-period-bets-list .bet-row { box-sizing:border-box; flex:0 0 52px; height:52px; min-height:52px; padding:0; }.current-period-bets-list .bet-content { min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.current-period-bets-empty { height:156px; display:grid; place-items:center; color:#a2acb7; font-size:11px; }
.player-primary-actions { gap:7px; white-space:nowrap; }.player-management-section { margin:15px 0; padding:13px 14px; border:1px solid #e8eef5; border-radius:7px; background:#fbfdff; }.player-management-section .detail-list-title { margin:0 0 10px; }.player-management-actions { display:flex; flex-wrap:wrap; gap:7px; }.player-management-actions .tiny-btn { min-height:27px; }.player-management-actions .danger-link { color:#d55454; border-color:#f4dede; background:#fff7f7; }
.report-filter-bar { flex-wrap:wrap; }.report-filter-bar .filter-tabs { margin-right:0; }.report-date-range { display:flex; align-items:center; gap:7px; color:#99a5b1; font-size:10px; }.report-date-range input { height:33px; border:1px solid #e0e6ed; border-radius:5px; padding:0 8px; color:#5d6d7e; background:#fff; font-size:10px; }.report-date-range .btn { min-height:33px; }.report-type-tabs { margin-left:auto; }.report-summary { margin:16px 18px 0; }.report-summary > div { padding:12px 14px; }.report-summary strong { font-size:17px; }.player-pnl-report { margin-bottom:16px; }
.game-hero { display:flex; justify-content:space-between; align-items:center; background:linear-gradient(110deg,#153760,#1f5a9f); border-radius:9px; padding:22px 27px; color:#fff; margin-bottom:16px; box-shadow:0 9px 22px rgba(27,73,128,.13); }.game-hero .eyebrow { color:#acd0fa; }.game-hero h2 { margin:7px 0 5px; font-size:22px; }.game-hero p { margin:0; color:#c2dbf5; font-size:11px; }.game-open-state { padding:12px 17px; border:1px solid rgba(255,255,255,.2); border-radius:8px; display:grid; grid-template-columns:10px 1fr; column-gap:8px; align-items:center; }.game-open-state .status-dot { grid-row:span 2; }.game-open-state b { font-size:11px; }.game-open-state small { grid-column:2; margin-top:4px; color:#b6d4f3; font-size:9px; }.subnav { padding:16px 18px; display:flex; justify-content:space-between; border-bottom:1px solid var(--line); }.limit-notice { margin:15px 18px; padding:12px 14px; display:flex; gap:9px; color:#5881ad; background:#eef6ff; border:1px solid #deedff; border-radius:6px; }.limit-notice > span { color:#4a91e8; }.limit-notice b { display:block; font-size:11px; }.limit-notice small { display:block; margin-top:4px; color:#8ba8c5; font-size:10px; }.game-table { min-width:780px!important; }.game-name { display:inline-block; min-width:31px; color:#4a596b; font-weight:700; font-size:14px; }.red-text { color:#e05b5b; }.green-text { color:#29a467; }.purple-text { color:#8867d8; }.table-input, .money-input input { width:75px; border:1px solid #e2e7ed; border-radius:4px; padding:6px 8px; color:#4a596b; outline:0; font-size:11px; }.table-input:focus, .money-input input:focus { border-color:#8fbaf0; box-shadow:0 0 0 2px #eaf3ff; }.money-input { display:inline-flex; align-items:center; border:1px solid #e2e7ed; border-radius:4px; padding-left:7px; color:#a1aab6; }.money-input input { border:0; width:64px; padding-left:4px; }.switch { display:inline-block; position:relative; width:31px; height:18px; }.switch input { opacity:0; width:0; height:0; }.switch span { position:absolute; inset:0; background:#cbd3dc; border-radius:20px; transition:.2s; }.switch span:before { content:''; position:absolute; height:14px; width:14px; left:2px; top:2px; background:#fff; border-radius:50%; transition:.2s; box-shadow:0 1px 2px rgba(0,0,0,.12); }.switch input:checked + span { background:#35b878; }.switch input:checked + span:before { transform:translateX(13px); }.game-bottom { margin-top:16px; }.rule-panel, .note-panel { padding:20px; }.rule-chip { color:#65809e; background:#eff5fb; padding:4px 7px; border-radius:4px; font-size:10px; }.rule-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; margin-top:19px; }.rule-grid > div { text-align:center; }.rule-ball { width:31px; height:31px; border-radius:50%; margin:auto; display:grid; place-items:center; font-weight:700; font-size:11px; }.rule-ball.purple { color:#7d60c8; background:#f0edff; }.rule-ball.red { color:#de5b5b; background:#fff0ee; }.rule-ball.green { color:#239e64; background:#e8f8ef; }.rule-ball.gray { color:#647487; background:#f0f3f6; }.rule-grid p { margin:8px 0 0; color:#8d98a6; font-size:10px; white-space:nowrap; }.usage { margin-top:20px; }.usage > div:not(.progress) { display:flex; justify-content:space-between; color:#7d8998; font-size:11px; }.usage > div:not(.progress) b { color:#3b82d7; }.progress { height:7px; border-radius:8px; background:#edf1f5; margin:8px 0 20px; overflow:hidden; }.progress i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#5aa1f2,#2d7fdf); }.usage p { margin:8px 0 0; padding-top:14px; border-top:1px solid var(--line); color:#a0aab5; font-size:10px; line-height:1.6; }
.draw-status-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:16px; }.draw-state-card, .source-card { padding:21px 23px; }.draw-state-head { display:flex; justify-content:space-between; align-items:flex-start; }.draw-state-head h2 { margin:7px 0 0; font-size:27px; color:#2d4056; }.draw-progress { margin-top:23px; }.draw-progress-label { display:flex; justify-content:space-between; color:#8c97a5; font-size:11px; }.draw-progress-label b { color:#e18b2a; font-size:15px; }.draw-progress .progress { margin:9px 0 7px; height:8px; }.draw-progress small { color:#a5afbb; font-size:10px; }.draw-actions { display:flex; gap:8px; margin-top:20px; }.source-row { display:flex; align-items:center; gap:10px; padding:15px 0; border-bottom:1px solid #f0f2f5; }.source-row:last-child { border:0; }.source-logo { width:27px; height:27px; border-radius:7px; display:grid; place-items:center; color:#fff; background:#3e93e8; font-weight:700; }.source-logo.alt { color:#8a98a6; background:#f1f3f5; }.source-row > div { flex:1; }.source-row b { display:block; font-size:11px; color:#4e5c6d; }.source-row small { display:block; margin-top:4px; color:#a1abb6; font-size:9px; }.table-title { padding:18px 18px 14px; border-bottom:1px solid var(--line); align-items:center; }.draw-balls { display:flex; gap:4px; }.draw-balls .ball { min-width:24px; height:24px; }.current-label { display:inline-block; margin-left:8px; padding:3px 5px; color:#3786dc; background:#eaf3ff; border-radius:3px; font-size:9px; }.settle-panel { margin-top:16px; padding:20px 23px; }.settle-stats { display:grid; grid-template-columns:repeat(5,1fr); margin-top:20px; }.settle-stats > div { border-right:1px solid var(--line); padding-left:17px; }.settle-stats > div:first-child { padding-left:0; }.settle-stats > div:last-child { border:0; }.settle-stats span { display:block; color:#929eab; font-size:10px; }.settle-stats strong { display:block; margin-top:8px; color:#33445a; font-size:17px; }.settle-stats small { color:#aab3be; font-size:10px; }
.compact-metrics { grid-template-columns:repeat(4,1fr); margin-top:0; margin-bottom:16px; }.type-label { font-size:10px; }.type-label.green { color:#29a467; }.type-label.orange { color:#df8d2d; }.type-label.red { color:#d95757; }.mono { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px!important; color:#778596!important; }.rule-line { display:flex; align-items:center; gap:11px; margin-top:16px; padding:13px 15px; background:#f8fbfd; color:#7c8998; font-size:11px; }.rule-line b { color:#3b8b63; font-weight:500; }.check-mark { width:17px; height:17px; border-radius:50%; display:inline-grid; place-items:center; color:#239c63; background:#e4f7ed; font-size:10px; }.rule-time { margin-left:auto; color:#a6b0bb; font-size:10px; }
.account-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }.account-card { background:#fff; border:1px solid #edf0f4; border-radius:8px; padding:17px 17px 14px; }.account-card-top { display:flex; justify-content:space-between; align-items:center; }.account-type-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; font-weight:700; font-size:16px; }.account-type-icon.wallet { color:#3991e5; background:#eaf3ff; }.account-type-icon.link { color:#825ed0; background:#f0edff; }.account-type-icon.notice { color:#e1902d; background:#fff3df; }.account-type-icon.muted { color:#9ca6b3; background:#f0f3f6; }.account-card h3 { margin:14px 0 5px; color:#37485c; font-size:13px; }.account-type { color:#9ba5b1; font-size:10px; }.account-binding { padding:14px 0; margin-top:12px; border-top:1px solid var(--line); }.account-binding span { display:block; margin-top:10px; color:#9ca6b1; font-size:10px; }.account-binding span:first-child { margin-top:0; }.account-binding b { display:block; margin-top:5px; color:#607084; font-size:11px; font-weight:500; }.account-function { display:grid; gap:5px; padding:12px; border-radius:6px; background:#f8fbff; border:1px solid #e9f1fb; }.account-function > span { color:#7f94aa; font-size:10px; font-weight:600; }.account-function small { color:#708095; font-size:9px; line-height:1.55; }.account-function small b { color:#526b85; }.account-function .account-never { color:#9a7b65; }.account-function .account-live { color:#27875a; }.account-card-footer { display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--line); padding-top:12px; margin-top:12px; }.account-card-footer small { color:#a3adb8; font-size:9px; }.account-bottom { margin-top:16px; }.group-list { margin-top:13px; }.group-row { display:flex; align-items:center; gap:9px; min-height:57px; border-bottom:1px solid #f0f2f5; }.group-row:last-child { border:0; }.group-avatar { width:29px; height:29px; display:grid; place-items:center; border-radius:8px; font-weight:700; }.group-avatar.blue { color:#3d89df; background:#eaf3ff; }.group-avatar.purple { color:#8160cb; background:#f0edff; }.group-avatar.gray { color:#8d99a6; background:#f0f3f6; }.group-row > div { flex:1; }.group-row b { display:block; color:#526173; font-size:11px; }.group-row small { display:block; margin-top:4px; color:#a6afb9; font-size:9px; }.group-msg { color:#9da8b4; font-size:10px; }.notice-list { margin-top:13px; }.notice-list > div { display:flex; align-items:center; gap:9px; padding:12px 0; border-bottom:1px solid #f0f2f5; }.notice-list > div:last-child { border:0; }.notice-icon { width:25px; height:25px; display:grid; place-items:center; border-radius:7px; font-weight:700; }.notice-icon.blue { color:#3c87dd; background:#eaf3ff; }.notice-icon.orange { color:#df8c2d; background:#fff3df; }.notice-icon.green { color:#27a466; background:#e8f8ef; }.notice-list p { flex:1; margin:0; }.notice-list b { display:block; color:#536275; font-size:10px; }.notice-list small { display:block; color:#a3adb8; margin-top:4px; font-size:9px; }.notice-list time { color:#aab3bd; font-size:9px; }
.license-hero { display:flex; align-items:center; gap:16px; padding:24px 26px; background:linear-gradient(110deg,#fff,#f6fbff); }.license-icon { width:47px; height:47px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#32b477; font-size:22px; box-shadow:0 7px 16px rgba(50,180,119,.2); }.license-hero h2 { margin:6px 0 5px; color:#2d4055; font-size:20px; }.license-hero p { margin:0; color:#8f9ba9; font-size:11px; }.license-expiry { margin-left:auto; min-width:160px; padding-left:26px; border-left:1px solid #e5edf3; }.license-expiry span, .license-expiry small { display:block; color:#9ba6b2; font-size:10px; }.license-expiry strong { display:block; margin:6px 0; color:#3181da; font-size:17px; }.info-panel { padding:20px; }.capability-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:13px; margin-top:20px; color:#607082; font-size:11px; }.capability-grid > div { display:flex; align-items:center; gap:8px; }.environment-list { margin-top:14px; }.environment-list > div { display:flex; align-items:center; justify-content:space-between; padding:12px 0; border-bottom:1px solid #f0f2f5; color:#8f9aa7; font-size:10px; }.environment-list > div:last-child { border:0; }.environment-list b { color:#566577; font-size:11px; font-weight:500; }
.settings-layout { display:grid; grid-template-columns:180px minmax(0,1fr); gap:16px; align-items:start; }.settings-nav { padding:9px; background:#fff; border:1px solid #edf0f4; border-radius:8px; }.settings-nav-item { width:100%; min-height:39px; text-align:left; border:0; background:transparent; color:#8995a3; padding:0 12px; border-radius:6px; font-size:11px; }.settings-nav-item.active { color:var(--blue); background:#edf5ff; font-weight:600; }.settings-content { min-width:0; }.settings-section { padding:21px; margin-bottom:16px; }.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; margin-top:22px; }.form-grid label, .drawer-form label { display:block; }.form-grid label > span, .drawer-form label > span { display:block; margin-bottom:7px; color:#738092; font-size:10px; }.form-grid input, .form-grid select, .drawer-form input, .drawer-form select, .drawer-form textarea { width:100%; min-height:35px; border:1px solid #e0e6ed; outline:0; border-radius:5px; padding:0 10px; color:#566577; background:#fff; font-size:11px; }.drawer-form textarea { padding-top:9px; min-height:73px; resize:vertical; }.form-grid input:focus, .form-grid select:focus, .drawer-form input:focus, .drawer-form select:focus, .drawer-form textarea:focus { border-color:#8eb9ee; box-shadow:0 0 0 2px #eaf3ff; }.setting-row { display:flex; justify-content:space-between; align-items:center; margin-top:22px; padding-top:17px; border-top:1px solid var(--line); }.setting-row b { display:block; color:#59697b; font-size:11px; }.setting-row small { display:block; margin-top:5px; color:#a2acb7; font-size:10px; }.api-callout { display:flex; align-items:center; gap:10px; margin-top:19px; padding:12px; border-radius:6px; background:#f1f8ff; border:1px solid #e0effe; }.callout-icon { width:26px; height:26px; display:grid; place-items:center; border-radius:7px; color:#fff; background:#3d8de6; font-weight:700; }.api-callout > div { flex:1; }.api-callout b { display:block; color:#4d6f98; font-size:11px; }.api-callout p { margin:4px 0 0; color:#8aa5c2; font-size:10px; }.endpoint-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:17px; }.endpoint-grid > div { padding:10px 11px; background:#fafbfd; border:1px solid #eef1f4; border-radius:5px; }.endpoint-grid span { display:block; color:#8995a2; font-size:10px; }.endpoint-grid code { display:block; margin-top:6px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#557393; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; }.endpoint-table { margin-top:17px; border:1px solid #edf0f4; border-radius:6px; overflow:hidden; }.endpoint-table-head, .endpoint-table-row { display:grid; grid-template-columns:1.1fr 60px 1.8fr 68px; align-items:center; gap:10px; padding:10px 12px; }.endpoint-table-head { color:#9ca6b1; background:#fafbfd; font-size:9px; }.endpoint-table-row { border-top:1px solid #f0f2f5; color:#607082; font-size:10px; }.endpoint-table-row code { color:#597695; font-size:9px; }.method { color:#2d82d9; font-size:9px; font-weight:600; }.endpoint-more { margin-top:13px; }.source-config-row { display:flex; align-items:center; gap:14px; padding:13px 0; border-bottom:1px solid #f0f2f5; }.source-config-row:last-child { border:0; }.source-config-row > div { flex:1; }.source-config-row b { display:block; color:#566577; font-size:11px; }.source-config-row small { display:block; margin-top:4px; color:#a1abb6; font-size:9px; }.priority { color:#8794a3; font-size:10px; }
.drawer-backdrop { position:fixed; inset:0; background:rgba(18,37,62,.28); z-index:40; }.drawer { position:fixed; top:0; right:0; bottom:0; width:min(490px,100vw); padding:26px; background:#fff; z-index:41; box-shadow:-12px 0 35px rgba(28,45,66,.13); overflow:auto; animation:slideIn .2s ease; }.small-drawer { width:min(410px,100vw); }.drawer-header { display:flex; justify-content:space-between; align-items:flex-start; }.drawer-header h2 { margin:6px 0 0; color:#2c3b4d; font-size:20px; }.icon-btn { width:30px; height:30px; display:grid; place-items:center; border:1px solid #e3e8ee; border-radius:6px; background:#fff; color:#84909e; }.icon-btn svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; }.drawer-desc { margin:18px 0; color:#8b97a5; line-height:1.7; font-size:11px; }.drawer-list { border:1px solid #edf0f4; border-radius:7px; overflow:hidden; }.drawer-item { display:grid; grid-template-columns:1.1fr 1.4fr auto; gap:10px; align-items:center; padding:13px; border-bottom:1px solid #f0f2f5; }.drawer-item:last-child { border:0; }.drawer-item b { display:block; color:#546477; font-size:11px; }.drawer-item small { display:block; color:#a4adb8; margin-top:4px; font-size:9px; }.drawer-item code { color:#567596; font-size:9px; }.drawer-foot { margin-top:22px; color:#7f8c9b; font-size:11px; }.event-chips { display:flex; flex-wrap:wrap; gap:5px; margin-top:10px; }.event-chips code { padding:4px 6px; border-radius:4px; background:#f1f5f8; color:#6f8194; font-size:9px; }.drawer-form { margin-top:25px; display:grid; gap:17px; }.drawer-user { display:flex; align-items:center; gap:10px; padding:12px; border-radius:6px; background:#f8fafc; }.drawer-user b { display:block; color:#526173; font-size:12px; }.drawer-user small { display:block; color:#9da8b3; margin-top:4px; font-size:10px; }.drawer-money { display:flex; align-items:center; border:1px solid #e0e6ed; border-radius:5px; padding-left:10px; color:#9aa5b1; }.drawer-money input { border:0; box-shadow:none!important; }.drawer-warning { padding:10px 11px; border-radius:5px; background:#fff6e8; color:#b97825; font-size:10px; line-height:1.6; }.blue-note { background:#eff7ff; color:#5a84ae; }.drawer-actions { position:sticky; bottom:0; display:flex; justify-content:flex-end; gap:8px; padding-top:25px; margin-top:25px; background:#fff; }.toast { position:fixed; right:27px; bottom:28px; z-index:80; display:flex; align-items:center; gap:9px; padding:12px 16px; color:#fff; border-radius:7px; background:#213a58; box-shadow:0 10px 22px rgba(20,43,70,.18); font-size:12px; animation:toastIn .2s ease; }.toast > span { width:18px; height:18px; display:grid; place-items:center; border-radius:50%; background:#31b878; color:#fff; font-weight:700; }.toast-error > span { background:#df6262; }.mobile-overlay { display:none; }
.detail-summary-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }.detail-summary-grid > div { padding:12px; border:1px solid #edf1f5; border-radius:7px; background:#fafcfe; }.detail-summary-grid span,.detail-meta span { display:block; color:#98a3af; font-size:9px; }.detail-summary-grid strong { display:block; margin-top:6px; color:#405268; font-size:14px; }.detail-meta { display:grid; grid-template-columns:80px 1fr; gap:8px 12px; padding:13px; border:1px solid #edf1f5; border-radius:7px; }.detail-meta b { color:#5d6d7f; font-size:10px; }.detail-list-title { display:flex; justify-content:space-between; align-items:center; }.detail-list-title b { color:#526173; font-size:11px; }.detail-list-title small { color:#9da8b3; font-size:9px; }.detail-list { border:1px solid #edf1f5; border-radius:7px; overflow:hidden; }.detail-list > div { display:grid; grid-template-columns:1.4fr 1fr auto; gap:9px; align-items:center; padding:10px; border-bottom:1px solid #f0f2f5; font-size:9px; }.detail-list > div:last-child { border:0; }.detail-list span { color:#9aa5b1; }.detail-list b { color:#617184; }.batch-rule-tags { display:flex; flex-wrap:wrap; gap:6px; }.batch-rule-tags span { padding:5px 8px; border-radius:5px; background:#f1f6fc; color:#5f7fa2; font-size:10px; }
.player-bet-history { display:grid; gap:8px; }.player-bet-record { padding:11px; border:1px solid #e7edf3; border-radius:7px; background:#fbfcfe; }.player-bet-record header { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }.player-bet-record header b { display:block; color:#506178; font-size:11px; }.player-bet-record header small { display:block; margin-top:4px; color:#98a5b2; font-size:9px; word-break:break-all; }.player-bet-record p { margin:9px 0; color:#607287; font-size:10px; line-height:1.65; word-break:break-word; }.player-bet-record p > b { margin-right:4px; color:#526e8a; }.bet-draw-result { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:-1px 0 9px; padding:7px 8px; border-radius:5px; color:#54708d; background:#edf6ff; font-size:10px; font-weight:600; }.draw-result-chips { display:flex; flex-wrap:wrap; gap:4px; }.draw-result-chips b { min-width:20px; padding:2px 4px; border:1px solid #cadff4; border-radius:4px; color:#486b8d; background:#fff; text-align:center; font-size:9px; }.player-bet-record footer { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:5px 12px; align-items:center; padding-top:9px; border-top:1px solid #e8eef5; color:#98a5b2; font-size:9px; }.player-bet-record footer b { color:#526e8a; }.player-bet-record footer b.text-green, .bet-settlement-result.text-green { color:#20985b; }.player-bet-record footer b.text-red, .bet-settlement-result.text-red { color:#d55454; }.bet-settlement-result { grid-column:2; justify-self:end; font-weight:600; }.history-load-more { width:100%; margin-top:2px; }.history-complete { display:block; text-align:center; color:#95a1ad; font-size:10px; }
.draw-detail-result { display:flex; align-items:center; gap:14px; padding:15px; border-radius:8px; background:#f6faff; }.draw-detail-result .result-number { flex:0 0 48px; width:48px; height:48px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#477fd2; font-size:22px; font-weight:700; }.draw-detail-result b,.draw-detail-result strong,.draw-detail-result small { display:block; }.draw-detail-result b { color:#41566d; font-size:13px; }.draw-detail-result strong { margin-top:4px; color:#627b96; font-size:11px; }.draw-detail-result small { margin-top:5px; color:#9aa8b6; font-size:9px; }.draw-detail-totals { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }.draw-detail-totals span { padding:9px; border-radius:6px; background:#fafcfe; color:#909dab; font-size:9px; }.draw-detail-totals b { display:block; margin-top:4px; color:#52677d; font-size:11px; }
.data-error-banner { display:flex; align-items:center; gap:10px; margin-bottom:15px; padding:11px 13px; border:1px solid #ffd6d6; border-radius:7px; color:#9b4848; background:#fff5f5; font-size:11px; }.data-error-banner b { white-space:nowrap; }.data-error-banner span { flex:1; }.data-error-banner button { padding:6px 10px; border:1px solid #efbaba; border-radius:5px; color:#a24646; background:#fff; }
.identity-rule { color:#7b8da1; background:#f5f8fb; border:1px solid #e7edf3; border-radius:5px; padding:7px 9px; font-size:10px; white-space:nowrap; }.finance-scope { display:block; margin-top:4px; color:#a0aab5; font-size:9px; }.muted-value { color:#a6afb9; font-size:10px; }.finance-balance,.account-shared-login,.listener-sender { display:block; margin-top:5px; font-size:9px; }.finance-balance { color:#2e9a63; }.account-shared-login { color:#a06d27; }.listener-sender { color:#317fd2; }.schedule-bar { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:14px 17px; margin-bottom:16px; background:#f8fbff; border-color:#e0edfb; }.schedule-bar b { display:block; margin-top:5px; color:#48627e; font-size:12px; }.schedule-bar small { display:block; margin-top:4px; color:#8da4bd; font-size:9px; }.official-time-box { padding:10px 11px; border-radius:5px; background:#f2f8ff; color:#6584a4; font-size:10px; }
.agent-member-list { overflow:hidden; border:1px solid #e7edf3; border-radius:7px; }.agent-member-row { display:flex; align-items:flex-start; gap:10px; padding:11px 12px; cursor:pointer; border-bottom:1px solid #eef2f6; background:#fff; }.agent-member-row:last-child { border:0; }.agent-member-row:hover { background:#f8fbff; }.agent-member-row input { position:absolute; opacity:0; }.agent-member-check { flex:0 0 17px; width:17px; height:17px; display:grid; place-items:center; margin-top:1px; border:1px solid #cfd9e4; border-radius:4px; color:transparent; background:#fff; font-size:10px; font-weight:700; }.agent-member-row input:checked + .agent-member-check { border-color:#2f80ed; color:#fff; background:#2f80ed; }.agent-member-row b { display:block; color:#56677a; font-size:11px; }.agent-member-row small { display:block; margin-top:4px; color:#9aa7b4; font-size:9px; line-height:1.5; }
@keyframes slideIn { from { transform:translateX(20px); opacity:.6; } to { transform:translateX(0); opacity:1; } } @keyframes toastIn { from { transform:translateY(8px); opacity:0; } to { transform:translateY(0); opacity:1; } }
@media (max-width:1180px) { .sidebar { width:200px; flex-basis:200px; }.metrics-grid { grid-template-columns:repeat(3,1fr); }.hero-grid { grid-template-columns:1fr; }.recent-panel { min-height:0; }.account-cards { grid-template-columns:repeat(2,1fr); } }
@media (max-width:800px) { .sidebar { position:fixed; left:-245px; width:232px; transition:.2s ease; }.sidebar.open { left:0; }.mobile-menu { display:block; }.mobile-overlay { display:none; position:fixed; inset:0; z-index:19; background:rgba(18,37,62,.25); }.sidebar.open ~ .mobile-overlay { display:block; }.topbar { padding:0 16px; }.topbar-right .server-state, .topbar-right .top-user, .topbar-right .top-chevron, .topbar-right .customer-scope-label, .customer-scope span { display:none; }.customer-scope select { min-width:105px; max-width:135px; }.page-content { padding:23px 16px 38px; }.page-header { align-items:flex-start; gap:15px; }.page-header h1 { font-size:21px; }.page-header .btn { padding:0 10px; }.dashboard-columns, .two-col, .draw-status-grid, .settings-layout { grid-template-columns:1fr; }.metrics-grid, .summary-strip { grid-template-columns:repeat(2,1fr); }.status-grid { grid-template-columns:repeat(2,1fr); }.finance-list { grid-template-columns:repeat(2,1fr); gap:13px; }.finance-list > div:nth-child(2) { border:0; }.shortcut-grid { grid-template-columns:repeat(3,1fr); }.search-box { min-width:0; flex:1; }.filter-bar { flex-wrap:wrap; }.filter-bar .filter-tabs { order:3; width:100%; }.filter-bar .btn { margin-left:auto; }.account-cards { grid-template-columns:1fr 1fr; }.rule-grid { grid-template-columns:repeat(4,1fr); row-gap:17px; }.settle-stats { grid-template-columns:repeat(2,1fr); gap:15px; }.settle-stats > div, .settle-stats > div:first-child { border:0; padding:0; }.api-callout { align-items:flex-start; flex-wrap:wrap; }.api-callout .btn { margin-left:36px; }.endpoint-grid { grid-template-columns:1fr; } }
@media (max-width:500px) { .topbar-left { gap:7px; }.breadcrumb, .slash { display:none; }.topbar { height:60px; }.brand { height:60px; }.page-header { display:block; }.page-header .btn, .page-header-actions { margin-top:15px; }.page-header-actions .btn { margin-top:0; }.current-main { padding-left:0; padding-right:0; }.period-number { font-size:23px; }.countdown strong { font-size:21px; }.metrics-grid, .summary-strip, .account-cards { grid-template-columns:1fr 1fr; gap:9px; }.metric-card { padding:14px 12px; }.metric-card > strong { font-size:17px; }.metric-card > small { font-size:9px; }.summary-strip > div { padding:13px 12px; }.summary-strip strong { font-size:18px; }.summary-strip small { display:block; margin:5px 0 0; }.shortcut-grid { grid-template-columns:repeat(2,1fr); }.game-hero { display:block; }.game-open-state { margin-top:15px; width:max-content; }.license-hero { align-items:flex-start; flex-wrap:wrap; }.license-expiry { width:100%; margin:5px 0 0; padding:14px 0 0; border-left:0; border-top:1px solid #e5edf3; }.rule-line { flex-wrap:wrap; }.rule-time { width:100%; margin:0; }.drawer { padding:20px; }.endpoint-table-head, .endpoint-table-row { grid-template-columns:1fr 48px; }.endpoint-table-head span:nth-child(3), .endpoint-table-head span:nth-child(4), .endpoint-table-row code, .endpoint-table-row .badge { display:none; }.topbar-right .top-icon { display:block; }.page-content { padding-top:20px; } }
.btn-danger { color:#d65353; background:#fff0f0; border-color:#ffd7d7; }.btn-danger:hover { color:#fff; background:#d95353; border-color:#d95353; }
.server-state.server-degraded { color:#b77922; }.server-state.server-degraded i { background:#e3a53f; }.server-state.server-error { color:#c94d4d; }.server-state.server-error i { background:#d95757; }
.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; background:#f4f7fb; }.login-card { width:min(390px,100%); padding:34px; border:1px solid #e5ebf2; border-radius:14px; background:#fff; box-shadow:0 18px 50px rgba(36,65,99,.1); }.login-brand { height:auto; justify-content:center; color:#213b5d; }.login-card h1 { margin:28px 0 8px; color:#2c3b4d; text-align:center; font-size:22px; }.login-card > p { margin:0 0 24px; color:#8c99a7; text-align:center; font-size:11px; line-height:1.7; }.login-card form { display:grid; gap:15px; }.login-card label { color:#738092; font-size:11px; }.login-card input { display:block; width:100%; min-height:40px; margin-top:7px; padding:0 11px; border:1px solid #dfe6ee; border-radius:6px; outline:0; color:#536477; }.login-card input:focus { border-color:#75a9e5; box-shadow:0 0 0 3px #edf5ff; }.login-card .btn { width:100%; min-height:40px; margin-top:5px; }.login-card small { color:#9ca8b4; text-align:center; font-size:10px; }
.qr-placeholder { padding:24px 12px; color:#96a5b4; text-align:center; font-size:11px; }.remote-qr-image { display:block; width:220px; max-width:100%; height:auto; margin:auto; }
.danger-link { color:#d85b5b!important; }.danger-link:hover { color:#b93d3d!important; }
.review-actions { display:flex; gap:5px; margin-left:auto; }.approve-btn, .reject-btn { border-radius:4px; padding:5px 8px; font-size:10px; font-weight:600; }.approve-btn { color:#218e59; background:#eaf8ef; border:1px solid #d4efdf; }.approve-btn:hover { color:#fff; background:#2eaa6b; }.reject-btn { color:#d35555; background:#fff0f0; border:1px solid #ffdcdc; }.reject-btn:hover { color:#fff; background:#db5d5d; }.review-summary { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:16px; }.review-summary > div { padding:12px; background:#f8fafc; border-radius:6px; }.review-summary span { display:block; color:#98a3af; font-size:10px; }.review-summary strong { display:block; margin-top:7px; color:#34465b; font-size:17px; }.review-summary .badge { margin-top:7px; }.delete-confirm { display:flex; gap:11px; padding:15px; border:1px solid #ffe0e0; border-radius:7px; background:#fff8f8; }.delete-confirm-icon { flex:0 0 25px; width:25px; height:25px; display:grid; place-items:center; border-radius:50%; color:#d95757; background:#ffe5e5; font-weight:700; }.delete-confirm b { display:block; color:#8d3f3f; font-size:12px; }.delete-confirm p { margin:7px 0 0; color:#a56f6f; font-size:10px; line-height:1.6; }
.account-type-icon.manager { color:#d96d4f; background:#fff0e8; }.account-actions { display:flex; align-items:center; gap:7px; }.account-actions .table-link { padding:3px 0; }.account-actions .danger-link { border-left:1px solid #e9edf3; padding-left:8px; }.duration-quick { display:flex; align-items:center; gap:4px; }.duration-quick > span { margin-right:4px; color:#9aa5b1; font-size:10px; }.license-client-icon { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; color:#3e86d9; background:#eaf3ff; font-weight:700; font-size:11px; }.license-summary { margin-top:16px; }.license-form-intro { display:flex; align-items:center; gap:11px; padding:12px; border-radius:7px; background:#f6faff; }.license-form-intro .license-icon { width:34px; height:34px; font-size:16px; box-shadow:none; }.license-form-intro b { display:block; color:#4e6784; font-size:11px; }.license-form-intro small { display:block; margin-top:4px; color:#9aabba; font-size:9px; }.form-label { display:block; margin-bottom:8px; color:#738092; font-size:10px; }.duration-options { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }.duration-options label { position:relative; cursor:pointer; }.duration-options input { position:absolute; opacity:0; }.duration-options label > span { display:block; padding:10px 0; border:1px solid #e1e7ee; border-radius:5px; color:#738092; text-align:center; font-size:11px; }.duration-options input:checked + span { color:#2f80ed; border-color:#83b7f0; background:#edf5ff; font-weight:600; }
.account-statuses { display:flex; flex-wrap:wrap; gap:5px; justify-content:flex-end; }.login-link { color:#2f80ed!important; font-weight:600; }.source-config-list { margin-top:8px; }.source-config-note { display:flex; align-items:center; gap:8px; margin-top:14px; padding:11px 12px; border-radius:6px; color:#68809b; background:#f2f8ff; font-size:10px; }.source-config-note .check-mark { flex:0 0 17px; }.source-config-row .danger-link { margin-left:-7px; }.data-isolation-banner { display:flex; align-items:center; gap:11px; margin-top:16px; padding:13px 16px; border:1px solid #dcecff; border-radius:8px; background:#f2f8ff; }.isolation-icon { width:27px; height:27px; display:grid; place-items:center; border-radius:7px; color:#3a89e2; background:#e3f0ff; font-size:17px; }.data-isolation-banner > div { flex:1; }.data-isolation-banner b { display:block; color:#4b6f98; font-size:11px; }.data-isolation-banner p { margin:4px 0 0; color:#87a2bf; font-size:10px; }.data-isolation-banner code { color:#5b7899; font-size:9px; }.main-account-badge { color:#2e83d9; background:#e5f1ff; border-radius:4px; padding:5px 7px; font-size:9px; white-space:nowrap; }.suffix-input { display:flex; align-items:center; border:1px solid #e0e6ed; border-radius:5px; padding-right:10px; color:#92a0ae; }.suffix-input input { min-width:0; flex:1; border:0; box-shadow:none!important; }.suffix-input.compact { width:77px; padding-right:7px; }.suffix-input.compact input { width:52px; padding-left:7px; }.linked-player-title { display:flex; justify-content:space-between; align-items:flex-end; margin-top:4px; padding-top:16px; border-top:1px solid var(--line); }.linked-player-title b { color:#5c6c7e; font-size:11px; }.linked-player-title small { color:#a3adb8; font-size:9px; }.linked-player-list { border:1px solid #edf0f4; border-radius:6px; overflow:hidden; }.linked-player-row { display:flex; align-items:center; justify-content:space-between; padding:10px 11px; border-bottom:1px solid #f0f2f5; }.linked-player-row:last-child { border:0; }.linked-player-row b { display:block; color:#59697b; font-size:10px; }.linked-player-row small { display:block; margin-top:3px; color:#a2acb7; font-size:9px; }.empty-state { padding:19px 10px; color:#a3adb8; text-align:center; font-size:10px; }.qr-login-intro { display:flex; align-items:center; gap:11px; padding:12px; border-radius:7px; background:#f8fafc; }.qr-login-intro b { display:block; color:#526173; font-size:12px; }.qr-login-intro small { display:block; margin-top:4px; color:#9da8b3; font-size:10px; }.qr-box { display:grid; place-items:center; margin:18px 0 13px; padding:18px; border:1px solid #edf0f4; border-radius:8px; background:#fcfdfe; }.qr-code { width:164px; height:164px; position:relative; background:repeating-linear-gradient(0deg,#1e2f43 0 5px,#fff 5px 10px),repeating-linear-gradient(90deg,transparent 0 7px,#fff 7px 12px); background-blend-mode:multiply; box-shadow:inset 0 0 0 8px #fff; }.qr-code:before, .qr-code:after, .qr-code i { content:''; position:absolute; width:37px; height:37px; border:7px solid #1e2f43; background:#fff; box-shadow:inset 0 0 0 7px #1e2f43; }.qr-code:before { left:8px; top:8px; }.qr-code:after { right:8px; top:8px; }.qr-code i:nth-child(1) { left:8px; bottom:8px; }.qr-code i:nth-child(n+2) { display:none; }.qr-status { padding:11px 12px; border-radius:6px; background:#fff6e8; color:#bb7a29; }.qr-status b { display:inline-block; margin-left:7px; font-size:11px; }.qr-status small { display:block; margin-top:6px; color:#b89462; font-size:9px; line-height:1.5; }.notification-count { margin-top:12px; color:#9ba7b3; font-size:9px; }.notification-rule-form { display:grid; gap:12px; max-height:calc(100vh - 270px); overflow:auto; padding-right:2px; }.notification-rule { padding:12px; border:1px solid #edf0f4; border-radius:7px; background:#fff; }.notification-rule-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }.notification-rule-head b { color:#536477; font-size:11px; }.notification-inline-fields { display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:9px; }.notification-rule label > span { display:block; margin-bottom:6px; color:#8995a2; font-size:9px; }.notification-rule input, .notification-rule select, .notification-rule textarea { width:100%; min-height:31px; border:1px solid #e1e6ed; border-radius:4px; padding:7px 8px; color:#5b6b7d; outline:0; font-size:10px; background:#fff; }.notification-rule textarea { min-height:51px; resize:vertical; }.notification-scope { display:block; margin-top:8px; color:#a0aab5; font-size:9px; }
.table-scroll { scrollbar-color:#52687c #dfe7ee; scrollbar-width:auto; }
.table-scroll::-webkit-scrollbar { height:26px; }
.table-scroll::-webkit-scrollbar-track { background:#dfe7ee; border-radius:14px; box-shadow:inset 0 0 0 1px #c9d5df; }
.table-scroll::-webkit-scrollbar-thumb { min-width:64px; background:#6c7b89; border:4px solid #dfe7ee; border-radius:14px; }
.table-scroll::-webkit-scrollbar-thumb:hover { background:#3e586f; }
.sticky-table-scrollbar { bottom:max(10px, env(safe-area-inset-bottom)); height:28px; border-color:#becbd6; background:#dfe7ee; box-shadow:0 5px 18px rgba(30,53,78,.28); }
.sticky-table-scrollbar::-webkit-scrollbar { height:24px; }
.sticky-table-scrollbar::-webkit-scrollbar-track { background:#dfe7ee; border-radius:14px; box-shadow:inset 0 0 0 1px #c9d5df; }
.sticky-table-scrollbar::-webkit-scrollbar-thumb { min-width:64px; background:#5d7184; border:4px solid #dfe7ee; border-radius:14px; }
.sticky-table-scrollbar:hover::-webkit-scrollbar-thumb { background:#334f67; }

/* 新上下分申请使用现有右下角提示位；不改变抽屉、表格或页面布局。 */
.toast { max-width:min(420px,calc(100vw - 34px)); line-height:1.45; }
.toast > span { flex:0 0 18px; }
.toast-funding { border:1px solid rgba(108,190,255,.48); background:#1e4f85; box-shadow:0 12px 28px rgba(23,75,126,.28); }
.toast-funding > span { background:#52a7f7; font-size:9px; }
.rebate-rate-preview { display:block; margin-top:6px; color:#4f84b6; font-size:10px; line-height:1.45; }