.hd {
  --hd-mast: #131c38; --hd-mast-2: #1f2b55; --hd-violet: #5b4f9e; --hd-gray: #d49a3a; --hd-gold: #b8612b;
  --hd-s1: #5b4f9e; --hd-s2: #c0662b; --hd-s3: #008a78; --hd-s4: #b3840c; --hd-s5: #a8467a; --hd-s6: #7d6e5c;
  --hd-ok: #2d7550; --hd-warn: #92560a; --hd-crit: #a63a2a;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .hd {
  --hd-mast: #0e1530; --hd-mast-2: #18214a; --hd-violet: #8a7ed8; --hd-gray: #e0a24a; --hd-gold: #d98a52;
  --hd-s1: #8a7ed8; --hd-s2: #c8743e; --hd-s3: #23a08d; --hd-s4: #ad8a22; --hd-s5: #c4679a; --hd-s6: #a8977f;
  --hd-ok: #6cc9a0; --hd-warn: #e2ab5a; --hd-crit: #ef8a7e; } }
:root[data-theme="dark"] .hd {
  --hd-mast: #0e1530; --hd-mast-2: #18214a; --hd-violet: #8a7ed8; --hd-gray: #e0a24a; --hd-gold: #d98a52;
  --hd-s1: #8a7ed8; --hd-s2: #c8743e; --hd-s3: #23a08d; --hd-s4: #ad8a22; --hd-s5: #c4679a; --hd-s6: #a8977f;
  --hd-ok: #6cc9a0; --hd-warn: #e2ab5a; --hd-crit: #ef8a7e; }
.hd { font-family: var(--font-anthropic-sans); font-variant-numeric: tabular-nums; display: flex; flex-direction: column; gap: var(--cds-gap-xl); }
.hd-head { position: relative; overflow: hidden; display: flex; align-items: center; gap: var(--cds-gap-lg); background: linear-gradient(180deg, var(--hd-mast) 0%, var(--hd-mast-2) 100%); color: #ffffff; border-radius: var(--cds-radius); padding: calc(var(--cds-pad-lg) + 5px) var(--cds-pad-lg) var(--cds-pad-lg); }
.hd-head::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: linear-gradient(90deg, var(--hd-violet) 0 72%, var(--hd-gray) 72% 100%); }
.hd-logo { flex: none; background: #ffffff; border-radius: 12px; padding: 6px 8px; box-shadow: 0 4px 14px rgba(0,0,0,.2); }
.hd-logo img { display: block; height: 72px; width: auto; }
.hd-head-text { min-width: 0; }
.hd-head .eyebrow { font-size: var(--cds-font-size-caption); letter-spacing: .12em; text-transform: uppercase; opacity: .75; font-weight: var(--cds-font-weight-medium); }
.hd-head h1 { font-family: var(--font-anthropic-sans); font-weight: 700; font-size: var(--cds-font-size-title); line-height: 1.15; margin: 4px 0 6px; color: #ffffff; text-wrap: balance; }
.hd-head p { margin: 0; color: rgba(255,255,255,.86); font-size: var(--cds-font-size-body); max-width: 60rem; }
.hd-head p b { font-weight: 700; color: #ffffff; }
.hd-kpi b { font-weight: var(--cds-font-weight-medium); color: var(--color-fg); }
@media (max-width: 40rem) { .hd-head { flex-direction: column; align-items: flex-start; } .hd-logo img { height: 56px; } }
.hd-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: var(--cds-gap-md); }
.hd-kpi { background: var(--color-panel); border: 1px solid var(--color-border-line); border-top: 2px solid var(--hd-gold); border-radius: var(--cds-radius); padding: var(--cds-pad-lg); display: flex; flex-direction: column; gap: var(--cds-gap-xs); }
.hd-kpi .lbl { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.hd-kpi .val { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: var(--cds-font-size-title); line-height: 1.15; min-height: 1.15em; }
.hd-kpi .sub { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.hd-up { color: var(--hd-ok); } .hd-down { color: var(--hd-crit); }
.hd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 26rem), 1fr)); gap: var(--cds-gap-md); }
.hd-card { background: var(--color-panel); border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); padding: var(--cds-pad-lg); min-width: 0; display: flex; flex-direction: column; gap: var(--cds-gap-sm); }
.hd-card h2 { font-size: var(--cds-font-size-heading); font-weight: var(--cds-font-weight-medium); margin: 0; }
.hd-card .note { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); margin: 0; }
.hd-chart { position: relative; min-height: 260px; }
.hd-chart.tall { min-height: 420px; }
.hd-chart svg text { fill: var(--color-fg-muted); font-size: var(--cds-font-size-caption); font-family: var(--font-anthropic-sans); }
.hd-chart svg .vlab { fill: var(--color-fg); }
.hd-legend { display: flex; flex-wrap: wrap; gap: var(--cds-gap-xs) var(--cds-gap-md); font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.hd-legend span { display: inline-flex; align-items: center; gap: 6px; }
.hd-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.hd-tip { position: absolute; pointer-events: none; background: var(--cds-surface-popover); border: 1px solid var(--cds-border); border-radius: var(--cds-radius); box-shadow: var(--cds-shadow-popover); padding: var(--cds-pad-xs) var(--cds-pad-sm); font-size: var(--cds-font-size-caption); white-space: nowrap; z-index: 5; display: none; }
.hd-tip .t { color: var(--cds-text-secondary); margin-bottom: 2px; }
.hd-tip .r { display: flex; align-items: center; gap: 6px; }
.hd-tip .r i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.hd-tip .r b { margin-left: auto; padding-left: var(--cds-gap-md); font-weight: var(--cds-font-weight-medium); }
.hd-tablebox { max-height: 30rem; overflow: auto; }
.hd table { width: 100%; border-collapse: collapse; font-size: var(--cds-font-size-caption); }
.hd th { position: sticky; top: 0; background: var(--color-panel); text-align: left; font-weight: var(--cds-font-weight-medium); color: var(--color-fg-muted); padding: 6px 8px; border-bottom: 1px solid var(--color-border-line); white-space: nowrap; }
.hd th button { all: unset; cursor: pointer; }
.hd th.num, .hd td.num { text-align: right; }
.hd td { padding: 6px 8px; border-bottom: 1px solid var(--color-border-line); vertical-align: middle; }
.hd td.part { color: var(--color-fg-muted); white-space: nowrap; }
.hd td.barc { width: 22%; min-width: 6rem; }
.hd .inbar { height: 8px; border-radius: 4px; background: var(--cds-chart-muted); }
.hd .inbar > div { height: 100%; border-radius: 4px; }
.hd-search { font: inherit; font-size: var(--cds-font-size-caption); padding: 6px 10px; border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); background: var(--color-bg); color: var(--color-fg); width: min(100%, 18rem); }
.hd-fail { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: inherit; color: var(--color-fg-muted); font-size: var(--cds-font-size-caption); }
.hd-fail::before { content: ""; width: .375rem; height: .375rem; border-radius: 50%; background: var(--hd-crit); }
@media (max-width: 40rem) { .hd .hide-sm { display: none; } }
[data-dash-source-state=empty] { color: transparent; }
[data-dash-source-state=refreshing] { opacity: .5; transition: opacity var(--cds-dur-slow); }
.hd-bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-gap-sm) var(--cds-gap-md); }
.hd-bar label { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.hd-select { font: inherit; font-size: var(--cds-font-size-body); padding: 6px 10px; border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); background: var(--color-panel); color: var(--color-fg); min-width: 12rem; }
.hd-section-title { font-size: var(--cds-font-size-heading); font-weight: var(--cds-font-weight-medium); margin: 0 0 calc(-1 * var(--cds-gap-md)); }
.hd-wait { display: flex; flex-direction: column; gap: var(--cds-gap-xs); font-size: var(--cds-font-size-body); }
.hd-wait .big { font-family: var(--font-anthropic-serif); font-size: var(--cds-font-size-title); line-height: 1.15; }
.hd-wait ul { margin: 0; padding-left: 1.1rem; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.hd-pill { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: var(--cds-font-size-caption); font-weight: var(--cds-font-weight-medium); white-space: nowrap; border: 1px solid var(--color-border-line); }
.hd-pill.ok { color: var(--hd-ok); }
.hd-pill.wait { color: var(--hd-warn); }
.hd td.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.75rem; color: var(--color-fg-muted); word-break: break-all; }
.hd td:first-child { white-space: nowrap; }

.hd tr.hd-subtotal th, .hd tr.hd-subtotal td { background: var(--color-bg); font-weight: var(--cds-font-weight-medium); border-top: 1px solid var(--color-border-line); }
.hd tr.hd-total th, .hd tr.hd-total td { font-weight: 700; border-top: 2px solid var(--color-fg); border-bottom: 0; background: var(--color-panel); }
.hd tfoot tr.hd-total th, .hd tfoot tr.hd-total td { position: sticky; bottom: 0; }
.hd tr.hd-subtotal th { position: static; }
.hd tr.hd-subtotal th, .hd tr.hd-total th { text-align: left; color: var(--color-fg); text-transform: none; letter-spacing: 0; font-size: var(--cds-font-size-caption); white-space: normal; }
.hd-credit { border-top: 1px solid var(--color-border-line); padding-top: var(--cds-gap-md); font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); text-align: center; }
.hd-credit a { color: var(--hd-s1); font-weight: var(--cds-font-weight-medium); }
.hd td.num, .hd td.nw { white-space: nowrap; }