@charset "UTF-8";

/* Obsidian Jade — one continuous visual system, from entry to ledger. */
:root {
  color-scheme:dark;
  --paper:#080b09; --rail:#0b100d; --surface:#101613; --surface-raised:#171f1a;
  --ink:#edf4ef; --muted:#999da6; --quiet:#737984;
  --line:#ffffff12; --line-strong:#ffffff21;
  --accent:#80dfa5; --accent-soft:#80dfa512; --green:#80dfa5; --danger:#eea69c;
  --rail-width:232px; --radius:16px;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --numbers:Arial,"Helvetica Neue",sans-serif; --serif:var(--sans);
  --ease:cubic-bezier(.22,.8,.26,1);
  font-family:var(--sans); color:var(--ink); background:var(--paper); font-size:14px;
  font-synthesis:none; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
* {box-sizing:border-box}
html {scrollbar-color:#41434a #0b100d;scrollbar-width:thin}
body {margin:0;background:var(--paper);min-width:300px}
button,input,textarea,select {font:inherit}
button,a {touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button {cursor:pointer;border:0}
button:disabled {opacity:.38;cursor:not-allowed;box-shadow:none!important;transform:none!important}
a {color:inherit;text-decoration:none}
h1,h2,h3,p {margin:0}
img {display:block;max-width:100%}
svg {flex-shrink:0}
::selection {background:#80dfa538;color:#f0fff5}
.icon {width:19px;height:19px;vertical-align:middle}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {outline:2px solid var(--accent);outline-offset:4px}
.sr-only {position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.skip {position:fixed;top:-90px;left:20px;padding:13px 18px;background:var(--accent);color:#0b1b11;z-index:101;border-radius:8px}
.skip:focus {top:14px}
.muted {color:var(--muted)}
.mono {font-family:var(--numbers);font-variant-numeric:tabular-nums}
kbd {font:10px ui-monospace,"SFMono-Regular",monospace;border:1px solid var(--line-strong);border-radius:4px;color:var(--quiet);padding:2px 5px;font-weight:400}
.boot {display:grid;place-items:center;min-height:100svh;color:var(--muted);padding:30px;text-align:center;line-height:1.8}
.boot>div {max-width:430px}
.boot .button {margin-top:24px}
.time-dot,.live-dot {display:block;width:6px;height:6px;border-radius:50%;background:var(--green);flex-shrink:0}

/* Rail */
.sidebar {position:fixed;inset:0 auto 0 0;width:var(--rail-width);padding:30px 17px 22px;background:var(--rail);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:20;transition:width 300ms var(--ease);overflow:hidden}
.brand-row {display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:34px;padding:0 4px}
.brand {display:flex;align-items:center;gap:11px;min-width:0}
.brand img {width:56px;height:43px;object-fit:contain;background:#e6efe7;border-radius:7px;padding:5px;flex-shrink:0}
.brand>span {font-size:18px;font-weight:600;white-space:nowrap;letter-spacing:.06em}
.brand>span>span {display:block;font-size:10px;font-weight:400;color:#91949a;letter-spacing:.06em;margin-top:5px}
.brand-edition {color:var(--accent);font-size:9px;letter-spacing:.19em;text-transform:uppercase}
.icon-btn {background:transparent;border-radius:8px;display:grid;place-items:center;width:36px;height:36px;color:#92969e;flex-shrink:0;transition:background .18s,color .18s}
.icon-btn:hover {background:#ffffff0a;color:var(--ink)}
.rail-toggle {width:28px;height:34px}
.rail-toggle .icon {width:16px;height:16px}
.compose-button {display:flex;align-items:center;gap:10px;min-height:45px;border:1px solid #80dfa530;border-radius:10px;background:#80dfa50d;color:#bbeccc;padding:12px 14px;font-size:13px;margin-bottom:31px;white-space:nowrap;transition:background .2s,border-color .2s}
.compose-button:hover {background:#80dfa518;border-color:#80dfa565}
.compose-button .icon {width:16px;height:16px;color:var(--accent)}
.compose-button kbd {margin-left:auto;color:#86ad94;border-color:#80dfa524}
.nav-label {font-size:10px;letter-spacing:.1em;color:#737984;padding:0 14px;margin-bottom:13px}
.nav-label>span {float:right;font-size:9px;letter-spacing:0;color:#656e7b}
.nav-item {position:relative;display:flex;align-items:center;gap:12px;min-height:46px;padding:12px 14px;border-radius:9px;font-size:13px;color:#9499a2;margin:5px 0;white-space:nowrap;transition:color .18s,background .18s}
.nav-item .icon {width:17px;height:17px;color:#747b86;transition:color .18s}
.nav-item:hover {background:#ffffff04;color:#d5dfd8}
.nav-item.active {background:#ffffff08;color:#c9f3d9}
.nav-item.active .icon {color:var(--accent)}
.nav-live-dot {width:5px;height:5px;background:var(--green);border-radius:50%;margin-left:auto}
.rail-note {padding:34px 14px;color:#8a8e97;border-top:1px solid var(--line);margin:31px 0 0}
.rail-note>span {font-size:12px;letter-spacing:.04em;color:#a6b8ac}
.rail-note p {font-size:11px;line-height:1.9;margin-top:10px;color:#747b86}
.rail-note>i {display:block;width:23px;height:1px;margin-top:19px;background:#80dfa550}
.sidebar-bottom {margin-top:auto;padding-top:30px}
.environment-note {display:flex;align-items:center;gap:8px;font-size:10px;color:#818791;padding:14px 10px;border-bottom:1px solid var(--line);margin-bottom:18px;white-space:nowrap}
.environment-note i {width:4px;height:4px;border-radius:50%;background:#7cb38c;flex-shrink:0}
.profile {display:flex;align-items:center;gap:10px;padding:0 6px;white-space:nowrap}
.avatar {display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border:1px solid #80dfa524;border-radius:11px;background:#80dfa510;font-size:14px;color:var(--accent)}
.profile b {font-size:12px;font-weight:500;display:block;color:#d4ded6}
.profile small {display:block;font-size:10px;color:#7e8590;margin-top:5px}
.profile .icon-btn {margin-left:auto;width:29px}
.profile-text {min-width:0}
.rail-collapsed {--rail-width:76px}
.rail-collapsed .sidebar {padding-inline:13px}
.rail-collapsed .brand-row {padding:0;flex-wrap:wrap;justify-content:center;margin-bottom:19px}
.rail-collapsed .brand img {width:46px;height:35px;padding:4px}
.rail-collapsed .brand>span,.rail-collapsed .brand-edition,.rail-collapsed .compose-button span,.rail-collapsed .compose-button kbd,.rail-collapsed .nav-label,.rail-collapsed .nav-item>span,.rail-collapsed .nav-live-dot,.rail-collapsed .rail-note,.rail-collapsed .environment-note>span,.rail-collapsed .profile-text {display:none}
.rail-collapsed .compose-button,.rail-collapsed .nav-item {justify-content:center;padding-inline:0}
.rail-collapsed .compose-button {margin-bottom:21px}
.rail-collapsed .profile {padding:0;flex-direction:column}
.rail-collapsed .profile .icon-btn {margin:0}
.rail-collapsed .environment-note {justify-content:center;padding-inline:0}

/* Workspace and controls */
#main {margin-left:var(--rail-width);padding:0 clamp(26px,4.2vw,72px) 64px;max-width:1920px;min-height:100vh;outline:none;transition:margin-left 300ms var(--ease)}
.workspace-topline {height:78px;display:flex;align-items:center;justify-content:space-between;color:#80858e;font-size:11px;margin-bottom:35px;border-bottom:1px solid var(--line)}
.workspace-topline i:not(.time-dot) {font-style:normal;margin:0 11px;color:#41454d}
.workspace-mark {font-size:10px;letter-spacing:.18em;color:#83a78d;text-transform:uppercase}
.workspace-time {display:flex;align-items:center;gap:9px;font-size:10px;color:#838994}
.workspace-time b {font-size:11px;font-weight:400;color:#9ecaae}
.workspace-time .time-dot {width:4px;height:4px}
.page-heading {display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:33px}
.eyebrow {font-size:11px;color:#94999f;margin-bottom:12px;letter-spacing:.035em}
h1 {font-weight:500;font-size:36px;line-height:1.35;letter-spacing:.015em;color:var(--ink)}
.title-dot {display:none}
h2 {font-size:16px;font-weight:500;line-height:1.6;color:#dfe9e1}
h3 {font-size:16px;font-weight:500;line-height:1.7;color:#dfe9e1}
.header-actions {display:flex;align-items:center;gap:10px;padding-bottom:3px}
.button {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:11px 17px;border-radius:9px;border:1px solid transparent;font-size:12px;font-weight:500;line-height:1.5;white-space:nowrap;transition:background .18s,box-shadow .18s,border-color .18s,color .18s}
.button .icon {width:16px;height:16px}
.button.primary {background:var(--accent);color:#092216;border-color:#99e8b5;box-shadow:inset 0 1px 0 #ffffff24,0 3px 8px #0003}
.button.primary:hover {background:#a0edbe;border-color:#a0edbe;box-shadow:0 4px 16px #0005}
.button.secondary {background:#ffffff04;border-color:var(--line-strong);color:#bbc8bf}
.button.secondary:hover {background:#ffffff09;border-color:#ffffff36;color:var(--ink)}
.button.full {width:100%;min-height:49px;font-size:13px}
.button.small {min-height:35px;padding:8px 12px;font-size:11px}
.button.danger {background:#653b37;color:#ffe0d9;border-color:#935a50}
.button.danger:hover {background:#77483f}
.text-btn {background:transparent;color:var(--accent);padding:8px 5px;min-height:36px;font-size:12px}
.text-btn:hover {color:#c2f9d6;text-decoration:underline;text-underline-offset:4px}
.text-btn.muted {color:#969ca5}
.danger-text {color:var(--danger)}
.icon-export .icon {width:15px}
.small-count {font-size:11px;font-weight:400;color:#92b39f;display:inline-block;margin-left:10px;vertical-align:middle;border:1px solid #80dfa524;background:#80dfa508;border-radius:20px;padding:1px 7px}
.metric-label {font-size:11px;color:#a9aaa9;line-height:18px;letter-spacing:.03em}
.subtle-label {font-size:9px;color:#6f7680;margin-left:10px;letter-spacing:.1em}

/* Monthly statement */
.monthly-overview {display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:31px 38px;padding:34px 36px 21px;margin-bottom:29px;border:1px solid #ffffff14;border-radius:var(--radius);background:linear-gradient(125deg,#171f1a 0%,#101713 70%);box-shadow:0 18px 50px #00000014}
.overview-main>strong {display:block;font-size:58px;line-height:1.15;font-weight:500;margin:20px 0 15px;color:#edf4ef}
.overview-main>p {font-size:11px;color:#858c97;line-height:1.9}
.overview-detail {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:25px;min-width:0}
.overview-detail>div {min-width:max-content;max-width:100%;flex:0 1 auto}
.overview-detail span {display:block;font-size:11px;color:#949aa4;white-space:nowrap}
.overview-detail b {display:block;font-size:23px;font-weight:400;line-height:1.25;margin-top:16px;white-space:nowrap;color:#d2e0d6}
.overview-detail small {font-family:var(--sans);font-size:11px;color:#7c8591}
.overview-live {grid-column:1/-1;display:flex;align-items:center;gap:11px;border-top:1px solid #ffffff0d;padding:19px 0 0;transition:color .2s}
.overview-live>div {display:flex;align-items:center;gap:17px}
.overview-live b {font-size:11px;font-weight:500;color:#a6c6b1}
.overview-live small {font-size:11px;color:#7e8692}
.overview-live>.icon {margin-left:auto;width:16px;color:var(--accent);transition:transform .25s var(--ease)}
.overview-live:hover>.icon {transform:translateX(4px)}

/* Data surfaces */
.panel {background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;min-width:0;box-shadow:0 12px 30px #0000000a}
.panel-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px 26px}
.panel-heading p {font-size:12px;color:var(--muted);line-height:1.8;margin-top:5px}
.panel-heading>.muted {font-size:11px;color:#8e959f}
.count-tag {font-size:11px;color:var(--muted);border:1px solid var(--line-strong);border-radius:20px;padding:4px 9px;white-space:nowrap}
.table-toolbar {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px 24px;border-bottom:1px solid var(--line);background:#111a15}
.segmented {display:flex;gap:4px;padding:4px;background:#080a0d;border:1px solid #ffffff05;border-radius:8px}
.segmented button {min-height:32px;padding:7px 16px;background:transparent;border-radius:5px;font-size:12px;color:#8f95a0;transition:background .18s,color .18s}
.segmented button:hover {color:#b8ebcc}
.segmented button.selected {background:#1b2c21;color:#a4e8bc;box-shadow:0 1px 2px #0004}
.month-control {display:flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid var(--line-strong);background:#0e1014;border-radius:8px;min-height:40px;color:#8e959f}
.month-control>.icon {width:15px;height:15px}
.month-control input {width:135px;border:0;background:transparent;outline:0;min-height:24px;font-size:12px;color:#c3d2c8;min-width:0;color-scheme:dark}
.month-control:focus-within {outline:2px solid var(--accent);outline-offset:3px;border-color:#80dfa555}
.table-scroll {overflow-x:auto;scrollbar-width:thin;width:100%}
table {width:100%;border-collapse:collapse;text-align:left;font-size:13px}
th {font-size:11px;color:#88929e;font-weight:400;white-space:nowrap;padding:15px 17px;background:#0d1014;border-bottom:1px solid var(--line)}
td {padding:24px 17px;border-bottom:1px solid #ffffff08;vertical-align:middle;color:#c0c3c8}
tbody tr:last-child td {border-bottom:0}
tbody tr {transition:background .16s}
tbody tr:hover {background:#ffffff03}
th:first-child,td:first-child {padding-left:27px}
th:last-child,td:last-child {padding-right:27px}
.numeric {text-align:right;font-size:14px;white-space:nowrap}
.ranking-panel th.numeric {width:17%}
.rank-col {width:76px}
.rank-number {font-size:22px;color:#6f7784;line-height:1;font-weight:400}
.rank-number.top-rank {color:#8fcaa4}
.agent-cell {display:flex;align-items:center;gap:13px;min-width:180px}
.agent-monogram {width:39px;height:39px;border-radius:11px;border:1px solid #80dfa51a;background:#80dfa509;color:#a2d6b4;display:grid;place-items:center;font-size:15px;flex-shrink:0}
.agent-name {display:block;line-height:1.7;font-size:13px;font-weight:500;max-width:300px;color:#d7e2da}
.agent-meta {display:block;color:#818b97;font-size:11px;margin-top:5px;line-height:1.7}
.level-tag {display:inline-block;color:#b1b3b7;background:#ffffff06;border:1px solid #ffffff10;padding:3px 7px;border-radius:5px;font-size:10px;white-space:nowrap;line-height:1.5}
.level-tag.unfilled {background:#80dfa50c;border-color:#80dfa51b;color:#9acbae}
.net-money {font-weight:500;font-size:14px;color:#b4e9c5}
.rank-bar {display:block;width:100%;max-width:110px;height:3px;color:#70c992;margin:9px 0 0 auto;overflow:visible}
.bar-track {opacity:.14}
.panel-foot {display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 25px;background:#0d0f12;border-top:1px solid var(--line);font-size:11px;color:#7d8794;line-height:1.8}
.empty-state {padding:52px 24px;min-height:310px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.empty-icon {width:55px;height:55px;border:1px solid #80dfa522;background:#80dfa509;display:grid;place-items:center;color:#86bda0;border-radius:15px;margin-bottom:23px}
.empty-icon .icon {width:23px;height:23px}
.empty-state h3 {font-size:20px;font-weight:400;color:#cbd9cf;line-height:1.6}
.empty-state p {font-size:12px;color:#87909d;line-height:1.9;margin:12px 0 25px;max-width:420px}
.loading-state {min-height:290px;display:grid;place-items:center;font-size:12px;color:#959aa4}
.filter-bar {display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin-bottom:23px}

/* Agent directory */
.directory-overview {display:grid;grid-template-columns:1.8fr repeat(3,minmax(0,1fr));padding:6px 0 33px;gap:30px;border-bottom:1px solid var(--line);align-items:center;margin-bottom:29px}
.directory-total strong {font-weight:400;font-size:56px;line-height:1;color:var(--ink)}
.directory-total strong>span {font-family:var(--sans);font-size:14px;color:#9a9b98;margin-left:15px}
.directory-total p {font-size:11px;color:#87909a;margin-top:16px;line-height:1.8}
.directory-count {padding-left:27px;border-left:1px solid var(--line)}
.directory-count>span {display:block;font-size:11px;color:#929aa5}
.directory-count>b {font-size:30px;font-weight:400;display:block;margin-top:16px;line-height:1;color:#d5e2d8}
.directory-count i {font-style:normal;font-family:var(--sans);font-size:10px;color:#7e8793;margin-left:8px}
.directory-toolbar {display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 27px;scroll-margin-top:24px}
.search-field {display:flex;align-items:center;gap:10px;min-width:230px;max-width:460px;flex:1;background:#101613;border:1px solid var(--line-strong);border-radius:9px;padding:12px 14px;min-height:44px;color:#737d8b;transition:border-color .2s,box-shadow .2s}
.search-field:focus-within {border-color:#80dfa562;box-shadow:0 0 0 3px #80dfa509}
.search-field>.icon {width:17px;height:17px}
.search-field input {width:100%;min-width:0;border:0;outline:0;background:transparent;font-size:12px;color:#d6e3da;box-shadow:none}
.search-field input::placeholder {color:#737c89}
.search-field kbd {margin-left:auto;flex-shrink:0}
.search-field.wide {max-width:540px}
.view-toggle {display:flex;padding:4px;border:1px solid var(--line);background:#0d0f12;border-radius:9px;gap:4px}
.view-toggle button {display:grid;place-items:center;width:35px;height:34px;background:transparent;color:#717b89;border-radius:5px;transition:background .18s,color .18s}
.view-toggle button.selected {background:#24262c;color:#9cdfb4}
.view-toggle .icon {width:16px;height:16px}
.directory-tabs {display:flex;align-items:center;gap:28px;border-bottom:1px solid var(--line);margin-bottom:25px}
.directory-tabs button {position:relative;display:flex;align-items:center;gap:8px;background:transparent;color:#9198a2;font-size:12px;padding:0 0 17px;min-height:35px;white-space:nowrap}
.directory-tabs button:after {content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transition:transform .23s var(--ease)}
.directory-tabs button.active {color:#b7eaca}
.directory-tabs button.active:after {transform:scaleX(1)}
.directory-tabs small {font-size:10px;padding:2px 6px;border-radius:4px;color:#8993a0;background:#ffffff05}
.directory-tabs button.active small {background:#80dfa513;color:#90c6a2}
.directory-tabs>span {margin-left:auto;padding-bottom:17px;color:#7e8794;font-size:11px;white-space:nowrap}
.agent-directory {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.directory-card {text-align:left;display:flex;flex-direction:column;min-width:0;padding:23px 24px 0;min-height:202px;border:1px solid #ffffff12;border-radius:var(--radius);background:#111813;color:var(--ink);transition:border-color .22s,background .22s,box-shadow .22s,translate .28s var(--ease)}
.directory-card:hover {border-color:#80dfa53d;background:#162119;box-shadow:0 14px 25px #0003;translate:0 -3px}
.directory-card-head {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:23px}
.directory-card-body {display:block;flex:1}
.directory-card-body>b {display:block;font-size:14px;font-weight:500;line-height:1.75;color:#d7e2d9;overflow-wrap:anywhere}
.directory-card-body>span {display:block;font-size:11px;line-height:1.8;color:#87919e;margin-top:7px;margin-bottom:23px}
.directory-card-foot {display:flex;justify-content:space-between;align-items:center;gap:8px;padding:15px 0;border-top:1px solid var(--line);color:#7f8a98;font-size:10px}
.directory-card-foot i {font-style:normal;color:#495260;margin-inline:5px}
.card-open {display:flex;align-items:center;gap:6px;opacity:0;transform:translateX(-4px);transition:opacity .2s,transform .25s;color:#90c9a6;white-space:nowrap}
.card-open .icon {width:13px;height:13px}
.directory-card:hover .card-open,.directory-card:focus-visible .card-open {opacity:1;transform:none}
.directory-list {grid-template-columns:1fr;gap:10px}
.directory-list .directory-card {flex-direction:row;align-items:center;padding:18px 23px;min-height:90px;gap:23px;border-radius:12px}
.directory-list .directory-card-head {margin:0;gap:16px}
.directory-list .directory-card-body {flex:1}
.directory-list .directory-card-body>span {margin:5px 0 0}
.directory-list .directory-card-foot {border:0;min-width:240px;gap:25px}
.directory-list .directory-card:hover {translate:2px 0}
.directory-pagination {display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:29px;font-size:11px;color:#89929e}
.directory-pagination>div {display:flex;align-items:center;gap:15px}
.agent-detail>.agent-monogram {width:62px;height:62px;font-size:27px;border-radius:17px;margin-bottom:25px}
.agent-detail h3 {font-size:25px;font-weight:400;line-height:1.6;margin-bottom:15px}
.agent-detail dl {margin:30px 0}
.agent-detail dl>div {display:grid;grid-template-columns:80px minmax(0,1fr);gap:20px;border-bottom:1px solid var(--line);padding:18px 0;font-size:12px;line-height:1.8}
.agent-detail dt {color:#818b98}
.agent-detail dd {margin:0;color:#c7d6cc;overflow-wrap:anywhere}
.detail-actions {display:grid;gap:11px}
.detail-note {font-size:11px;color:#828c99;line-height:1.9;margin-top:22px}

/* Live statement and ranking */
.live-stage {display:grid;grid-template-columns:minmax(0,1.35fr) minmax(265px,.75fr);gap:38px;padding:36px;border:1px solid #ffffff16;border-radius:var(--radius);background:linear-gradient(115deg,#19251d 0%,#111c16 65%,#111813 100%);margin-bottom:31px;align-items:start;box-shadow:0 20px 55px #0002}
.live-stage .metric-label {display:block;color:#a5a8ab;line-height:18px}
.live-total>strong {font-size:58px;font-weight:500;line-height:1.15;display:block;margin:22px 0 23px;color:#edf7ef}
.live-breakdown {display:flex;gap:23px;flex-wrap:wrap}
.live-breakdown>span {display:flex;align-items:baseline;gap:8px;color:#858f9d;font-size:11px}
.live-breakdown b {font-size:12px;font-weight:400;color:#c5c8cb}
.beijing-clock {padding-left:34px;border-left:1px solid #ffffff15;align-self:stretch;min-width:0}
.clock-label {display:flex;align-items:center;gap:8px;font-size:11px;color:#a0a7b0;line-height:18px}
.clock-label i {width:5px;height:5px;border-radius:50%;background:var(--accent)}
.clock-label small {font-size:9px;color:#768190;margin-left:auto;white-space:nowrap}
.beijing-clock time {display:block;font-size:43px;font-weight:400;line-height:1.15;color:#9de5b8;margin:34px 0 22px;white-space:nowrap;max-width:100%;width:8ch}
.beijing-clock p {font-size:11px;line-height:18px;color:#9ba5b1}
.connection-state {display:flex;align-items:center;gap:7px;font-size:10px;color:#909ba8;margin-top:15px;line-height:1.7}
.connection-state i {width:4px;height:4px;border-radius:50%;background:#737d8b;flex-shrink:0}
.connection-state.connected {color:#9cceb0}
.connection-state.connected i {background:var(--green)}
.connection-state.disconnected {color:#e1bb88}
.connection-state.disconnected i {background:#d2a36c}
.section-heading {display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:20px}
.section-heading p {font-size:11px;color:#7f8b99}
.leaders-section {margin-bottom:30px}
.leaders-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.leader-card {padding:25px 25px 0;border:1px solid var(--line);background:#111a14;border-radius:var(--radius);min-width:0;overflow:hidden}
.leader-card:first-child {background:linear-gradient(145deg,#142b1c,#101a13 70%);border-color:#80dfa52a}
.leader-top {display:flex;align-items:center;gap:17px;margin-bottom:24px}
.leader-rank-number {font-size:36px;font-weight:400;color:#798695;line-height:1}
.leader-card:first-child .leader-rank-number {color:#80dfa5}
.leader-top>div {display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.leader-rank {font-size:10px;color:#909ba8}
.leader-top .level-tag {font-size:9px}
.leader-card h3 {font-size:14px;font-weight:500;line-height:1.8;color:#d8e5dc}
.leader-card>p {font-size:11px;color:#8793a1;line-height:1.9;margin:6px 0 24px}
.leader-card>strong {display:block;font-size:32px;font-weight:500;line-height:1.2;color:#dcf1e4;margin-bottom:24px}
.leader-foot {display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding:16px 0;font-size:10px;color:#8692a0}
.live-list-header {display:flex;justify-content:space-between;padding:15px 27px;font-size:11px;background:#0d1014;border-block:1px solid var(--line);color:#8995a3}
.live-ranking-row {display:flex;align-items:center;gap:20px;padding:24px 27px;border-bottom:1px solid #ffffff08;min-height:97px;transition:background .2s}
.live-ranking-row:hover {background:#ffffff03}
.live-ranking-row:last-child {border:0}
.live-rank {font-size:23px;width:36px;color:#88b09a;flex-shrink:0}
.live-agent {min-width:0}
.live-agent b {display:block;line-height:1.8;font-size:13px;font-weight:500;overflow-wrap:anywhere;color:#d6e3da}
.live-agent small {display:block;font-size:11px;color:#8493a3;line-height:1.8;margin-top:5px}
.live-row-amount {margin-left:auto;text-align:right;flex-shrink:0;min-width:0;max-width:60%}
.live-row-amount>b {display:block;font-size:22px;font-weight:500;color:#b2e7c6;line-height:1.3;white-space:nowrap}
.live-row-amount>small {display:block;font-size:10px;color:#8191a2;margin-top:9px}
.live-empty {text-align:center;padding:47px 24px;background:#101813;border:1px solid var(--line);border-radius:var(--radius)}
.live-empty>.icon {width:29px;height:29px;color:#7ec498;margin-bottom:21px}
.live-empty h3 {font-size:22px;font-weight:400;color:#cfddd3}
.live-empty p {font-size:12px;color:#8a97a6;line-height:1.9;margin:14px 0 25px}
.list-empty {text-align:center;padding:39px;font-size:12px;color:#8190a0}

/* Forms, drawers, records and feedback */
form label {display:block;font-size:12px;font-weight:500;color:#bfc1c1;margin-bottom:22px}
form label small {font-size:10px;font-weight:400;color:#737f8d;margin-left:6px}
form input,form textarea,form select {display:block;width:100%;min-width:0;min-height:47px;margin-top:9px;padding:12px 13px;border:1px solid #ffffff1a;border-radius:9px;background:#0b0e12;color:#e6f0e9;font-size:13px;font-weight:400;line-height:1.6;transition:border-color .18s,box-shadow .18s;color-scheme:dark}
form input:focus,form textarea:focus,form select:focus {outline:0;border-color:#80dfa580;box-shadow:0 0 0 3px #80dfa50b}
form input::placeholder,form textarea::placeholder {font-size:12px;color:#687685;opacity:1}
form input:read-only {color:#929ca9;background:#101317}
form select:disabled {color:#929ca9;opacity:1}
form input:-webkit-autofill {box-shadow:0 0 0 1000px #0b0e12 inset;-webkit-text-fill-color:#e6f0e9;caret-color:#e6f0e9}
form textarea {resize:vertical;min-height:90px}
form select {padding-right:8px}
.form-two {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.amount-input {position:relative}
.amount-input>span {position:absolute;left:15px;top:50%;transform:translateY(-50%);font-size:21px;color:#7ba78b;line-height:1}
.amount-input input {font-size:29px;padding-left:39px;min-height:66px}
.amount-input input::placeholder {font-size:29px;color:#546272}
.form-hint {font-size:10px;text-align:center;margin-top:16px;color:#7e8a99;line-height:1.8}
.form-error {font-size:12px;line-height:1.8;color:#eea69c;margin-bottom:17px}
.form-error:empty {display:none}
.warning {padding:16px;background:#d6ac680a;border:1px solid #d6ac682c;color:#d6c098;border-radius:9px;font-size:12px;line-height:1.8;margin-bottom:23px}
dialog {position:fixed;border:1px solid #ffffff20;border-radius:18px;padding:0;width:500px;max-width:calc(100vw - 30px);max-height:90dvh;overflow:auto;background:#111a15;color:var(--ink);box-shadow:0 28px 100px #0009}
dialog::backdrop {background:#0009;backdrop-filter:blur(7px)}
dialog.drawer {inset:12px 12px 12px auto;height:calc(100dvh - 24px);max-height:none;width:460px;margin:0;border-radius:18px;max-width:calc(100vw - 24px);box-shadow:-16px 0 80px #0006}
.dialog-heading {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 29px;border-bottom:1px solid var(--line);background:#111a15;position:sticky;top:0;z-index:2}
.dialog-heading h2 {font-size:23px;font-weight:400;color:#ddece1}
.dialog-body {padding:29px}
.dialog-body>p {font-size:12px;line-height:1.9;margin-bottom:20px;color:#abb4bc}
.drawer .dialog-body {padding:30px 29px}
.audit-list {list-style:none;padding:0;margin:0}
.audit-list li {position:relative;border-left:1px solid #80dfa525;padding:0 0 28px 22px;margin-left:7px}
.audit-list li:before {content:"";position:absolute;left:-3px;top:5px;width:5px;height:5px;border-radius:50%;background:#83c89d}
.audit-list b {display:block;font-size:13px;font-weight:500;color:#d4e1d8}
.audit-list small {display:block;font-size:11px;color:#8290a0;margin-block:10px}
.audit-list p {font-size:12px;color:#a6afb9;line-height:1.9;overflow-wrap:anywhere}
.check-label {display:flex;gap:8px;align-items:center;font-size:12px;color:#939fab;margin-left:auto}
.check-label input {accent-color:var(--accent)}
.records-table {min-width:790px}
.date-text {font-size:12px;font-weight:500;white-space:nowrap;color:#c8cfd3}
.type-tag {display:inline-block;font-size:10px;border:1px solid #95bda328;background:#95bda30b;color:#a4c0af;padding:4px 7px;border-radius:5px;white-space:nowrap}
.type-tag.return {background:#80dfa50c;border-color:#80dfa525;color:#93b9a1}
.voided {color:#7f8a96}
.voided .net-money {text-decoration:line-through;color:#7b899a}
.note-cell {min-width:100px;max-width:220px;font-size:12px;line-height:1.8;color:#8b9aab;overflow-wrap:anywhere}
.row-actions {display:flex;gap:9px;white-space:nowrap}
.pagination {display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 25px;border-top:1px solid var(--line);font-size:12px;color:#8492a3}
.pagination>div {display:flex;gap:10px}
.region-cell {min-width:220px;line-height:1.8}
.error-banner {display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 19px;border:1px solid #eea69c2c;background:#b85b4e0e;border-radius:10px;color:#d4a9a0;font-size:12px;line-height:1.8;margin-bottom:23px}
.error-banner .text-btn {white-space:nowrap;color:#efc3b7}
.mobile-brand {display:none}
#toast {position:fixed;bottom:28px;left:calc(50% + var(--rail-width)/2);z-index:100;transform:translate(-50%,18px);opacity:0;pointer-events:none;background:#25272b;color:#d0eddb;border:1px solid #80dfa535;border-radius:11px;box-shadow:0 12px 45px #0008;padding:15px 24px;font-size:12px;line-height:1.8;max-width:90vw;transition:opacity .2s,transform .25s var(--ease)}
#toast.visible {opacity:1;transform:translate(-50%,0)}
:fullscreen {background:var(--paper);overflow:auto}
#main:fullscreen {margin:0;max-width:none;padding:0 6vw 64px}

/* The entrance is an environment, not a floating sign-in card. */
.login-page {display:grid;grid-template-columns:minmax(0,1.12fr) minmax(420px,.88fr);min-height:100svh;margin:0;background:#080b09}
.login-brand {position:relative;isolation:isolate;display:flex;flex-direction:column;min-width:0;min-height:100svh;padding:48px clamp(34px,5vw,88px) 37px;border-right:1px solid #ffffff10;background:linear-gradient(155deg,#18251b 0%,#0d150f 46%,#0e1a12 100%);overflow:hidden}
.login-brand>img {width:96px;height:65px;object-fit:contain;padding:8px;background:#e6efe7;border-radius:9px;margin-bottom:20px}
.login-brand-top {display:flex;align-items:center;justify-content:space-between;gap:18px;position:relative;z-index:2}
.login-brand-top>img {width:58px;height:42px;object-fit:contain;padding:5px;background:#e5eee5;border-radius:7px;flex-shrink:0}
.login-brand-top .brand-edition {font-size:8px;letter-spacing:.15em;line-height:1.8;text-align:right;max-width:220px;color:#7f9b88}
.login-intro {position:relative;z-index:1}
.login-kicker {display:block;font-size:10px;letter-spacing:.2em;color:#82ba96;text-transform:uppercase;line-height:1.8}
.login-art {position:relative;display:grid;place-items:center;flex:1;min-height:330px;margin:15px -20px}
.orbit-system {position:relative;width:min(390px,100%);aspect-ratio:1;display:grid;place-items:center}
.orbit-core {position:relative;z-index:2;display:grid;place-items:center;width:125px;height:125px;border-radius:26px;background:#e7f0e8;border:1px solid #f0faf1;box-shadow:0 14px 40px #0006}
.orbit-core img {width:102px;height:81px;object-fit:contain;margin:0;padding:0;background:none}
.login-headline {position:relative;z-index:1;font-size:clamp(38px,4.3vw,66px);font-weight:400;line-height:1.25;letter-spacing:.015em;color:#e8f3ea;margin:5px 0 21px}
.login-headline span {color:#8dddab}
.login-caption {font-size:12px;line-height:2;color:#8e949d;max-width:340px}
.login-brand>p:not(.login-kicker):not(.login-caption) {font-size:13px;line-height:1.9;color:#9ead9f}
.login-brand-footer {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:43px;padding-top:22px;border-top:1px solid #ffffff10;color:#6f7885;font-size:9px;letter-spacing:.08em;line-height:1.7}
.login-brand-footer span:last-child {color:#76a188}
.login-card {align-self:center;justify-self:center;width:100%;max-width:456px;padding:60px 43px;background:transparent;border:0;border-radius:0;box-shadow:none}
.login-card>.eyebrow {color:#89c49e;letter-spacing:.12em;font-size:10px;margin-bottom:19px;display:block}
.login-card h1 {font-size:33px;font-weight:400;margin-bottom:17px;color:#e6f2e9}
.login-card>p {font-size:12px;line-height:1.9;color:#7f8b98}
.login-card form {margin-top:37px}
.login-card form label {font-size:11px;color:#a8afb5;margin-bottom:24px}
.login-card form input {background:#101813;border-color:#ffffff16;min-height:50px;margin-top:11px}
.login-card .button.full {min-height:51px;margin-top:6px}
.login-foot {display:flex;align-items:center;gap:8px;color:#81909f!important;font-size:10px!important;text-align:left;margin-top:24px;line-height:1.9!important}
.login-foot .icon {width:14px;height:14px;flex-shrink:0;color:#81ac8f}

/* Financial typography remains invariant across themes. */
.numeric,.mono,.rank-number,.live-rank,.leader-rank-number,.overview-main>strong,.overview-detail b,.directory-total strong,.directory-count>b,.live-total>strong,.leader-card>strong,.live-row-amount>b,.live-row-amount>small,.live-breakdown b,.beijing-clock time,.workspace-time b,.date-text,.amount-input input,.amount-input>span,.month-control input,.small-count,.directory-tabs small,.directory-pagination,.pagination,.agent-meta,.directory-card-foot,.leader-card>p,.leader-foot,.live-agent small,form input[type=date] {font-family:var(--numbers);font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1,"kern" 0;font-kerning:none;letter-spacing:0}
.money {display:inline-flex;align-items:baseline;max-width:100%;white-space:nowrap;line-height:1.15;letter-spacing:0;font-family:var(--numbers);font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.money-value {white-space:nowrap}
.money-decimal {font-size:1em;font-weight:inherit;color:inherit;vertical-align:baseline}
.currency {font-size:.68em;line-height:1;margin-right:.13em;vertical-align:baseline}
.money-sign {font-size:1em;margin-right:.04em}
.overview-main,.live-total,.leader-card {container-type:inline-size;min-width:0}
.overview-main>strong,.live-total>strong,.leader-card>strong {overflow-wrap:normal;white-space:nowrap}
.amount-input input,.amount-input input::placeholder {font-family:var(--numbers);font-variant-numeric:lining-nums tabular-nums;letter-spacing:0}
.money-len-3{font-size:min(1em,52.128cqi)}
.money-len-4{font-size:min(1em,39.837cqi)}
.money-len-5{font-size:min(1em,32.237cqi)}
.money-len-6{font-size:min(1em,27.072cqi)}
.money-len-7{font-size:min(1em,23.333cqi)}
.money-len-8{font-size:min(1em,20.502cqi)}
.money-len-9{font-size:min(1em,18.284cqi)}
.money-len-10{font-size:min(1em,16.498cqi)}
.money-len-11{font-size:min(1em,15.031cqi)}
.money-len-12{font-size:min(1em,13.803cqi)}
.money-len-13{font-size:min(1em,12.76cqi)}
.money-len-14{font-size:min(1em,11.864cqi)}
.money-len-15{font-size:min(1em,11.086cqi)}
.money-len-16{font-size:min(1em,10.403cqi)}
.money-len-17{font-size:min(1em,9.8cqi)}
.money-len-18{font-size:min(1em,9.263cqi)}
.money-len-19{font-size:min(1em,8.781cqi)}
.money-len-20{font-size:min(1em,8.348cqi)}
.money-len-21{font-size:min(1em,7.955cqi)}
.money-len-22{font-size:min(1em,7.597cqi)}
.money-len-23{font-size:min(1em,7.27cqi)}
.money-len-24{font-size:min(1em,6.97cqi)}
.money-len-25{font-size:min(1em,6.694cqi)}
.money-len-26{font-size:min(1em,6.439cqi)}
.money-len-27{font-size:min(1em,6.203cqi)}
.money-len-28{font-size:min(1em,5.983cqi)}
.money-len-29{font-size:min(1em,5.778cqi)}

@media(min-width:1660px) {
  #main {padding-inline:76px}
  .agent-directory {grid-template-columns:repeat(4,minmax(0,1fr))}
  .directory-list {grid-template-columns:1fr}
  .overview-main>strong,.live-total>strong {font-size:66px}
  .beijing-clock time {font-size:48px;margin-top:36px}
}
@media(min-width:951px) {
  .leader-card:only-child {grid-column:1/-1;display:grid;grid-template-columns:140px minmax(0,1fr) minmax(0,.8fr);column-gap:25px;padding:26px 29px 0}
  .leader-card:only-child .leader-top {grid-row:1/3;grid-column:1;margin:0 0 24px}
  .leader-card:only-child h3 {grid-column:2;grid-row:1;align-self:end}
  .leader-card:only-child>p {grid-column:2;grid-row:2;margin:6px 0 24px}
  .leader-card:only-child>strong {grid-column:3;grid-row:1/3;align-self:center;text-align:right;font-size:32px;margin-bottom:23px;container-type:inline-size;min-width:0}
  .leader-card:only-child .leader-foot {grid-column:1/-1}
  .leader-card:only-child:has(.money-long) {grid-template-columns:120px minmax(0,1fr) minmax(0,1.35fr)}
}
@media(max-width:1250px) {
  :root {--rail-width:206px}
  .sidebar {padding-inline:13px}
  .brand img {width:48px;height:38px}
  .brand>span {font-size:16px}
  .brand-row {padding:0;gap:1px}
  .rail-toggle {width:24px}
  .rail-collapsed {--rail-width:76px}
  #main {padding-inline:29px}
  .monthly-overview {grid-template-columns:1fr;padding:30px;gap:26px}
  .overview-detail {justify-content:flex-start;gap:46px}
  .live-stage {padding:30px;gap:27px;grid-template-columns:minmax(0,1.1fr) minmax(230px,.85fr)}
  .live-total>strong {font-size:51px}
  .beijing-clock {padding-left:26px}
  .beijing-clock time {font-size:36px;margin-top:35px}
  .agent-directory {grid-template-columns:repeat(2,minmax(0,1fr))}
  .directory-list {grid-template-columns:1fr}
  .directory-overview {gap:22px;grid-template-columns:1.5fr repeat(3,minmax(0,1fr))}
  .directory-count {padding-left:20px}
  .directory-total strong {font-size:49px}
  .directory-total strong>span {font-size:12px;margin-left:10px}
  .ranking-panel table {min-width:740px}
  .leader-card {padding-inline:21px}
  .leader-card>strong {font-size:28px}
  .directory-list .directory-card-foot {min-width:190px}
  .card-open {font-size:0}
  .card-open .icon {width:15px}
  .login-page {grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr)}
  .login-brand {padding-inline:42px}
  .login-card {padding-inline:40px}
}
@media(max-width:950px) {
  .directory-overview {grid-template-columns:repeat(3,minmax(0,1fr));row-gap:28px}
  .directory-total {grid-column:1/-1}
  .directory-count:nth-child(2) {padding:0;border:0}
  .directory-total strong {font-size:54px}
  .directory-total strong>span {font-size:15px}
  .live-stage {grid-template-columns:1fr}
  .beijing-clock {border-left:0;border-top:1px solid var(--line-strong);padding:23px 0 0;display:grid;grid-template-columns:1fr auto;gap:0 20px}
  .beijing-clock time {grid-column:2;grid-row:1/3;margin:0;text-align:right;align-self:center;font-size:37px}
  .beijing-clock p {margin-top:10px}
  .clock-label small {margin-left:8px}
  .connection-state {grid-column:1/-1;margin-top:15px}
  .leaders-grid {grid-template-columns:1fr}
  .leader-card {display:grid;grid-template-columns:1fr minmax(0,1.1fr);gap:0 20px;padding:23px 25px 0}
  .leader-top {grid-column:1;grid-row:1/3;margin-bottom:18px;gap:15px}
  .leader-card h3 {grid-column:2;align-self:end;font-size:14px}
  .leader-card>p {grid-column:2;margin:6px 0 17px}
  .leader-card>strong {grid-column:1/-1;font-size:34px;margin:4px 0 23px}
  .leader-foot {grid-column:1/-1}
  .live-ranking-panel .panel-heading {align-items:flex-start}
  .live-ranking-panel .panel-heading>.muted {max-width:195px;line-height:1.8;text-align:right}
  .directory-tabs {gap:22px}
  .directory-tabs>span {display:none}
  .directory-list .directory-card-head>.level-tag {display:none}
  .directory-list .directory-card-foot {min-width:0}
  .directory-list .directory-card {gap:15px}
  .directory-list .directory-card-foot>.mono {display:none}
  .login-page {grid-template-columns:minmax(0,1fr) minmax(360px,1fr)}
  .login-brand {padding:38px 30px 30px}
  .login-art {min-height:280px;margin-inline:-10px}
  .login-headline {font-size:40px}
  .login-card {padding:45px 30px}
}
@media(max-width:720px) {
  :root,.rail-collapsed {--rail-width:0px}
  .sidebar,.rail-collapsed .sidebar {position:relative;inset:auto;width:100%;height:auto;padding:15px 18px 9px;border-right:0;border-bottom:1px solid var(--line);overflow:visible;transition:none;background:#0b100d}
  .brand-row,.rail-collapsed .brand-row {margin:0 0 17px;padding:0;justify-content:flex-start;flex-wrap:nowrap;gap:0}
  .brand,.rail-collapsed .brand {gap:10px}
  .brand img,.rail-collapsed .brand img {width:45px;height:34px;padding:4px}
  .brand>span,.rail-collapsed .brand>span {display:block;font-size:15px;letter-spacing:.05em}
  .brand>span>span {font-size:9px;margin-top:4px}
  .rail-toggle,.rail-collapsed .rail-toggle,.nav-label,.rail-note,.sidebar-bottom,.brand-edition {display:none}
  .sidebar .compose-button,.rail-collapsed .sidebar .compose-button {display:flex;position:absolute;right:18px;top:15px;min-height:37px;width:37px;height:37px;padding:0;margin:0;justify-content:center;border-radius:9px}
  .sidebar .compose-button span,.sidebar .compose-button kbd {display:none}
  .sidebar nav {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
  .nav-item,.rail-collapsed .nav-item {justify-content:center;gap:7px;min-height:39px;padding:10px 5px;margin:0;font-size:11px;border-radius:7px}
  .nav-item .icon {width:14px;height:14px}
  .nav-item>span,.rail-collapsed .nav-item>span {display:inline}
  .nav-live-dot,.rail-collapsed .nav-live-dot {display:none}
  #main {margin:0;padding:0 18px 38px;min-height:70vh;transition:none}
  .workspace-topline {height:57px;font-size:10px;margin-bottom:25px;border:0}
  .workspace-topline i:not(.time-dot) {margin-inline:6px}
  .workspace-mark {font-size:8px;letter-spacing:.1em}
  .workspace-time {font-size:9px;gap:6px}
  .workspace-time b {font-size:10px}
  .page-heading {align-items:flex-end;flex-wrap:wrap;gap:20px;margin-bottom:25px}
  h1 {font-size:28px;line-height:1.3}
  h2 {font-size:15px}
  .eyebrow {font-size:10px;line-height:1.8;margin-bottom:9px}
  .header-actions {gap:8px;padding-bottom:0}
  .header-actions .button {font-size:11px;padding:9px 12px;min-height:39px}
  .monthly-overview {padding:25px 21px 20px;gap:26px;border-radius:15px;margin-bottom:24px}
  .overview-main>strong {font-size:46px;margin:19px 0 12px}
  .overview-main>p {font-size:10px}
  .overview-detail {gap:20px;justify-content:space-between;flex-wrap:wrap}
  .overview-detail span {font-size:10px}
  .overview-detail b {font-size:20px;margin-top:12px}
  .overview-detail small {font-size:10px}
  .overview-live {padding-top:18px}
  .overview-live>div {align-items:flex-start;flex-direction:column;gap:5px}
  .overview-live small {font-size:10px}
  .table-toolbar {padding:15px;gap:13px;flex-wrap:wrap}
  .segmented {padding:3px;gap:2px}
  .segmented button {padding:7px 12px;font-size:11px}
  .month-control {min-height:39px;padding:7px 10px}
  .month-control input {width:128px;font-size:12px}
  .panel {border-radius:15px}
  .panel-heading {padding:21px 19px}
  .panel-foot {padding:15px 18px;gap:8px;flex-wrap:wrap;font-size:10px}
  .empty-state {padding:42px 21px;min-height:285px}
  .empty-state h3 {font-size:18px}
  .empty-state p {font-size:11px}
  .directory-overview {gap:26px 18px;padding:3px 0 28px;margin-bottom:24px}
  .directory-total strong {font-size:48px}
  .directory-total strong>span {font-size:14px}
  .directory-total p {font-size:10px}
  .directory-count {padding-left:17px}
  .directory-count>span {font-size:10px}
  .directory-count>b {font-size:27px;margin-top:13px}
  .directory-count i {font-size:9px;margin-left:5px}
  .directory-toolbar {gap:12px;margin-bottom:23px}
  .search-field {min-width:0;padding:11px 12px;min-height:43px}
  .search-field input {font-size:12px}
  .search-field kbd {display:none}
  .view-toggle button {width:30px;height:31px}
  .directory-tabs {gap:20px;margin-bottom:21px}
  .directory-tabs button {font-size:11px;gap:5px;padding-bottom:15px}
  .directory-tabs small {font-size:9px;padding:1px 4px}
  .agent-directory {grid-template-columns:1fr;gap:14px}
  .directory-card {padding:23px 23px 0;min-height:190px;border-radius:15px}
  .directory-card-head {margin-bottom:20px}
  .directory-card-body>b {font-size:15px}
  .directory-card-body>span {font-size:11px;margin-bottom:20px}
  .directory-card-foot {padding:15px 0}
  .card-open {font-size:10px;opacity:1;transform:none}
  .directory-card:hover {translate:none}
  .directory-list .directory-card {padding:18px 16px;gap:13px;min-height:86px}
  .directory-list .directory-card .agent-monogram {height:34px;width:34px;font-size:15px;border-radius:9px}
  .directory-list .directory-card-body>b {font-size:12px}
  .directory-list .directory-card-body>span {font-size:10px}
  .directory-list .card-open {font-size:0}
  .directory-pagination {gap:12px;font-size:10px;align-items:flex-start;flex-wrap:wrap}
  .directory-pagination>div {gap:12px}
  .directory-pagination .button {font-size:10px}
  .directory-pagination>span {padding-top:10px}
  .filter-bar {gap:12px}
  .filter-bar>.search-field {flex-basis:100%}
  .check-label {margin-left:0;font-size:11px}
  .pagination {padding:17px;font-size:11px}
  .live-stage {padding:26px 21px;gap:24px;border-radius:15px;margin-bottom:28px}
  .live-total>strong {font-size:46px;margin:19px 0 21px}
  .live-stage .metric-label {font-size:10px}
  .live-breakdown {gap:14px;row-gap:11px}
  .live-breakdown>span {font-size:10px;gap:6px}
  .live-breakdown b {font-size:11px}
  .beijing-clock {padding-top:23px;gap:0 12px}
  .clock-label {font-size:10px;gap:6px}
  .clock-label small {display:none}
  .beijing-clock time {font-size:29px}
  .beijing-clock p {font-size:9px;line-height:1.8}
  .connection-state {font-size:9px;margin-top:14px}
  .section-heading {margin-bottom:18px}
  .section-heading h2 {font-size:15px}
  .section-heading p {font-size:10px}
  .small-count {font-size:10px;padding:0 6px;margin-left:7px}
  .leaders-section {margin-bottom:27px}
  .leader-card,.leader-card:first-child {padding:23px 21px 0;column-gap:18px;border-radius:15px}
  .leader-rank-number {font-size:33px}
  .leader-card>strong {font-size:33px;margin:5px 0 23px}
  .leader-card h3 {font-size:13px}
  .leader-card>p {font-size:10px}
  .leader-foot {font-size:10px}
  .live-ranking-panel .panel-heading {display:block;padding:21px 19px}
  .live-ranking-panel .panel-heading>.muted {display:block;max-width:none;text-align:left;font-size:9px;margin-top:10px}
  .live-list-header {font-size:10px;padding:13px 19px}
  .live-ranking-row {gap:11px;padding:22px 18px;min-height:95px;flex-wrap:wrap}
  .live-rank {font-size:21px;width:25px}
  .live-ranking-row>.agent-monogram {display:none}
  .live-agent {flex:1;min-width:100px}
  .live-agent b {font-size:12px}
  .live-agent small {font-size:10px}
  .live-row-amount {max-width:100%}
  .live-row-amount>b {font-size:18px;overflow-wrap:normal}
  .live-row-amount>small {display:none}
  .live-row-amount>.rank-bar {max-width:90px}
  .live-empty {padding:39px 21px}
  .live-empty h3 {font-size:20px}
  .live-empty p {font-size:11px}
  dialog {border-radius:16px;max-height:90dvh}
  dialog.drawer {inset:auto 0 0 0;width:100%;max-width:none;height:92dvh;max-height:92dvh;border-radius:21px 21px 0 0;border-bottom:0}
  .dialog-heading {padding:25px 23px 21px}
  .dialog-heading h2 {font-size:22px}
  .dialog-body,.drawer .dialog-body {padding:25px 23px}
  .drawer .dialog-heading:before {content:"";position:absolute;top:8px;left:calc(50% - 17px);width:34px;height:3px;border-radius:2px;background:#3a4049}
  .form-two {gap:12px}
  form label {font-size:12px}
  .drawer form input,.drawer form textarea,.drawer form select {font-size:16px}
  .drawer .amount-input input {font-size:29px}
  .login-page {display:flex;flex-direction:column;min-height:100svh}
  .login-brand {min-height:0;padding:29px 27px 24px;border-right:0;border-bottom:1px solid var(--line)}
  .login-brand-top>img {width:46px;height:34px;padding:4px;border-radius:6px}
  .login-brand-top .brand-edition {display:block;font-size:7px;max-width:180px}
  .login-kicker {font-size:9px;letter-spacing:.17em}
  .login-art {min-height:190px;height:190px;flex:none;margin:-3px 0 0;position:absolute;right:-15px;top:45px;width:210px;opacity:.8}
  .orbit-system {width:200px}
  .orbit-core {width:74px;height:74px;border-radius:17px}
  .orbit-core img {width:63px;height:50px}
  .login-headline {font-size:34px;line-height:1.3;max-width:70%;margin:39px 0 16px}
  .login-caption {font-size:10px;line-height:1.9;max-width:62%;position:relative;z-index:1}
  .login-brand-footer {margin-top:29px;padding-top:17px;font-size:8px}
  .login-card {max-width:440px;padding:35px 27px 37px;align-self:center}
  .login-card>.eyebrow {margin-bottom:12px;font-size:9px}
  .login-card h1 {font-size:28px;margin-bottom:12px}
  .login-card>p {font-size:11px}
  .login-card form {margin-top:27px}
  .login-card form label {margin-bottom:20px}
  .login-card form input {font-size:16px;min-height:49px}
  .login-foot {font-size:9px!important;margin-top:21px}
  .mobile-brand {display:block;text-align:center;padding-bottom:28px;color:#626f7e;font-size:9px;letter-spacing:.07em}
  #toast {left:50%;width:max-content;max-width:calc(100vw - 30px);font-size:11px;padding:14px 19px;bottom:20px}
  #main:fullscreen {padding:0 18px 38px}
}
@media(max-width:360px) {
  #main {padding-inline:14px}
  .sidebar,.rail-collapsed .sidebar {padding-inline:14px}
  .sidebar nav {gap:3px}
  .nav-item,.rail-collapsed .nav-item {gap:0;min-width:0}
  .nav-item .icon {display:none}
  .workspace-topline>span:first-child {max-width:45%;font-size:9px}
  .workspace-time {gap:5px;font-size:8px}
  .workspace-time b {font-size:9px}
  .monthly-overview,.live-stage {padding-inline:18px}
  .overview-detail {gap:18px}
  .overview-detail b {font-size:18px}
  .beijing-clock {grid-template-columns:1fr}
  .beijing-clock time {grid-row:auto;grid-column:1;text-align:left;margin:16px 0 8px;font-size:32px}
  .beijing-clock p {grid-row:3}
  .live-row-amount {flex-basis:100%;padding-left:35px}
  .directory-tabs {gap:12px}
  .directory-tabs button {font-size:10px;gap:4px}
  .directory-count {padding-left:12px}
  .directory-count>span {font-size:9px}
  .directory-count>b {font-size:25px}
  .header-actions .button {padding-inline:11px}
  .login-art {right:-31px;width:183px;opacity:.58}
  .login-headline {font-size:30px;max-width:75%}
  .login-brand,.login-card {padding-inline:23px}
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {scroll-behavior:auto!important;animation:none!important;transition:none!important}
}
