/* Attention-first Platform Dashboard (/admin). Dark-only (tesote-dark).
   Ported verbatim from the approved production sketch. The whole palette and
   every size lives here; the helper picks semantic *classes*, continuous
   geometry (bar widths, sparkline paths) arrives as data. Icons are inline
   stroke SVG (a <use> into the sprite) sized/colored here — no icon font. */

:root {
  --pd-muted: #9b968b;
  --pd-faint: #6f6a60;
  --pd-line: #2c2b27;
  --pd-track: #2f2e2a;
  --pd-idle-slot: #413f39;
}

.pd-num { font-variant-numeric: tabular-nums; }
.pd-mono { font-family: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace; }

/* bleed to <main>'s padding: full-width sticky head, flush to the very top */
.pd-root { margin: -1rem -1rem 0; font-size: 13px; }
@media (min-width: 640px) { .pd-root { margin: -1.5rem -1.5rem 0; } }

/* ---- inline-SVG icons (stroke, colored by class) ---- */
.ic { width: 1em; height: 1em; stroke: currentcolor; fill: none; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round; flex: none; vertical-align: -.125em; }
.ic.pd-xg { color: var(--color-success) !important; }
.ic.pd-xy { color: var(--color-warning) !important; }
.ic.pd-xr { color: var(--color-error) !important; }
.ic.pd-xb { color: var(--color-info) !important; }
.ic.pd-xa { color: var(--color-accent) !important; }
.ic.pd-xs { color: var(--color-secondary) !important; }
.ic.pd-xp { color: var(--color-primary) !important; }
.ic.pd-xv { color: #8a6bd0 !important; }
.ic.pd-xo { color: #f2803a !important; }
.ic.pd-xm { color: var(--pd-muted) !important; }

/* ---- semantic color tokens (swatch bg + icon color via --pd-lc) ---- */
.pd-c-success { --pd-lc: var(--color-success); }
.pd-c-info { --pd-lc: var(--color-info); }
.pd-c-warning, .pd-c-warn { --pd-lc: var(--color-warning); }
.pd-c-error, .pd-c-err { --pd-lc: var(--color-error); }
.pd-c-accent { --pd-lc: var(--color-accent); }
.pd-c-primary { --pd-lc: var(--color-primary); }
.pd-c-secondary { --pd-lc: var(--color-secondary); }
.pd-c-violet { --pd-lc: #8a6bd0; }
.pd-c-orange { --pd-lc: #f2803a; }
.pd-c-muted { --pd-lc: #b0a99d; }

/* colored card/section titles (restrained emphasis) */
.pd-ct.pd-t-warn { color: var(--color-warning); }
.pd-ct.pd-t-succ { color: var(--color-success); }
.pd-ct.pd-t-err { color: var(--color-error); }
.pd-ct.pd-t-info { color: var(--color-info); }
.pd-ct.pd-t-acc { color: var(--color-accent); }

/* ---- sticky head (pins flush to main's top edge — no overlap) ---- */
.pd-sticky { position: sticky; top: -1rem; z-index: 20; background: var(--color-base-200);
  border-bottom: 1px solid var(--color-base-300); box-shadow: 0 6px 18px -8px rgba(0,0,0,.55); }
@media (min-width: 640px) { .pd-sticky { top: -1.5rem; } }
.pd-topline { display: flex; align-items: center; gap: 16px; padding: 8px 18px 0; }
.pd-topline .pd-live { margin-left: auto; display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--pd-muted); }
.pd-topline .pd-live b { color: var(--color-base-content); font-weight: 600; }
.pd-dot-live { width: 7px; height: 7px; border-radius: 50%; background: var(--color-success); box-shadow: 0 0 0 3px rgba(64,201,142,.14); display: inline-block; }

.pd-pinrow { display: flex; align-items: stretch; gap: 10px; padding: 10px 18px 0; }
.pd-verdict { display: flex; flex-direction: column; justify-content: center; gap: 3px;
  border-radius: .5rem; padding: 8px 13px; min-width: 186px; }
.pd-verdict.is-alert { background: rgba(255,79,79,.14); border: 1px solid rgba(255,79,79,.32); }
.pd-verdict.is-clear { background: rgba(64,201,142,.12); border: 1px solid rgba(64,201,142,.3); }
.pd-verdict-h { display: flex; align-items: center; gap: 8px; font-weight: 750; font-size: 13px; }
.pd-verdict.is-alert .pd-verdict-h { color: var(--color-error); }
.pd-verdict.is-clear .pd-verdict-h { color: var(--color-success); }
.pd-verdict-s { font-size: 10.5px; color: var(--pd-muted); }
.pd-beat { width: 8px; height: 8px; border-radius: 50%; background: var(--color-error); animation: pd-beat 1.8s ease-in-out infinite; }
@keyframes pd-beat { 0%,100% { opacity: .4; } 50% { opacity: 1; } }

.pd-signals { display: grid; grid-template-columns: repeat(5, 1fr); gap: 9px; flex: 1; min-width: 0; }
.pd-sig { background: var(--color-base-100); border: 1px solid var(--color-base-300); border-radius: .5rem;
  padding: 7px 10px; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; }
.pd-sig:hover { border-color: var(--color-accent); }
.pd-sig-k { font-size: 9.5px; letter-spacing: .03em; text-transform: uppercase; color: var(--pd-muted); display: flex; align-items: center; gap: 6px; }
.pd-sig-k .ic { font-size: 12px; }
.pd-sig-v { font-size: 1.3rem; font-weight: 750; line-height: 1.05; margin-top: 1px; }
.pd-sig-t { font-size: 9px; color: var(--pd-faint); }
.pd-sig-spark { position: absolute; right: 7px; bottom: 6px; width: 46px; height: 15px; opacity: .85; }
.pd-sig.is-err { box-shadow: inset 3px 0 0 var(--color-error); } .pd-sig.is-err .pd-sig-v { color: var(--color-error); } .pd-sig.is-err .pd-sig-k .ic { color: var(--color-error); }
.pd-sig.is-warn { box-shadow: inset 3px 0 0 var(--color-warning); } .pd-sig.is-warn .pd-sig-v { color: var(--color-warning); } .pd-sig.is-warn .pd-sig-k .ic { color: var(--color-warning); }
.pd-sig.is-ok { box-shadow: inset 3px 0 0 var(--color-success); } .pd-sig.is-ok .pd-sig-v { color: var(--color-success); } .pd-sig.is-ok .pd-sig-k .ic { color: var(--color-success); }
.pd-sig.is-info { box-shadow: inset 3px 0 0 var(--color-info); } .pd-sig.is-info .pd-sig-k .ic { color: var(--color-info); }

/* ---- funnel bar ---- */
.pd-funnel { display: flex; align-items: center; gap: 12px; padding: 10px 18px 11px; }
.pd-funnel-lbl { font-size: 10px; letter-spacing: .05em; text-transform: uppercase; color: var(--pd-muted);
  font-weight: 700; display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.pd-funnel-lbl .ic { color: var(--color-accent); font-size: 13px; }
.pd-funnel-flow { display: flex; align-items: stretch; gap: 5px; flex: 1; overflow-x: auto; min-width: 0; }
.pd-fstep { display: flex; align-items: center; gap: 8px; background: var(--color-base-100);
  border: 1px solid var(--color-base-300); border-radius: .3rem; padding: 5px 12px; white-space: nowrap; }
.pd-fstep .ic { font-size: 14px; }
.pd-fstep b { font-size: 1.02rem; font-weight: 750; }
.pd-fstep span { font-size: 10.5px; color: var(--pd-muted); }
.pd-fstep.is-merged { border-color: rgba(64,201,142,.4); }
.pd-fstep.is-merged b, .pd-fstep.is-merged .ic { color: var(--color-success); }
.pd-farrow { display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-size: 10px; color: var(--color-accent); font-weight: 700; min-width: 40px; }
.pd-farrow small { color: var(--pd-faint); font-weight: 400; font-size: 9.5px; }

/* ---- range nav ---- */
.pd-range { display: inline-flex; border: 1px solid var(--color-base-300); border-radius: .3rem; overflow: hidden; }
.pd-range-tab { font-size: 11px; padding: 5px 10px; color: var(--pd-muted); border-right: 1px solid var(--pd-line); font-variant-numeric: tabular-nums; background: none; cursor: pointer; }
.pd-range-tab:last-child { border-right: 0; }
.pd-range-tab:hover { color: var(--color-base-content); }
.pd-range-tab.is-active { background: var(--color-accent); color: #fff; font-weight: 600; }

/* ---- tabs (client-side) ---- */
.pd-tabs { display: flex; gap: 2px; padding: 0 14px; background: var(--color-base-200); border-top: 1px solid var(--color-base-300); }
.pd-tab { padding: 10px 15px 9px; font-size: 12.5px; font-weight: 600; color: var(--pd-muted);
  border-bottom: 2px solid transparent; cursor: pointer; display: flex; align-items: center; gap: 8px; background: none; }
.pd-tab .ic { font-size: 14px; }
.pd-tab:hover { color: var(--color-base-content); }
.pd-tab.is-active { color: var(--color-base-content); border-bottom-color: var(--color-accent); }
.pd-tab.is-active .ic { color: var(--color-accent) !important; }

/* ---- panels ---- */
.pd-panel { padding: 15px 18px 40px; }
.pd-grid { display: grid; gap: 12px; }
.pd-grid > * { min-width: 0; }
.pd-grid.pd-two { grid-template-columns: 1.6fr 1fr; }
.pd-grid.pd-eq { grid-template-columns: 1fr 1fr; }
.pd-grid.pd-three { grid-template-columns: 1fr 1fr 1fr; }
.pd-card { background: var(--color-base-100); border: 1px solid var(--color-base-300); border-radius: .5rem; padding: 13px; }
.pd-ch { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.pd-ct { font-size: 11px; letter-spacing: .05em; text-transform: uppercase; color: var(--pd-muted); font-weight: 700; display: flex; align-items: center; gap: 7px; }
.pd-ct .ic { font-size: 14px; }
.pd-cx { font-size: 10.5px; color: var(--pd-faint); }
.pd-dig { font-size: 11px; color: var(--color-secondary); white-space: nowrap; }
.pd-dig:hover { text-decoration: underline; }
.pd-sec { font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--pd-muted); margin: 20px 0 10px; font-weight: 700; display: flex; align-items: center; gap: 10px; }
.pd-sec .ic { color: var(--color-info); font-size: 14px; }
.pd-sec-sub { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--pd-faint); }

/* ---- attention list ---- */
.pd-attn { display: flex; flex-direction: column; gap: 8px; }
.pd-attn-row { display: grid; grid-template-columns: auto auto 1fr auto; gap: 11px; align-items: center;
  background: var(--color-base-200); border: 1px solid var(--color-base-300); border-radius: .3rem; padding: 10px 12px; }
.pd-attn-row:hover { border-color: var(--color-accent); }
.pd-attn-ri { width: 26px; height: 26px; border-radius: 6px; display: grid; place-items: center; font-size: 13px; color: var(--pd-lc); background: color-mix(in srgb, var(--pd-lc) 14%, transparent); }
.pd-sev { font-size: 9px; letter-spacing: .04em; font-weight: 750; padding: 3px 7px; border-radius: 5px; text-transform: uppercase; white-space: nowrap; color: var(--pd-lc); background: color-mix(in srgb, var(--pd-lc) 14%, transparent); }
.pd-attn-msg { font-size: 12.5px; color: var(--color-base-content); }
.pd-attn-msg small { display: block; color: var(--pd-muted); font-size: 11px; margin-top: 2px; }
.pd-attn-go { font-size: 11.5px; color: var(--pd-faint); white-space: nowrap; }
.pd-attn-row:hover .pd-attn-go { color: var(--color-accent); }
.pd-empty { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 34px 12px; gap: 6px; }
.pd-empty .ic { width: 1.8rem; height: 1.8rem; color: color-mix(in srgb, var(--color-success) 55%, transparent); }
.pd-empty-t { font-weight: 650; color: var(--color-base-content); }
.pd-empty-b { font-size: 12px; color: var(--pd-muted); max-width: 30rem; }

/* ---- right-now pulse ---- */
.pd-pulse { display: flex; flex-direction: column; gap: 11px; }
.pd-fleetbar { display: flex; height: 22px; border-radius: 6px; overflow: hidden; border: 1px solid var(--color-base-300); }
.pd-fleetbar i { display: block; height: 100%; }
.pd-fleetbar .pd-i-idle { background: var(--pd-idle-slot); } .pd-fleetbar .pd-i-busy { background: var(--color-success); } .pd-fleetbar .pd-i-off { background: var(--color-error); }
.pd-leg { display: flex; gap: 14px; font-size: 11px; color: var(--pd-muted); margin-top: 7px; flex-wrap: wrap; }
.pd-leg .k { display: inline-flex; align-items: center; gap: 5px; } .pd-leg .k i { width: 9px; height: 9px; border-radius: 2px; display: block; }
.pd-leg b { color: var(--color-base-content); }
.pd-plrow { display: flex; align-items: center; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--color-base-300); }
.pd-plrow:last-child { border-bottom: 0; }
.pd-plrow .pk { color: var(--pd-muted); font-size: 12px; display: flex; align-items: center; gap: 8px; }
.pd-plrow .pk .ic { font-size: 13px; }
.pd-plrow .pv { font-weight: 700; font-size: 14px; }
.pd-srv { display: flex; flex-direction: column; gap: 6px; margin-top: 2px; }
.pd-srv .s { display: flex; align-items: center; gap: 8px; font-size: 11.5px; }
.pd-srv .s .nm { width: 100px; color: var(--pd-muted); display: flex; align-items: center; gap: 6px; }
.pd-srv .s .nm .ic { color: var(--color-secondary); }
.pd-srv .s .bar { flex: 1; height: 6px; background: var(--pd-idle-slot); border-radius: 4px; overflow: hidden; }
.pd-srv .s .bar i { display: block; height: 100%; background: var(--color-success); width: var(--pd-w, 0%); }

/* ---- stacked composition + legend ---- */
.pd-stack { display: flex; height: 14px; border-radius: 5px; overflow: hidden; border: 1px solid var(--color-base-300); }
.pd-stack-seg { height: 100%; min-width: 2px; background: var(--pd-lc, var(--color-base-300)); }
.pd-legend { display: flex; flex-direction: column; gap: 8px; margin-top: 11px; }
.pd-leg-row { display: grid; grid-template-columns: auto 1fr auto auto; gap: 11px; align-items: center; font-size: 12px; }
.pd-leg-row .pd-sw { width: 10px; height: 10px; border-radius: 3px; background: var(--pd-lc); }
.pd-leg-row .nm { color: var(--color-base-content); display: flex; align-items: center; gap: 7px; }
.pd-leg-row .nm .ic { color: var(--pd-lc); font-size: 13px; }
.pd-leg-row .ct2 { color: var(--pd-faint); font-size: 11px; }
.pd-leg-row .vv { font-weight: 650; text-align: right; white-space: nowrap; }
.pd-leg-row .vv small { color: var(--pd-faint); font-weight: 400; }
.pd-leg-row .go { color: var(--color-secondary); font-size: 11px; font-weight: 600; white-space: nowrap; border: 1px solid var(--color-base-300); border-radius: 20px; padding: 3px 11px; }
.pd-leg-row .go:hover { border-color: var(--color-accent); }

/* ---- share-of-total bars ---- */
.pd-hbars { display: flex; flex-direction: column; gap: 9px; }
.pd-hb { display: grid; grid-template-columns: 148px 1fr 78px; gap: 10px; align-items: center; font-size: 12px; }
.pd-hb .hk { color: var(--pd-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 7px; }
.pd-hb .hk .ic { color: var(--pd-lc, var(--pd-faint)); font-size: 13px; }
.pd-hb .ht { height: 9px; background: var(--pd-track); border-radius: 4px; overflow: hidden; }
.pd-hb .ht i { display: block; height: 100%; border-radius: 4px; width: var(--pd-w, 0%); background: var(--pd-lc, var(--color-accent)); }
.pd-hb .hv { text-align: right; font-weight: 600; white-space: nowrap; }
.pd-hb .hv small { color: var(--pd-faint); font-weight: 400; font-size: 10.5px; }

/* ---- axis bars (avg $) — overflow-safe: labels flip inside long bars ---- */
.pd-axbars { display: flex; flex-direction: column; gap: 9px; overflow: hidden; }
.pd-axbar { display: grid; grid-template-columns: 150px 1fr; gap: 10px; align-items: center; font-size: 12px; }
.pd-axbar .hk { color: var(--pd-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 7px; }
.pd-axbar .hk .ic { color: var(--color-accent); font-size: 13px; }
.pd-axtrack { position: relative; height: 15px; }
.pd-axtrack i { position: absolute; left: 0; top: 2px; height: 11px; background: var(--color-accent); border-radius: 3px; width: var(--pd-w, 0%); }
.pd-axtrack .val { position: absolute; top: 0; left: var(--pd-w, 0%); margin-left: 6px; font-size: 11px; font-weight: 650; white-space: nowrap; }
.pd-axtrack .val.pd-inside { left: auto; right: calc(100% - var(--pd-w, 0%)); margin-left: 0; margin-right: 6px; color: #06281b; }
.pd-axtrack .val small { color: var(--pd-faint); font-weight: 400; }
.pd-axtrack .val.pd-inside small { color: rgba(6,40,27,.6); }

/* ---- fleet status grid: ACTIVE = green margin + pulse; idle = colored time ---- */
.pd-fleetgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: 8px; }
.pd-fcell { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: var(--color-base-200);
  border: 1px solid var(--color-base-300); border-radius: .3rem; padding: 9px 11px; }
.pd-fcell:hover { border-color: var(--color-accent); }
.pd-fcell .wn { font-family: ui-monospace, monospace; font-size: 11.5px; color: var(--pd-muted); display: flex; align-items: center; gap: 6px; }
.pd-fcell .wn .ic { color: var(--pd-faint); font-size: 12px; }
.pd-fcell .it { font-family: ui-monospace, monospace; font-size: 13px; font-weight: 750; }
.pd-fcell .stt { font-size: 9.5px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; color: var(--color-success); display: inline-flex; align-items: center; gap: 5px; }
.pd-fcell .stt::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--color-success); animation: pd-beat 1.6s ease-in-out infinite; }
.pd-fcell.is-active { box-shadow: inset 3px 0 0 var(--color-success); border-color: rgba(64,201,142,.42); background: rgba(64,201,142,.06); }
.pd-fcell.is-active .wn { color: var(--color-base-content); }
.pd-fcell.is-active .wn .ic { color: var(--color-success); }
.pd-idle-1 { color: #40c98e; } .pd-idle-2 { color: #9bd170; } .pd-idle-3 { color: #ffc400; } .pd-idle-4 { color: #f2803a; } .pd-idle-5 { color: #ff4f4f; }

/* ---- tables ---- */
.pd-tblwrap { overflow-x: auto; }
.pd-table { border-collapse: collapse; width: 100%; font-size: 12px; }
.pd-table thead th { text-align: left; padding: 8px 12px; font-size: 10px; letter-spacing: .05em; text-transform: uppercase;
  color: var(--pd-muted); font-weight: 700; border-bottom: 1px solid var(--color-base-300); white-space: nowrap; }
.pd-table tbody td { padding: 8px 12px; border-bottom: 1px solid var(--pd-line); vertical-align: middle; }
.pd-table tbody tr:last-child td { border-bottom: 0; }
.pd-table .r { text-align: right; }
.pd-table .ttl { color: var(--color-base-content); font-weight: 550; }
.pd-table .mut { color: var(--pd-muted); }
.pd-lnk { color: var(--color-secondary); } .pd-lnk:hover { text-decoration: underline; }

/* ---- recent activity ---- */
.pd-recent { display: flex; flex-direction: column; }
.pd-rrow { display: grid; grid-template-columns: auto auto 1fr auto auto; gap: 11px; align-items: center; padding: 8px 4px; border-bottom: 1px solid var(--pd-line); }
.pd-rrow:last-child { border-bottom: 0; }
.pd-rrow .si { font-size: 13px; width: 16px; text-align: center; color: var(--pd-lc, var(--pd-muted)); }
.pd-rrow .rid { font-family: ui-monospace, monospace; font-size: 11px; color: var(--pd-faint); }
.pd-rrow .ttl { color: var(--color-base-content); font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-rrow .st { font-size: 10px; font-weight: 700; text-transform: capitalize; white-space: nowrap; color: var(--pd-lc, var(--pd-muted)); }
.pd-rrow .age { font-size: 11px; color: var(--pd-faint); font-family: ui-monospace, monospace; }

/* ---- KPI row ---- */
.pd-kpirow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.pd-kpi { background: var(--color-base-100); border: 1px solid var(--color-base-300); border-radius: .5rem; padding: 11px 13px; }
.pd-kpi .kk { font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: var(--pd-muted); display: flex; align-items: center; gap: 7px; }
.pd-kpi .kk .ic { font-size: 13px; }
.pd-kpi .kv { font-size: 1.45rem; font-weight: 750; margin: 4px 0 1px; }
.pd-kpi .kd { font-size: 10px; color: var(--pd-faint); }

/* ---- filtered chips ---- */
.pd-chips { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pd-chips .lbl { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--pd-muted); font-weight: 700; }
.pd-chip { display: inline-flex; align-items: center; gap: 7px; background: var(--color-base-100); border: 1px solid var(--color-base-300);
  border-radius: 20px; padding: 5px 12px 5px 10px; font-size: 12px; }
.pd-chip:hover { border-color: var(--color-accent); }
.pd-chip .ic { color: var(--pd-lc); font-size: 12px; }
.pd-chip b { font-weight: 700; }
.pd-chip .arw { color: var(--pd-faint); font-size: 11px; }

/* ---- trend small multiples ---- */
.pd-sm { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.pd-tr { background: var(--color-base-100); border: 1px solid var(--color-base-300); border-radius: .5rem; padding: 11px; }
.pd-tr .trk { font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: var(--pd-muted); display: flex; align-items: center; gap: 7px; }
.pd-tr .trk .ic { font-size: 13px; }
.pd-tr .trv { font-size: 1.1rem; font-weight: 750; margin: 4px 0 2px; }
.pd-tr .trd { font-size: 10px; color: var(--pd-muted); }

/* ---- sparkline ---- */
.pd-spark { width: 100%; height: 100%; display: block; }
.pd-spark-line { stroke: currentcolor; stroke-width: 1.5; stroke-linejoin: round; }
.pd-spark-fill { fill: currentcolor; opacity: .13; }
.pd-spark-dot { fill: currentcolor; }
.pd-spark-info { color: var(--color-info); } .pd-spark-success { color: var(--color-success); }
.pd-spark-warning { color: var(--color-warning); } .pd-spark-error { color: var(--color-error); }
.pd-spark-empty { color: var(--pd-faint); font-size: 12px; }
.pd-trbox { height: 34px; margin-top: 8px; }

/* ---- dig-in card ---- */
.pd-digcard { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var(--color-base-100);
  border: 1px dashed var(--color-base-300); border-radius: .5rem; padding: 12px 15px; }
.pd-digcard .dt { font-size: 12px; color: var(--pd-muted); display: flex; align-items: center; gap: 9px; }
.pd-digcard .dt .ic { color: var(--color-info); font-size: 15px; }
.pd-digcard .dt b { color: var(--color-base-content); font-weight: 650; }
.pd-digcard .go { color: var(--color-secondary); font-size: 12px; font-weight: 600; white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }
.pd-digcard .go:hover { text-decoration: underline; }

.pd-servercard .lg { font-size: 1.35rem; font-weight: 750; }
.pd-servercard .pd-ct .ic { color: var(--color-secondary); }

@media (max-width: 1100px) {
  .pd-signals { grid-template-columns: repeat(3, 1fr); }
  .pd-sm, .pd-kpirow { grid-template-columns: repeat(2, 1fr); }
  .pd-grid.pd-two, .pd-grid.pd-eq, .pd-grid.pd-three { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .pd-signals { grid-template-columns: repeat(2, 1fr); }
  .pd-pinrow { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { .pd-beat, .pd-fcell .stt::before { animation: none; } }