:root { --bg:#f5f7fa; --surface:#fff; --ink:#192a38; --muted:#77838f; --line:#e6ebef; --accent:#16776c; --accent-dark:#0f5c54; --amber:#b7770a; --red:#cf4d50; --shadow:0 4px 24px #183b4e05; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; color:var(--ink); background:var(--bg); font-synthesis:none; }
.cost-filters { display:flex; flex-wrap:wrap; align-items:end; gap:12px; padding:18px 22px; margin-bottom:24px; }
.cost-filters .field { flex:1 1 160px; margin:0; min-width:0; }
.cost-filters input,.cost-filters select { width:100%; }
.cost-filter-hint { flex-basis:100%; color:var(--muted); font-size:12px; }
.cost-toggle { display:block; padding:2px 0; border:0; background:none; color:var(--accent); font-size:12px; }
.cost-toggle::before { content:'▸ '; }
.cost-toggle[aria-expanded=true]::before { content:'▾ '; }
.cost-expand-row { cursor:pointer; }
.cost-expand-row:hover { background:#f5faf9; }
.cost-panel-row[hidden] { display:none; }
.cost-panel-row > td { background:#f5f9f9; padding:20px!important; white-space:normal!important; }
.cost-detail-heading { display:flex; gap:20px; justify-content:space-between; align-items:start; margin-bottom:16px; }
.cost-detail-heading h3 { font-size:15px; }
.cost-detail-heading p,.cost-note,.cost-empty { color:var(--muted); font-size:12px; }
.cost-totals { display:flex; gap:20px; font-size:12px; }
.cost-totals strong { display:block; color:var(--ink); font-size:16px; font-variant-numeric:tabular-nums; }
.cost-groups { display:grid; gap:12px; }
.cost-group { background:var(--surface); border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.cost-group-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:10px 14px; border-bottom:1px solid var(--line); }
.cost-group-heading h4 { margin:0; font-size:14px; }
.cost-group-heading strong { font-variant-numeric:tabular-nums; color:var(--accent); }
.balance-table .cost-model-table { width:100%; min-width:0; }
.cost-model-table th,.cost-model-table td { padding:7px 14px!important; font-size:12px; }
.cost-model-table .model-name { white-space:normal; overflow-wrap:anywhere; max-width:400px; }
.cost-empty { padding:12px 14px; }
.cost-note { margin-top:12px; max-width:100ch; }
@media (max-width:600px) {
  .cost-filters { padding:14px; }
  .cost-detail { width:calc(100vw - 80px); }
  .cost-detail-heading { flex-direction:column; gap:10px; }
  .cost-totals { flex-wrap:wrap; gap:12px; }
  .cost-totals strong { font-size:14px; }
  .cost-model-table { table-layout:fixed; }
  .cost-model-table th:nth-child(n+4),.cost-model-table td:nth-child(n+4) { display:none; }
  .cost-model-table th:first-child { width:40%; }
  .cost-model-table th:nth-child(2),.cost-model-table th:nth-child(3) { width:30%; }
  .cost-model-table th,.cost-model-table td { padding:7px!important; font-size:10px; }
  .cost-group-heading { padding:10px; gap:6px; flex-wrap:wrap; }
  .cost-group-heading > span { font-size:12px; margin-left:auto; }
  .cost-group-heading strong { font-size:12px; }
}
* { box-sizing:border-box; }
.key-secret-dialog { width:min(560px,calc(100vw - 32px)); max-height:calc(100vh - 32px); padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--ink); box-shadow:0 16px 64px #192a3833; }
.key-secret-dialog::backdrop { background:#192a3866; }
.key-secret-heading { display:flex; align-items:start; justify-content:space-between; gap:16px; margin-bottom:16px; }
.key-secret-heading h2 { overflow-wrap:anywhere; }
.key-secret-dialog .field { margin-top:16px; }
.key-secret-dialog input { width:100%; min-width:0; font-family:monospace; }
.key-reveal-action { padding:0; border:0; background:none; color:var(--accent); text-align:left; }
body { margin:0; font-size:14px; line-height:1.6; }
a { color:var(--accent); text-decoration:none; }
a:hover { color:var(--accent-dark); }
button,input,select { font:inherit; }
button,summary,select { cursor:pointer; }
button { color:inherit; }
button:disabled { cursor:wait; opacity:.65; }
button:focus-visible,a:focus-visible,summary:focus-visible,select:focus-visible { outline:3px solid #40a79b66; outline-offset:3px; }
h1,h2,h3,p { margin:0; }
h1 { font-size:29px; font-weight:650; letter-spacing:-.7px; line-height:1.4; }
h2 { font-size:16px; font-weight:650; }
h3 { font-size:17px; }
.icon { display:inline-block; width:19px; height:19px; flex:none; vertical-align:middle; }
.site-header { background:var(--surface); border-bottom:1px solid var(--line); }
.header-inner { max-width:1344px; padding:0 40px; min-height:84px; margin:auto; display:flex; align-items:center; gap:50px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--ink); font-size:19px; font-weight:700; letter-spacing:-.4px; flex-shrink:0; }
.brand small { display:block; font-size:10px; letter-spacing:.4px; font-weight:400; color:var(--muted); margin-top:-2px; }
.brand-mark { display:grid; place-items:center; width:40px; height:40px; background:var(--accent); border-radius:12px; color:white; box-shadow:0 4px 10px #16776c16; }
.brand-mark .icon { width:22px; height:22px; }
.main-nav { display:flex; gap:28px; align-self:stretch; }
.main-nav a { display:flex; align-items:center; gap:8px; position:relative; color:#73808c; font-weight:500; }
.main-nav a[aria-current] { color:var(--accent); }
.main-nav a[aria-current]::after { content:""; position:absolute; height:3px; background:var(--accent); bottom:-1px; left:0; right:0; border-radius:3px 3px 0 0; }
.main-nav .icon { width:17px; height:17px; }
.header-actions { display:flex; margin-left:auto; gap:22px; align-items:center; }
.admin-label { display:flex; align-items:center; gap:8px; color:#5c6975; font-size:12px; }
.avatar-mini { border-radius:50%; width:26px; height:26px; background:#ecf1f4; display:grid; place-items:center; color:#6a7a86; font-size:11px; }
.header-note { margin-left:auto; color:var(--muted); font-size:12px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:39px; padding:8px 15px; border:1px solid transparent; border-radius:8px; font-size:13px; font-weight:550; line-height:1.4; white-space:nowrap; transition:background .15s,border-color .15s; }
.button-primary { background:var(--accent); color:#fff; box-shadow:0 2px 4px #16776c12; }
.button-primary:hover { background:var(--accent-dark); color:#fff; }
.button-secondary { border-color:#dfe6eb; background:white; color:#455763; }
.button-secondary:hover { background:#f7f9fa; border-color:#bacccf; }
.button-ghost { background:transparent; color:#78838b; padding:7px 0; min-height:32px; }
.button-ghost:hover { color:var(--accent); }
.button-ghost .icon { width:16px; }
.button-small { font-size:12px; min-height:29px; padding:5px 10px; }
.button-danger { color:white; background:var(--red); }
.button-danger:hover { background:#b53c40; }
.rotate-arrow { transform:rotate(180deg); }
.page-shell { max-width:1344px; margin:0 auto; padding:39px 40px 0; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-bottom:29px; }
.eyebrow { color:#8a97a2; font-size:10px; font-weight:650; letter-spacing:1.9px; margin-bottom:6px; }
.page-description { margin-top:7px; color:var(--muted); font-size:13px; }
.refresh-controls { display:flex; flex-wrap:wrap; align-items:center; gap:10px; justify-content:flex-end; max-width:460px; }
.interval-control { display:flex; align-items:center; gap:10px; color:#7b8792; font-size:12px; }
select { padding:8px 30px 8px 10px; background:white; border:1px solid #dfe6eb; border-radius:8px; color:#405360; height:39px; }
.refresh-caption { flex-basis:100%; text-align:right; color:#8b98a2; font-size:11px; min-height:17px; font-variant-numeric:tabular-nums; }
#refresh-message:not(:empty)::before { content:" · "; }
#refresh-message.error-message { color:var(--amber); }
.summary-grid { display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:20px; margin-bottom:26px; }
.summary-card { background:white; border:1px solid var(--line); border-radius:12px; padding:23px 25px 20px; box-shadow:var(--shadow); }
.summary-primary { background:linear-gradient(120deg,#f5fcf9,#fff 80%); border-color:#dcece7; }
.summary-top { display:flex; justify-content:space-between; align-items:center; color:#5d6e7b; font-size:12px; margin-bottom:13px; }
.summary-top .icon { color:#96a8b3; width:18px; }
.summary-primary .summary-top .icon { color:#61a095; }
.summary-value { display:block; font-size:32px; letter-spacing:-.8px; line-height:1.3; font-weight:650; font-variant-numeric:tabular-nums; }
.summary-primary .summary-value { color:var(--accent-dark); }
.summary-value small { font-size:13px; color:var(--muted); font-weight:400; }
.summary-card p { font-size:11px; color:#8d98a2; margin-top:12px; }
.panel { background:white; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); min-width:0; }
.panel-heading { padding:23px 25px; display:flex; justify-content:space-between; align-items:center; gap:15px; }
.panel-heading p { font-size:11px; color:#96a1aa; margin-top:4px; }
.count-pill { display:inline-grid; place-items:center; background:#f0f4f6; color:#81939f; font-size:11px; font-weight:500; padding:0 7px; border-radius:5px; min-width:22px; margin-left:7px; vertical-align:middle; }
.table-scroll { position:relative; overflow-x:auto; border-radius:0 0 12px 12px; }
table { width:100%; border-collapse:collapse; }
th { color:#8b98a2; background:#f9fafc; font-size:11px; font-weight:500; text-align:left; letter-spacing:.2px; padding:13px 22px; border-top:1px solid #f0f3f5; border-bottom:1px solid var(--line); white-space:nowrap; }
td { padding:24px 22px; border-bottom:1px solid #eff2f4; font-size:12px; vertical-align:middle; }
tbody tr:last-child td { border-bottom:0; }
tbody tr:hover { background:#fbfcfd; }
.balance-table { min-width:970px; }
.balance-table th:first-child,.balance-table td:first-child { padding-left:25px; }
.balance-table td.numeric { min-width:142px; }
.numeric { text-align:right; font-variant-numeric:tabular-nums; }
.unit { color:#a0aab2; }
.account-cell { display:flex; align-items:center; gap:12px; min-width:225px; }
.account-avatar { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:#edf5f3; color:#5c8f84; font-size:14px; font-weight:600; flex:none; }
.account-identity { min-width:0; }
.account-name { font-weight:600; font-size:13px; display:flex; align-items:center; gap:7px; color:#324753; overflow-wrap:anywhere; }
.account-email { display:block; color:#95a0a9; font-size:11px; margin-top:3px; font-weight:400; }
.account-warning { position:relative; display:inline-grid; place-items:center; flex:none; border:1px solid #eab952; color:#a16900; background:#fff5d7; border-radius:50%; font-weight:700; font-size:10px; width:16px; height:16px; padding:0; line-height:1; }
.account-warning::after { content:attr(data-tooltip); display:none; position:absolute; top:20px; left:0; background:#343e45; color:#fff; border-radius:5px; padding:6px 9px; z-index:2; white-space:nowrap; font-size:11px; line-height:1.5; font-weight:400; }
.account-warning:focus::after,.account-warning:hover::after { display:block; }
.balance-value { font-size:18px; font-weight:650; letter-spacing:-.3px; font-variant-numeric:tabular-nums; }
.balance-value.normal { color:var(--accent); }
.balance-value.yellow,.text-amber { color:var(--amber); }
.balance-value.red,.text-red { color:var(--red); }
.balance-value.unknown { color:#9da6af; }
.metric-value { color:#435766; font-size:13px; font-weight:500; }
.metric-placeholder { color:#a3adb5; font-size:12px; }
.cell-note { display:block; margin-top:4px; color:#a0aab2; font-size:10px; font-weight:400; }
.cny-reference { display:block; margin-top:3px; color:#a0aab2; font-size:10px; font-weight:400; }
.cny-grand { margin-top:5px; color:#89959e; font-size:12px; }
.cny-grand strong { color:#344856; font-size:13px; }
.estimate-cell { color:#687d8c; min-width:112px; white-space:nowrap; }
.time-cell { font-variant-numeric:tabular-nums; color:#82929e; font-size:12px; white-space:nowrap; }
.time-cell small { display:block; font-size:10px; margin-top:2px; color:#a6afb6; }
.table-footnote { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; padding:15px 25px; border-top:1px solid var(--line); color:#9ca7af; font-size:10px; }
.table-footnote>span { display:inline-flex; gap:5px; align-items:center; }
.table-footnote .icon { width:13px; height:13px; margin-right:2px; }
.legend-dot { width:5px; height:5px; border-radius:50%; display:inline-block; margin:0 3px 0 12px; }
.legend-dot:first-child { margin-left:0; }
.legend-dot.amber { background:var(--amber); }.legend-dot.red { background:var(--red); }
.dashboard-note { margin:17px 2px 0; color:#9ba6af; font-size:11px; }
.site-footer { text-align:center; color:#abb4bc; font-size:10px; letter-spacing:.3px; padding:35px 20px 25px; }
.site-footer span { padding:0 7px; }
.empty-state { padding:55px 25px 65px; display:flex; flex-direction:column; align-items:center; text-align:center; gap:11px; color:#566b78; }
.empty-icon { width:60px; height:60px; background:#f0f6f4; color:#8cb4a8; border-radius:18px; display:grid; place-items:center; margin-bottom:8px; }.empty-icon .icon { width:27px; height:27px; }
.empty-state p { color:#94a1aa; font-size:12px; }.empty-state .button { margin-top:8px; }
.empty-state.compact { padding:65px 20px; }.empty-state.compact>.icon { width:34px; height:34px; color:#a3b7bf; margin-bottom:8px; }
.management-layout { display:grid; grid-template-columns:300px minmax(0,1fr); gap:24px; align-items:start; }.add-panel .panel-heading { padding-bottom:20px; }.add-panel .panel-heading>.icon { color:#adc0c4; }
.stacked-form { display:grid; gap:20px; padding:0 25px 25px; }.field { display:grid; gap:7px; }label { font-size:12px; color:#5a6c78; font-weight:550; }.optional { font-size:10px; color:#9eabb3; font-weight:400; margin-left:5px; }
.field textarea { width:100%; min-height:140px; resize:vertical; padding:12px; border:1px solid var(--line); border-radius:8px; font:inherit; line-height:1.6; }
input { width:100%; min-width:0; background:#fff; color:#344b59; border:1px solid #dfe7eb; border-radius:7px; padding:10px 11px; font-size:12px; outline:none; transition:border-color .15s,box-shadow .15s; }input:focus { border-color:#62a397; box-shadow:0 0 0 3px #16776c0b; }input::placeholder { color:#b0bac2; }
.field-hint { color:#9aa6af; font-size:10px; line-height:1.7; }.panel-tip { background:#fafcfb; border-top:1px solid var(--line); padding:18px 25px; border-radius:0 0 12px 12px; color:#95a6a3; font-size:10px; display:flex; gap:7px; }.panel-tip .icon { width:14px; height:14px; margin-top:2px; }
.management-table { min-width:675px; }.management-table td { padding:21px 18px; }.management-table th { padding-left:18px; }.management-table td:first-child { min-width:220px; }.management-actions { min-width:178px; }.management-actions>form { display:inline-block; }
.inline-register { display:flex; align-items:center; gap:8px; flex-wrap:nowrap; }
.inline-register input { width:auto; padding:7px 9px; }
.inline-register input[name="tag"] { width:76px; }
.inline-register input[name="group_name"] { width:96px; }
.inline-register select { height:35px; padding:6px 26px 6px 9px; }
.inline-register .button { white-space:nowrap; }
.monitoring-state { white-space:nowrap; color:#789287; font-size:11px; }.monitoring-state::before { content:""; display:inline-block; background:#6caa8d; width:5px; height:5px; border-radius:50%; margin-right:5px; }.monitoring-state.paused { color:#9da5ac; }.monitoring-state.paused::before { background:#b8c0c5; }
.source-label { color:#8a9ca4; font-size:11px; white-space:nowrap; }.source-label.error,.source-label.stale { color:var(--amber); }.source-label.ok { color:#7d9c91; }
.key-editor { display:inline; margin-left:8px; color:#6a8490; font-size:11px; }.key-editor summary { display:inline; list-style:none; }.key-editor summary::-webkit-details-marker { display:none; }.key-editor[open] { display:block; margin:10px 0; }.key-editor form { display:grid; min-width:200px; gap:8px; margin:10px 0; }.key-editor label { font-size:10px; }.delete-link { color:#b29a9c; font-size:11px; margin-left:10px; }.delete-link:hover { color:var(--red); }
.self-sites-table { min-width:0; table-layout:fixed; }
.self-sites-table th:nth-child(1) { width:17%; }
.self-sites-table th:nth-child(2) { width:29%; }
.self-sites-table th:nth-child(3) { width:13%; }
.self-sites-table th:nth-child(4) { width:16%; }
.self-sites-table th:nth-child(5) { width:25%; }
.self-sites-table td:first-child { min-width:0; }
.self-sites-table td { vertical-align:middle; }
.self-site-name,.self-site-url { overflow-wrap:anywhere; }
.site-internal-setting { display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.site-internal-checkbox { display:inline-flex; align-items:center; gap:8px; white-space:nowrap; cursor:pointer; }
.site-internal-checkbox input { width:16px; height:16px; padding:0; margin:0; accent-color:var(--accent); flex:none; }
.site-internal-checkbox input:focus-visible { outline:3px solid #40a79b66; outline-offset:3px; }
.self-site-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; align-items:start; }
.self-site-actions .button { width:100%; }
.self-site-actions .key-editor { display:block; margin:0; }
.self-site-actions .key-editor summary { display:flex; }
.self-site-actions .key-editor[open] { grid-column:1/-1; }
.self-site-actions .key-editor form { min-width:0; margin-bottom:0; }
.self-site-actions .site-delete-button { color:var(--red); }
@media (max-width:900px) {
  .self-sites-table,.self-sites-table tbody,.self-sites-table td { display:block; width:100%; }
  .self-sites-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .self-sites-table tr { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:20px; border-top:1px solid var(--line); }
  .self-sites-table td { padding:0; border:0; }
  .self-sites-table .self-site-name,.self-sites-table .self-site-url,.self-sites-table .self-site-operations { grid-column:1/-1; }
  .self-sites-table .self-site-users::before { content:attr(data-label); display:block; color:var(--muted); font-size:12px; margin-bottom:8px; }
  .self-sites-table .self-site-operations { padding-top:16px; border-top:1px solid var(--line); }
}
.confirmation-panel { max-width:530px; margin:50px auto 100px; padding:36px; }.confirmation-panel h1 { font-size:22px; margin:16px 0; }.confirmation-panel p { line-height:1.8; margin-bottom:12px; overflow-wrap:anywhere; font-size:13px; }.muted { color:var(--muted); }.confirmation-icon { display:grid; place-items:center; background:#fff4e5; color:#c7984f; width:46px; height:46px; border-radius:13px; }.confirmation-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.login-page { min-height:100vh; background:radial-gradient(ellipse at 50% 38%,#eaf3f0 0,transparent 58%),#f7f9fa; }.login-page .site-header { background:transparent; border-bottom:0; }.login-page .page-shell { display:grid; place-items:center; padding:54px 24px 20px; }.login-card { width:100%; max-width:400px; padding:37px 38px 29px; background:#fff; border:1px solid #e3ebe7; border-radius:18px; box-shadow:0 20px 65px #26483e08,0 2px 8px #26483e03; text-align:center; }.login-symbol { width:57px; height:57px; display:grid; place-items:center; background:#edf5f1; color:#408b76; border-radius:16px; margin:0 auto 22px; }.login-symbol .icon { width:27px; height:27px; }.login-card .eyebrow { font-size:9px; letter-spacing:2px; margin-bottom:10px; }.login-card h1 { font-size:27px; }.login-intro { margin-top:13px; color:#92a098; font-size:12px; line-height:1.9; }.login-form { margin-top:31px; text-align:left; }.login-form>label { display:block; margin-bottom:9px; }.input-with-icon { position:relative; }.input-with-icon>.icon { position:absolute; left:13px; top:14px; color:#a5b4ad; width:17px; height:17px; }.input-with-icon input { min-height:46px; padding-left:39px; }.login-submit { margin-top:18px; width:100%; min-height:45px; justify-content:space-between; padding:10px 17px; }.login-footnote { font-size:10px; color:#adb7b2; margin-top:27px; }.form-error { display:flex; align-items:center; gap:6px; color:var(--red); font-size:11px; margin-top:10px; }.form-error .icon { width:14px; height:14px; }
.skip-link { position:absolute; left:12px; top:-100px; padding:8px 12px; background:white; z-index:10; }.skip-link:focus { top:5px; }.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }.notice { margin-top:20px; padding:12px; background:#fff5dc; color:#967030; }
.is-loading .icon { animation:spin 1.2s linear infinite; }@keyframes spin { to { transform:rotate(360deg); } }
@media (max-width:1100px) { .header-inner { gap:30px; }.management-layout { grid-template-columns:270px minmax(0,1fr); }.summary-card { padding:21px; }.summary-value { font-size:28px; } }
@media (max-width:760px) { .header-inner { padding:18px 22px 0; min-height:0; flex-wrap:wrap; gap:15px; }.brand { font-size:17px; }.brand-mark { width:35px; height:35px; border-radius:10px; }.main-nav { order:3; width:100%; gap:30px; min-height:46px; }.header-actions { gap:12px; }.admin-label { display:none; }.header-note { font-size:10px; }.page-shell { padding:27px 20px 0; }.page-heading { align-items:flex-start; flex-direction:column; gap:21px; margin-bottom:22px; }h1 { font-size:25px; }.refresh-controls { justify-content:flex-start; max-width:100%; }.refresh-caption { text-align:left; }.summary-grid { gap:12px; grid-template-columns:1fr 1fr; margin-bottom:20px; }.summary-primary { grid-column:1/-1; }.summary-card { padding:18px; }.summary-value { font-size:25px; }.summary-top { margin-bottom:11px; font-size:11px; }.summary-card p { font-size:10px; margin-top:9px; }.summary-top .icon { width:16px; }.panel-heading { padding:18px; }.panel-heading p { font-size:10px; }.panel-heading h2 { font-size:15px; }.panel-heading .button { font-size:11px; padding:7px 10px; min-height:34px; }.table-footnote { padding:14px 18px; gap:7px; }.dashboard-note { font-size:10px; line-height:1.8; }.management-layout { display:flex; flex-direction:column; gap:20px; }.management-layout>.panel { width:100%; }.stacked-form { padding:0 18px 20px; gap:15px; }.panel-tip { padding:15px 18px; }.confirmation-panel { padding:27px; margin:20px auto 80px; }.login-page .header-inner { padding:23px; }.login-page .page-shell { padding-top:39px; }.login-card { padding:32px 27px 26px; }.login-card h1 { font-size:25px; }.site-footer { font-size:9px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; } }

@media (max-width:760px) { .balance-table { min-width:800px; }.balance-table th,.balance-table td { padding:20px 14px; }.balance-table th:first-child,.balance-table td:first-child { padding-left:18px; }.balance-table td.numeric { min-width:108px; }.balance-table .account-cell { min-width:148px; width:148px; gap:0; }.balance-table .account-avatar { display:none; }.balance-table .account-email { max-width:148px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.balance-table .balance-value { font-size:17px; } }

[hidden] { display:none!important; }
.channel-meta { display:block; font-size:10px; color:#7e969c; margin-top:3px; white-space:nowrap; }
.channel-url { display:block; max-width:240px; font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#8fa1aa; margin-top:3px; }
.channel-options { border-top:1px solid var(--line); padding-top:12px; color:#69808b; font-size:12px; }
.channel-options .field { margin-top:12px; }.channel-options .field-hint { margin-top:8px; }
.currency-total { display:block; }.currency-total + .currency-total { margin-top:8px; }
#channel-form select { width:100%; }input[readonly] { background:#f7f9fa; color:#83959e; }
@media (max-width:760px) { .brand { font-size:16px; }.currency-total { font-size:23px; }.currency-total small { font-size:10px; } }

.edit-panel { max-width:700px; margin:0 auto; }
.form-actions { display:flex; flex-wrap:wrap; gap:12px; }
.form-error { margin:0 25px 20px; }

/* 渠道明细 */
.channel-detail-link { text-decoration:underline; text-decoration-color:#b5d4cd; text-underline-offset:4px; }
.detail-back { display:inline-block; font-size:12px; margin-bottom:10px; }
.detail-name { overflow-wrap:anywhere; }
.detail-filter { padding:22px 25px; margin-bottom:24px; }
.detail-filter-heading { display:flex; align-items:center; gap:15px; margin-bottom:14px; }
.detail-filter-heading span,.detail-help { color:#77838f; font-size:12px; }
.period-options { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; }
.detail-range { display:flex; flex-wrap:wrap; align-items:end; gap:16px; }
.detail-range label { display:flex; flex-direction:column; gap:6px; color:#5d6e7b; font-size:12px; }
.detail-range input { padding:9px 12px; border:1px solid #dfe6eb; border-radius:8px; min-height:39px; background:white; color:var(--ink); max-width:100%; }
.detail-help { margin-top:14px; }
.detail-notice { background:#fff8e9; border:1px solid #f2dfb3; border-radius:8px; padding:12px 16px; color:#91661a; margin:0 0 20px; }
.detail-table { min-width:780px; }
.detail-key-name { display:block; max-width:260px; overflow-wrap:anywhere; font-weight:600; }
.detail-spent { color:var(--accent-dark); font-weight:600; }
.detail-method { line-height:1.9; }
@media (max-width:600px) {
  .detail-filter { padding:18px; }
  .detail-range { display:grid; grid-template-columns:minmax(0,1fr); }
  .detail-range label,.detail-range input { min-width:0; width:100%; }
  .detail-filter-heading { flex-wrap:wrap; gap:5px 15px; }
}

/* 消费趋势: 所有资产本地提供, 图表与明细共用时间范围。 */
.trend-panel { margin-bottom:24px; }
.trend-source { color:var(--accent-dark); background:#edf6f3; padding:5px 10px; border-radius:6px; font-size:11px; white-space:nowrap; }
.trend-body { padding:0 25px 24px; }
.trend-controls { display:flex; flex-wrap:wrap; align-items:end; gap:16px; }
.trend-mode { display:flex; border:1px solid #dde7e9; border-radius:8px; padding:4px; margin:0; gap:4px; min-width:0; }
.trend-mode label { display:flex; gap:7px; align-items:center; padding:8px 10px; border-radius:5px; cursor:pointer; }
.trend-mode label:has(input:checked) { background:#eaf5f1; color:var(--accent-dark); }
.trend-mode input,.trend-key-option input,.trend-cumulative-toggle input { width:14px; height:14px; flex:none; margin:0; padding:0; accent-color:var(--accent); }
.trend-field { display:flex; flex-direction:column; gap:6px; font-size:11px; }
.trend-field select { min-height:39px; min-width:112px; border:1px solid #dfe7eb; border-radius:7px; background:white; padding:8px 12px; color:#344b59; }
.trend-field select:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.trend-key-picker { margin-top:16px; background:#f8fafb; border:1px solid #e3eaee; border-radius:9px; padding:15px; }
.trend-key-toolbar { display:flex; align-items:end; flex-wrap:wrap; gap:12px; }
.trend-key-toolbar .trend-field { flex:1; min-width:150px; }
#trend-selected-count { font-size:11px; color:#748894; padding:10px 0; }
.trend-key-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); max-height:200px; overflow:auto; gap:8px 16px; padding:15px 0 0; }
.trend-key-option { display:flex; gap:8px; align-items:center; cursor:pointer; min-height:30px; font-size:11px; }
.trend-key-option span { overflow-wrap:anywhere; }.trend-key-option:has(input:checked) { color:var(--accent-dark); }
.trend-status { min-height:20px; margin:18px 0; color:#718490; font-size:12px; }
.trend-insights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; padding:17px 20px; border-radius:9px; background:#f7faf9; margin-bottom:20px; }
.trend-insights>div { display:flex; flex-direction:column; gap:6px; min-width:0; }
.trend-insights span { font-size:11px; color:#74868c; }.trend-insights strong { font-size:18px; font-weight:600; color:#294d47; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }.trend-insights small { font-size:10px; color:#8e9ba3; }
.trend-legend { display:flex; flex-wrap:wrap; gap:10px 18px; margin-bottom:16px; font-size:11px; color:#5f737c; }
.trend-legend-item { display:inline-flex; gap:7px; align-items:center; overflow-wrap:anywhere; max-width:100%; }.trend-gap-legend { color:#8b969f; margin-left:auto; }
.trend-swatch { display:inline-block; height:3px; width:18px; flex:none; background:var(--series-color); border-radius:2px; }
.trend-color-0 { --series-color:#176f66; }.trend-color-1 { --series-color:#4778c7; }.trend-color-2 { --series-color:#b77616; }.trend-color-3 { --series-color:#965fba; }.trend-color-4 { --series-color:#ce6165; }.trend-color-5 { --series-color:#4a8c43; }.trend-color-6 { --series-color:#327f99; }
.trend-plot { width:100%; min-width:0; }#trend-svg { width:100%; display:block; overflow:visible; }.trend-axis { fill:#85939e; font-size:11px; }.trend-empty { fill:#7b8f98; font-size:13px; }
#trend-scrubber { padding:0; margin:14px 0; box-shadow:none; accent-color:var(--accent); height:18px; cursor:pointer; }
.trend-tooltip { min-height:86px; padding:14px 17px; border:1px solid #e1e9ed; border-radius:8px; background:#fbfcfd; color:#607681; font-size:11px; }
.trend-tooltip>strong { font-size:12px; font-weight:550; }.trend-tooltip-values { display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:12px; }.trend-tooltip-item { display:inline-flex; align-items:center; gap:7px; overflow-wrap:anywhere; min-width:0; }
#trend-data { margin-top:18px; font-size:12px; color:#5e7a85; }#trend-data summary { cursor:pointer; }#trend-data .table-scroll { margin-top:12px; max-height:330px; border:1px solid var(--line); border-radius:8px; }#trend-data th { position:sticky; top:0; }#trend-data td { padding:10px 16px; white-space:nowrap; }
.trend-method { line-height:1.8; }
@media (max-width:760px) {
  .trend-body { padding:0 18px 18px; }.trend-controls { gap:12px; }.trend-mode { width:100%; }.trend-mode label { flex:1; justify-content:center; }.trend-field { flex:1; min-width:0; }.trend-controls>.button { width:100%; justify-content:center; }
  .trend-key-list { grid-template-columns:1fr; }.trend-insights { padding:14px; grid-template-columns:1fr 1fr; gap:16px 12px; }.trend-insights>div:first-child { grid-column:1/-1; }.trend-insights strong { font-size:16px; }.trend-insights>div:first-child strong { font-size:21px; }.trend-gap-legend { margin-left:0; }.trend-tooltip { padding:12px; }.trend-tooltip-values { flex-direction:column; }.trend-tooltip>strong { font-size:11px; }
}

.trend-cumulative-toggle { display:flex; align-items:center; gap:8px; min-height:39px; font-size:12px; cursor:pointer; }
.trend-color-cumulative { --series-color:#263c64; }.trend-cumulative-axis { fill:#263c64; }
.trend-cumulative-help { margin:0 0 16px; line-height:1.7; }.trend-cumulative-legend { color:#263c64; }

@media (max-width:760px) {
  .trend-controls>.trend-cumulative-toggle { flex-basis:100%; }
  .trend-controls .trend-field select { min-width:0; width:100%; }
}
.key-batch-form { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 16px 0; }
.key-batch-form .field { min-width: 160px; flex: 1; margin: 0; }
#key-directory-table tr[hidden] { display: none; }

#key-directory-table td:first-child { min-width: 70px; width: 70px; }
#key-directory-table input[type="checkbox"] { width: auto; }
.key-directory-search, .key-batch-form { margin-left: 25px; margin-right: 25px; }

.key-owner-field { display:flex; flex-direction:column; gap:8px; min-width:160px; align-items:flex-start; }
.key-owner-field select { width:100%; }

/* 两个清单视角共用筛选与快照，长模型在行内按需展开。 */
.inventory-tabs { display: flex; gap: 12px; flex-wrap: wrap; margin: 24px 0 16px; }
.inventory-filters { display: flex; gap: 12px; align-items: end; flex-wrap: wrap; }
.inventory-filters label { display: grid; gap: 6px; min-width: 145px; }
.inventory-search { flex: 1; }
.inventory-table td { vertical-align: top; max-width: 360px; min-width: 170px; }
.inventory-url, .inventory-models { overflow-wrap: anywhere; }
.inventory-models { max-height: 220px; overflow: auto; white-space: pre-wrap; }
.inventory-reference, .inventory-match { margin-bottom: 9px; }
.inventory-table details { margin-top: 10px; }
@media (max-width: 640px) {
 .inventory-filters label { width: 100%; }
 .inventory-filters input, .inventory-filters select { width: 100%; }
 .inventory-tabs a { flex: 1; text-align: center; }
}

.inventory-overview > details { padding: 0 24px 20px; }
.inventory-overview > p { margin: 0 24px 12px; }
.inventory-list .inventory-filters { padding: 20px 24px 4px; }
.inventory-list > .detail-help { padding: 0 24px; }
.inventory-list > .form-actions { padding: 0 24px; }
@media (max-width: 640px) {
 .inventory-overview .panel-heading { display: block; }
 .inventory-overview .management-actions { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; }
 .inventory-filters .inventory-search { flex-basis: 100%; }
 .inventory-list .inventory-filters { padding: 16px; }
 .inventory-list > .detail-help { padding: 0 16px; }
}

/* Key 台账: 引用摘要、表外保存与可折叠操作。 */
.key-reference-overview > details { padding: 0 24px 20px; }
.key-reference-overview .panel-heading { gap: 16px; flex-wrap: wrap; }
.key-owner-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 0 24px 18px; }
.key-owner-select.owner-changed { border-color: var(--accent); box-shadow: 0 0 0 2px #d6eeea; }
.key-references { min-width: 220px; max-width: 380px; white-space: normal; overflow-wrap: anywhere; }
.key-reference + .key-reference { margin-top: 7px; }
.key-references summary, .key-manual-bindings summary { cursor: pointer; color: var(--accent); }
.key-references details, .key-manual-bindings { margin-top: 10px; }
.key-actions { min-width: 125px; }
.key-actions > summary { display: inline-flex; gap: 14px; cursor: pointer; list-style: none; }
.key-actions > summary::-webkit-details-marker { display: none; }
.key-actions > summary::after { content: "▾"; }
.key-actions[open] > summary::after { content: "▴"; }
.key-actions-menu { display: grid; gap: 3px; padding: 8px; margin-top: 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.key-actions-menu a, .key-actions-menu button { display: block; width: 100%; text-align: left; white-space: nowrap; padding: 8px; border: 0; border-radius: 5px; background: transparent; font: inherit; font-size: 12px; color: var(--ink); text-decoration: none; }
.key-actions-menu a:hover, .key-actions-menu button:hover { background: #edf5f4; }
.key-actions-menu button:disabled { opacity: .45; cursor: not-allowed; }
#registered-key-table td { vertical-align: top; }
/* 已有渠道选择: 全站筛选、ID 排序与页码跳转。 */
.channel-filter-form { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(220px, 2fr) minmax(140px, 1fr) minmax(130px, 1fr); gap: 16px; padding: 0 24px 24px; }
.channel-filter-form .field { min-width: 0; }
.channel-filter-form input, .channel-filter-form select { width: 100%; min-width: 0; }
.channel-filter-form .form-actions { grid-column: 1 / -1; justify-content: flex-end; }
.apply-channel-list { margin-top: 20px; }
.apply-channel-list .panel-heading { gap: 12px; flex-wrap: wrap; }
#apply-channel-table td { padding-top: 14px; padding-bottom: 14px; }
#apply-channel-table td:first-child { min-width: 70px; font-variant-numeric: tabular-nums; color: var(--muted); }
#apply-channel-table td:nth-child(2) { min-width: 180px; }
#apply-channel-table .channel-url { max-width: 380px; overflow-wrap: anywhere; }
#apply-channel-table td:last-child { white-space: nowrap; }
.channel-pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 20px 24px; border-top: 1px solid var(--line); }
.pagination-summary { font-size: 12px; color: var(--muted); }
.pagination-nav, .pagination-numbers, .pagination-jump { display: flex; align-items: center; gap: 6px; }
.pagination-nav { flex-wrap: wrap; justify-content: center; }
.pagination-number { min-width: 32px; justify-content: center; }
.pagination-gap { padding: 0 4px; color: var(--muted); }
.pagination-disabled { opacity: .4; cursor: default; }
.pagination-jump { font-size: 12px; color: var(--muted); }
.pagination-jump input[type="number"] { width: 62px; padding: 7px 6px; text-align: center; }
@media (max-width: 1000px) {
  .channel-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .channel-pagination { justify-content: center; }
  .pagination-summary { flex-basis: 100%; text-align: center; }
}
@media (max-width: 640px) {
  .key-owner-toolbar { padding: 0 16px 16px; }
  .key-reference-overview > details { padding: 0 16px 16px; }
  .channel-filter-form { grid-template-columns: minmax(0, 1fr); padding: 0 16px 16px; }
  .channel-filter-form .form-actions { justify-content: flex-start; }
  .channel-pagination { padding: 16px; gap: 12px; }
  .pagination-nav { width: 100%; }
  .pagination-numbers { order: 1; flex-basis: 100%; justify-content: center; }
}

.channel-selection-bar { display:flex; flex-wrap:wrap; align-items:center; gap:14px; padding:18px 24px; border-bottom:1px solid var(--line); }
.channel-selection-bar label { display:flex; align-items:center; gap:8px; }
.channel-selection-bar small { color:var(--muted); }
#apply-channel-table .channel-select-cell { min-width:58px; width:58px; }
#apply-channel-table input[type="checkbox"] { width:18px; height:18px; }
/* 新建渠道的上游模型选择。 */
.model-picker { border: 1px solid var(--border, #dce5ea); border-radius: 12px; padding: 16px; min-width: 0; }
.model-picker-heading, .model-picker-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.model-picker-heading { justify-content: space-between; }
.model-picker .field { margin: 12px 0; }
.model-picker-list { max-height: 320px; overflow: auto; border: 1px solid var(--border, #dce5ea); border-radius: 8px; margin-top: 10px; }
.model-picker-option { display: flex; align-items: flex-start; gap: 10px; padding: 9px 12px; cursor: pointer; font-weight: 400; border-bottom: 1px solid var(--border, #dce5ea); }
.model-picker-option:last-child { border-bottom: 0; }
.model-picker-option input { flex: 0 0 auto; width: auto; margin-top: 4px; }
.model-picker-option span { overflow-wrap: anywhere; min-width: 0; }
.model-picker-list > .field-hint { padding: 0 12px; }

.unmatched-income-table { table-layout:fixed; }
.unmatched-income-table th:nth-child(1) { width:14%; }
.unmatched-income-table th:nth-child(2) { width:30%; }
.unmatched-income-table th:nth-child(3) { width:40%; }
.unmatched-income-table th:nth-child(4) { width:16%; }
.unmatched-income-table td { padding:16px 22px; vertical-align:top; overflow-wrap:anywhere; }
.unmatched-channel-name { color:var(--muted); }
.unmatched-models { list-style:none; margin:0; padding:0; white-space:normal; }
.unmatched-models li { overflow-wrap:anywhere; line-height:1.65; }
.unmatched-models li + li { margin-top:5px; }
.unmatched-income-total { padding:14px 22px; border-top:1px solid var(--line); }
.history-table { table-layout:fixed; }
.history-table th:first-child { width:64px; }
.history-table td { padding:16px; overflow-wrap:anywhere; vertical-align:top; }
.history-table input[type=checkbox] { width:auto; }
.history-batch { padding:12px 22px; border-top:1px solid var(--line); }
.history-batch p { overflow-wrap:anywhere; }
@media (max-width:640px) {
  .unmatched-income-table, .unmatched-income-table tbody, .unmatched-income-table tr { display:block; width:100%; }
  .unmatched-income-table thead { display:none; }
  .unmatched-income-table tr { padding:12px 18px; border-top:1px solid var(--line); }
  .unmatched-income-table td { display:grid; grid-template-columns:80px minmax(0,1fr); gap:10px; padding:5px 0; border:0; text-align:left; }
  .unmatched-income-table td::before { content:attr(data-label); color:var(--muted); font-size:11px; }
  .history-table, .history-table tbody, .history-table tr { display:block; width:100%; }
  .history-table thead { display:none; }
  .history-table tr { padding:12px 18px; border-top:1px solid var(--line); }
  .history-table td { display:grid; grid-template-columns:90px minmax(0,1fr); gap:10px; padding:5px 0; border:0; text-align:left; }
  .history-table td::before { content:attr(data-label); color:var(--muted); font-size:11px; }
}
.key-cost-factor summary { margin-top:8px; color:var(--accent); cursor:pointer; font-size:11px; }
.key-cost-factor-form { display:grid; min-width:230px; gap:10px; margin-top:10px; }
.key-cost-factor-form .field { gap:4px; }
.inline-register { flex-wrap:wrap; }
.inline-register .cost-factor-field { width:90px; }
.inline-register .cost-factor-effective { width:180px; }
.key-batch-form .cost-factor-recalculate-field, .inline-register .cost-factor-recalculate-field { align-self:end; padding-bottom:9px; }
.archived-table td { overflow-wrap:anywhere; }
@media (max-width:640px) {
  .archived-table, .archived-table tbody, .archived-table tr { display:block; width:100%; min-width:0; }
  .archived-table thead { display:none; }
  .archived-table tr { padding:16px 18px; border-top:1px solid var(--line); }
  .archived-table td, .archived-table td:first-child { display:grid; grid-template-columns:76px minmax(0,1fr); min-width:0; gap:10px; padding:6px 0; border:0; }
  .archived-table td::before { content:attr(data-label); color:var(--muted); font-size:11px; }
}