/* Personal data board. The original data views change only while custom is active. */
body[data-dbview="custom"] main > .container > :not(.page-header):not(#dataBoard) {
  display: none !important;
}

#dataBoard[hidden],
.dbb-picker[hidden],
.dbb [hidden],
.dbb-picker [hidden],
#dbViews [data-view="custom"][hidden],
.dbb-mobile-entry[hidden],
[data-board-open][hidden] {
  display: none !important;
}

body[data-dbview="custom"] #dataBoard:not([hidden]) { display: block !important; }

.dbb,
.dbb-picker {
  --dbb-text: var(--text-main, #f4f5f7);
  --dbb-muted: var(--text-secondary, #b0b4bd);
  --dbb-line: var(--line-strong, var(--line, rgba(148, 163, 184, .24)));
  color: var(--dbb-text);
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: calc(13px * var(--sv-font-scale, 1));
  line-height: 1.5;
}

.dbb { min-width: 0; padding-bottom: 28px; }
.dbb *, .dbb-picker * { box-sizing: border-box; }
.dbb .dbb-sr,
.dbb-picker .dbb-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.dbb-mobile-entry { flex-shrink: 0; }
.dbb-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.dbb-toolbar > div { min-width: 0; }
.dbb-toolbar h2 { margin: 6px 0 0; font-size: calc(23px * var(--sv-font-scale, 1)); font-weight: 700; letter-spacing: -.025em; }
.dbb-subtitle { margin: 5px 0 0; color: var(--dbb-muted); font-size: calc(12px * var(--sv-font-scale, 1)); }
.dbb-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.dbb-status { margin: 0 0 14px; color: var(--dbb-muted); overflow-wrap: anywhere; }
.dbb-status:empty { display: none; }
.dbb-status[data-error="true"],
.dbb-status.dbb-error { color: var(--down, #f6465d); }

.dbb button,
.dbb-picker button,
.dbb select,
.dbb-picker select,
.dbb-picker input:not([type="checkbox"]) {
  min-height: 36px;
  max-width: 100%;
  padding: 7px 12px;
  border: 1px solid var(--dbb-line);
  border-radius: 7px;
  background: var(--bg-core, #000);
  color: var(--dbb-text);
  font: inherit;
  line-height: 1.35;
}

.dbb button,
.dbb-picker button { cursor: pointer; touch-action: manipulation; }
.dbb button:hover:not(:disabled),
.dbb-picker button:hover:not(:disabled) { background: var(--bg-hover, rgba(128, 128, 128, .1)); }
.dbb button:disabled,
.dbb-picker button:disabled { opacity: .45; cursor: not-allowed; }
.dbb button:focus-visible,
.dbb select:focus-visible,
.dbb-picker button:focus-visible,
.dbb-picker input:focus-visible,
.dbb-picker select:focus-visible,
.dbb-card:focus-visible {
  outline: 2px solid var(--dbb-text);
  outline-offset: 3px;
}

.dbb button.dbb-primary,
.dbb-picker button.dbb-primary {
  border-color: var(--dbb-text);
  background: var(--dbb-text);
  color: var(--bg-core, #000);
  font-weight: 600;
}

.dbb button.dbb-primary:hover:not(:disabled),
.dbb-picker button.dbb-primary:hover:not(:disabled) { background: var(--dbb-text); opacity: .86; }
.dbb button.dbb-back { min-height: 32px; padding: 4px 0; border: 0; background: transparent; color: var(--dbb-muted); text-align: left; }
.dbb button.dbb-back:hover { color: var(--dbb-text); background: transparent; }

.dbb-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px; align-items: start; }
.dbb-card {
  --dbb-min-cols: 3;
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  grid-column: span max(var(--dbb-min-cols), var(--dbb-cols, 3));
  padding: 16px;
  border: 1px solid var(--line-soft, var(--dbb-line));
  border-radius: 10px;
  background: var(--bg-card, #101217);
  overflow-wrap: anywhere;
}

.dbb-card[data-height="fixed"] { height: var(--dbb-height); min-height: var(--dbb-min-height, 240px); }
.dbb-size-compact { --dbb-cols: 3; }
.dbb-size-half { --dbb-cols: 6; }
.dbb-size-full { --dbb-cols: 12; }
.dbb-card-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-bottom: 14px; }
.dbb-card-head h3 { flex: 1 1 auto; margin: 0; font-size: calc(13px * var(--sv-font-scale, 1)); font-weight: 600; line-height: 1.5; }
.dbb-card-scope { color: var(--dbb-muted); font-size: calc(11px * var(--sv-font-scale, 1)); }
.dbb-card-head, .dbb-card-controls { flex-shrink: 0; }
.dbb-card-result { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; min-height: 0; }
.dbb-card-content { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; min-height: 80px; }
.dbb-card[data-height="fixed"] .dbb-card-content { overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.dbb-value { min-width: 0; font-family: var(--font-mono, ui-monospace, monospace); font-size: calc(clamp(20px, 2.2vw, 27px) * var(--sv-font-scale, 1)); font-weight: 650; line-height: 1.35; font-variant-numeric: tabular-nums; letter-spacing: -.025em; }
.dbb-value small { font-family: var(--font-sans, system-ui, sans-serif); font-size: calc(12px * var(--sv-font-scale, 1)); font-weight: 400; letter-spacing: 0; color: var(--dbb-muted); }
.dbb .up { color: var(--up, #2ebd85); }
.dbb .down { color: var(--down, #f6465d); }
.dbb-chart { width: 100%; min-width: 0; margin: 3px 0 12px; }
.dbb-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.dbb-card[data-height="fixed"] .dbb-chart:has(svg) { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 120px; }
.dbb-card[data-height="fixed"] .dbb-chart svg { flex: 1 1 auto; min-height: 100px; height: 100%; }
.dbb-chart svg text { font-family: var(--font-sans, system-ui, sans-serif); }
.dbb-chart:empty { display: none; }
.dbb-chart > p { margin: 8px 0 0; color: var(--dbb-muted); font-size: calc(11px * var(--sv-font-scale, 1)); }
.dbb-breadth { padding-top: 10px; }
.dbb-ratio { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin-bottom: 8px; font-family: var(--font-mono, ui-monospace, monospace); font-size: calc(12px * var(--sv-font-scale, 1)); font-variant-numeric: tabular-nums; }
.dbb-ratio > :first-child { color: var(--down, #f6465d); }
.dbb-ratio > :last-child { color: var(--up, #2ebd85); }
.dbb-ratio-bar { display: flex; width: 100%; height: 10px; border-radius: 5px; background: var(--line, rgba(128, 128, 128, .15)); overflow: hidden; }
.dbb-ratio-bar > i { display: block; flex: 0 0 auto; height: 100%; }
.dbb-card-foot { flex-shrink: 0; margin-top: auto; padding-top: 12px; color: var(--dbb-muted); font-size: calc(11px * var(--sv-font-scale, 1)); line-height: 1.6; }
.dbb-card-foot a { color: inherit; text-underline-offset: 2px; }
.dbb-card-foot a:hover { color: var(--dbb-text); }
.dbb-card-foot > span { display: inline-block; margin-right: 8px; }
.dbb-card-foot time { display: block; font-variant-numeric: tabular-nums; }
.dbb-card-controls { display: none; }
#dataBoard[data-editing="true"] .dbb-card-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line-soft, var(--dbb-line));
}

.dbb-card-controls button,
.dbb-card-controls select { min-height: 34px; padding: 6px 8px; font-size: calc(11px * var(--sv-font-scale, 1)); }
.dbb-card-controls label { flex: 1 1 74px; min-width: 0; }
.dbb-card-controls select { width: 100%; min-width: 0; }
.dbb-card-controls .dbb-drag { min-width: 34px; font-size: 19px; line-height: 1; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.dbb-card-controls .dbb-drag:active { cursor: grabbing; }
.dbb-card.dbb-dragging { opacity: .5; }
.dbb-card.dbb-drop-target { border-color: var(--dbb-text); outline: 2px solid var(--dbb-text); outline-offset: 2px; }
.dbb-size-readout { flex-basis: 100%; min-width: 0; padding-right: 28px; color: var(--dbb-muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.dbb button.dbb-resize { position: absolute; right: 0; bottom: 0; width: 44px; min-height: 44px; padding: 14px 5px 2px 17px; border: 0; border-radius: 0 0 9px 0; background: transparent; color: var(--dbb-muted); font-size: 18px; line-height: 1; cursor: nwse-resize; touch-action: none; user-select: none; -webkit-user-select: none; }
.dbb-card.dbb-resizing { outline: 2px solid var(--dbb-text); outline-offset: 1px; }
.dbb-gesturing, .dbb-gesturing * { user-select: none; -webkit-user-select: none; }
.dbb-gesturing iframe { pointer-events: none; }
#dataBoard[data-editing="true"] .dbb-card { border-style: dashed; }
.dbb-empty { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 58px 24px; border: 1px dashed var(--dbb-line); border-radius: 10px; background: var(--bg-panel, #08090c); text-align: center; }
.dbb-empty h3 { flex-basis: 100%; margin: 0; font-size: calc(19px * var(--sv-font-scale, 1)); font-weight: 600; }
.dbb-empty p { flex-basis: 100%; margin: 0 0 12px; color: var(--dbb-muted); }
.dbb-empty .dbb-actions { width: auto; justify-content: center; }

.dbb-picker {
  width: min(680px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  max-height: min(760px, 90vh);
  max-height: min(760px, 90dvh);
  margin: auto;
  padding: 0;
  border: 1px solid var(--dbb-line);
  border-radius: 12px;
  background: var(--bg-core, #000);
  box-shadow: var(--shadow-soft, 0 16px 60px rgba(0, 0, 0, .2));
  overflow: hidden;
  overscroll-behavior: contain;
}

.dbb-picker:not([open]) { display: none; }
.dbb-picker[open] { display: flex; flex-direction: column; }
.dbb-picker::backdrop { background: rgba(0, 0, 0, .48); }
.dbb-dialog-head { display: flex; flex: none; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 20px 12px; }
.dbb-dialog-head h2,
.dbb-dialog-head h3 { margin: 0; font-size: calc(19px * var(--sv-font-scale, 1)); font-weight: 650; }
.dbb-dialog-head button { flex: none; min-width: 36px; padding: 6px; }
.dbb-search { display: block; flex: none; margin: 0 20px 12px; }
.dbb-search input { width: 100%; }
.dbb-picker input.dbb-search { width: calc(100% - 40px); max-width: calc(100% - 40px); }
.dbb-picker input::placeholder { color: var(--text-muted, #8a8f9c); opacity: 1; }
.dbb-picker-filters { display: flex; flex: none; flex-wrap: wrap; gap: 6px; padding: 0 20px 12px; }
.dbb-picker-filters button { min-height: 32px; padding: 5px 10px; border-radius: 6px; font-size: calc(12px * var(--sv-font-scale, 1)); }
.dbb-picker-filters button[aria-pressed="true"],
.dbb-picker-filters button.on,
.dbb-picker-filters button.active { border-color: var(--dbb-text); background: var(--dbb-text); color: var(--bg-core, #000); }
.dbb-picker-context { display: flex; flex: none; flex-wrap: wrap; align-items: flex-end; gap: 10px; margin: 0 20px 12px; padding: 12px; border-radius: 8px; background: var(--bg-panel, #08090c); }
.dbb-picker-context label { display: flex; flex: 1 1 120px; flex-direction: column; gap: 5px; min-width: 0; color: var(--dbb-muted); font-size: calc(12px * var(--sv-font-scale, 1)); }
.dbb-picker-context select,
.dbb-picker-context input { width: 100%; min-width: 0; }
.dbb-picker-context p { flex-basis: 100%; margin: 0; color: var(--dbb-muted); font-size: calc(11px * var(--sv-font-scale, 1)); }
.dbb-picker-hint,
.dbb-picker-error { flex: none; margin: 0 20px 12px; font-size: calc(12px * var(--sv-font-scale, 1)); line-height: 1.55; overflow-wrap: anywhere; }
.dbb-picker-hint { color: var(--dbb-muted); }
.dbb-picker-error { color: var(--down, #f6465d); }
.dbb-picker-error:empty { display: none; }
.dbb-options { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding: 0 20px 12px; }
.dbb-option { display: grid; grid-template-columns: 18px minmax(0, 1fr); column-gap: 11px; row-gap: 3px; align-items: start; margin: 0 0 7px; padding: 12px; border: 1px solid var(--line-soft, var(--dbb-line)); border-radius: 8px; background: var(--bg-card, #101217); cursor: pointer; overflow-wrap: anywhere; }
.dbb-option:hover { border-color: var(--dbb-line); background: var(--bg-hover, rgba(128, 128, 128, .1)); }
.dbb-option:has(input:checked) { border-color: var(--dbb-text); }
.dbb-option:has(input:focus-visible) { outline: 2px solid var(--dbb-text); outline-offset: 2px; }
.dbb-option input[type="checkbox"] { grid-column: 1; grid-row: 1 / span 2; width: 17px; height: 17px; margin: 2px 0 0; accent-color: var(--dbb-text); cursor: pointer; }
.dbb-option > :not(input) { grid-column: 2; min-width: 0; }
.dbb-option strong,
.dbb-option b { font-size: calc(13px * var(--sv-font-scale, 1)); font-weight: 600; }
.dbb-option small,
.dbb-option p,
.dbb-option-description { margin: 3px 0 0; color: var(--dbb-muted); font-size: calc(11.5px * var(--sv-font-scale, 1)); line-height: 1.55; }
.dbb-option small { display: block; }
.dbb-option:has(input:disabled) { cursor: default; color: var(--dbb-muted); }
.dbb-options > p { margin: 20px 0; color: var(--dbb-muted); text-align: center; }
.dbb-dialog-foot { display: flex; flex: none; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; padding: 14px 20px; border-top: 1px solid var(--line-soft, var(--dbb-line)); background: var(--bg-core, #000); }
.dbb-dialog-foot > span { flex: 1 1 140px; color: var(--dbb-muted); font-size: calc(12px * var(--sv-font-scale, 1)); }

/* The native mobile data landing page hides its desktop container by design. */
html.sv-m body.sv-hq-data[data-dbview="custom"] main > .container { display: block !important; }
html.sv-m body.sv-hq-data[data-dbview="custom"] .m-db,
html.sv-m body.sv-hq-data[data-dbview="custom"] .m-db-dhd { display: none !important; }
html.sv-m body.sv-hq-data[data-dbview="custom"] #dataBoard:not([hidden]) { display: block !important; padding-top: 10px; }
html.sv-m body.sv-hq-data[data-dbview="custom"] .dbb-back { display: inline-flex; }


/* 浅色主题：中性控件、语义文字与浮层跟随全站色阶。 */
:root[data-theme="light"] .dbb-picker::backdrop { background: rgba(32, 33, 36, .20); }
@media (max-width: 800px) {
  .dbb-toolbar { align-items: flex-start; flex-wrap: wrap; }
  .dbb-toolbar > div:first-child { flex: 1 1 220px; }
  .dbb-card { --dbb-min-cols: 6; }
  .dbb-card { padding: 14px; }
}

@media (max-width: 520px) {
  .dbb { padding-bottom: 20px; }
  .dbb-toolbar { gap: 12px; }
  .dbb-toolbar h2 { font-size: calc(21px * var(--sv-font-scale, 1)); }
  .dbb-actions { width: 100%; }
  .dbb button, .dbb-picker button, .dbb select, .dbb-picker select { min-height: 40px; }
  .dbb-grid { gap: 9px; }
  .dbb-card[data-kind="chart"], .dbb-card[data-kind="panel"] { --dbb-min-cols: 12; }
  .dbb-card { padding: 12px; }
  .dbb-card-head { gap: 3px; margin-bottom: 11px; }
  .dbb-card-scope { flex-basis: 100%; }
  .dbb-value { font-size: calc(20px * var(--sv-font-scale, 1)); }
  .dbb-card-controls { gap: 6px; }
  .dbb-card-controls button { min-width: 40px; }
  .dbb-empty { padding: 40px 16px; }
  .dbb-picker { width: calc(100vw - 16px); max-width: calc(100vw - 16px); max-height: 95vh; max-height: 95dvh; border-radius: 10px; }
  .dbb-dialog-head { padding: 12px 14px 10px; }
  .dbb-search { margin-right: 14px; margin-left: 14px; }
  .dbb-picker input.dbb-search { width: calc(100% - 28px); max-width: calc(100% - 28px); }
  .dbb-picker-filters { padding-right: 14px; padding-left: 14px; gap: 5px; }
  .dbb-picker-filters button { min-height: 36px; }
  .dbb-picker-context { margin-right: 14px; margin-left: 14px; padding: 10px; }
  .dbb-picker-hint, .dbb-picker-error { margin-right: 14px; margin-left: 14px; }
  .dbb-picker-context label { flex-basis: 95px; }
  .dbb-options { padding-right: 14px; padding-left: 14px; }
  .dbb-dialog-foot { padding: 12px 14px max(12px, env(safe-area-inset-bottom)); }
}

@media (max-width: 380px) {
  .dbb-card { --dbb-min-cols: 12; }
  .dbb-actions { gap: 6px; }
  .dbb-picker-context { gap: 7px; }
}

/* In landscape or with a software keyboard, keep every picker control reachable. */
@media (max-height: 560px) {
  .dbb-picker[open] { overflow-y: auto; }
  .dbb-options { flex: none; overflow-y: visible; min-height: 80px; }
  .dbb-dialog-head { padding-top: 10px; padding-bottom: 8px; }
  .dbb-dialog-foot { position: sticky; bottom: 0; z-index: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .dbb *, .dbb-picker * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Complete panels share the original renderer inside their own document. */
.dbb-card[data-kind="panel"][data-height="auto"] { height: 620px; }
.dbb-card[data-kind="panel"] .dbb-card-result { overflow: hidden; min-height: 120px; }
.dbb-panel-slot { flex: 1 1 auto; min-height: 0; height: 100%; }
.dbb-panel-frame { display: block; width: 100%; height: 100%; border: 0; color-scheme: normal; }
.dbb-panel-frame.dbb-panel-expanded { position: fixed; inset: 0; width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; z-index: 2147482000; background: var(--bg-card); }
.dbb-panel-frame.dbb-panel-expanded::backdrop { background: var(--bg-card); }
.dbb-card.dbb-resizing .dbb-panel-frame, .dbb-card.dbb-dragging .dbb-panel-frame { pointer-events: none; }
