/* Platform console Cost tab (plan 2026-10-11-004). Chart tokens follow the
   dataviz reference palette, slots 1–5 (validated light + dark). */
.pcost { color-scheme: light;
  --pc-surface:#fcfcfb; --pc-text:#0b0b0b; --pc-text-2:#52514e; --pc-grid:rgba(15,23,42,.08); --pc-axis:rgba(15,23,42,.35);
  --pc-memory:#2a78d6; --pc-cpu:#eb6834; --pc-network:#1baf7a; --pc-disk:#eda100; --pc-backup:#e87ba4;
  --pc-warn:#b45309; --pc-bad:#dc2626; --pc-card:#fff; --pc-line:rgba(0,0,0,.08); }
@media (prefers-color-scheme: dark) {
  :root:where(:not([data-theme="light"])) .pcost { color-scheme: dark;
    --pc-surface:#1a1a19; --pc-text:#f0efec; --pc-text-2:#c3c2b7; --pc-grid:rgba(240,239,236,.10); --pc-axis:rgba(240,239,236,.40);
    --pc-memory:#3987e5; --pc-cpu:#d95926; --pc-network:#199e70; --pc-disk:#c98500; --pc-backup:#d55181;
    --pc-warn:#f59e0b; --pc-bad:#f87171; --pc-card:#1f1f1e; --pc-line:rgba(255,255,255,.10);
  background:#151514; border-color:rgba(255,255,255,.14); color:var(--pc-text); }
}
:root[data-theme="dark"] .pcost { color-scheme: dark;
  --pc-surface:#1a1a19; --pc-text:#f0efec; --pc-text-2:#c3c2b7; --pc-grid:rgba(240,239,236,.10); --pc-axis:rgba(240,239,236,.40);
  --pc-memory:#3987e5; --pc-cpu:#d95926; --pc-network:#199e70; --pc-disk:#c98500; --pc-backup:#d55181;
  --pc-warn:#f59e0b; --pc-bad:#f87171; --pc-card:#1f1f1e; --pc-line:rgba(255,255,255,.10);
  background:#151514; border-color:rgba(255,255,255,.14); color:var(--pc-text); }

.pcost .pcost-tools { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.pcost .pcost-tools select { height:36px; border:1px solid var(--pc-line); border-radius:9px; padding:0 10px; background:var(--pc-card); color:var(--pc-text); font:inherit; font-size:13px; }
.pcost .pcost-ghost { background:transparent !important; color:var(--accent) !important; border:1px solid var(--accent) !important; }
.pcost .pcost-status { margin:12px 0 14px; font-size:12.5px; line-height:1.5; color:var(--pc-text-2); }
.pcost .pcost-status strong { color:var(--pc-text); font-weight:600; }
.pcost .pcost-status .pcost-warn { color:var(--pc-warn); }
.pcost .pcost-status .pcost-bad { color:var(--pc-bad); }
.pcost .pcost-notice { border:1px solid var(--pc-line); border-radius:11px; background:var(--pc-card); padding:14px 16px; font-size:13px; line-height:1.55; color:var(--pc-text); }
.pcost .pcost-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:0 0 16px; }
.pcost .pcost-stat { border:1px solid var(--pc-line); border-radius:10px; background:var(--pc-card); padding:10px 12px; min-width:0; }
.pcost .pcost-stat strong { display:block; font-family:'Syne',sans-serif; font-size:20px; line-height:1.15; color:var(--pc-text); font-variant-numeric:tabular-nums; }
.pcost .pcost-stat span { color:var(--pc-text-2); font-size:9.5px; letter-spacing:.06em; text-transform:uppercase; font-family:'IBM Plex Mono',ui-monospace,monospace; }
.pcost .pcost-h { font:600 13px 'DM Sans',system-ui,sans-serif; color:var(--pc-text); margin:18px 0 8px; display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.pcost .pcost-h small { font-weight:400; color:var(--pc-text-2); font-size:12px; }
.pcost .pcost-chart { position:relative; border:1px solid var(--pc-line); border-radius:11px; background:var(--pc-surface); padding:12px 12px 6px; }
.pcost .pcost-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.pcost .pcost-chart .pcost-bar-hit { fill:transparent; cursor:default; }
.pcost .pcost-chart .pcost-day:focus { outline:none; }
.pcost .pcost-chart .pcost-day:focus .pcost-bar-hit, .pcost .pcost-chart .pcost-day:hover .pcost-bar-hit { fill:var(--pc-grid); }
.pcost .pcost-legend { display:flex; flex-wrap:wrap; gap:6px 14px; margin:8px 2px 4px; font-size:12px; color:var(--pc-text-2); }
.pcost .pcost-legend i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.pcost .pcost-tip { position:absolute; pointer-events:none; z-index:2; min-width:170px; background:var(--pc-card); color:var(--pc-text); border:1px solid var(--pc-line); border-radius:9px; box-shadow:0 6px 20px rgba(0,0,0,.14); padding:8px 10px; font-size:12px; line-height:1.5; }
.pcost .pcost-tip b { display:block; margin-bottom:2px; }
.pcost .pcost-tip .row { display:flex; justify-content:space-between; gap:12px; font-variant-numeric:tabular-nums; }
.pcost .pcost-tip .row i { display:inline-block; width:8px; height:8px; border-radius:2px; margin-right:6px; }
.pcost .pcost-table-wrap { border:1px solid var(--pc-line); border-radius:11px; background:var(--pc-card); overflow-x:auto; }
.pcost table { width:100%; border-collapse:collapse; font-size:12.5px; color:var(--pc-text); }
.pcost th, .pcost td { padding:9px 12px; text-align:right; white-space:nowrap; border-bottom:1px solid var(--pc-line); font-variant-numeric:tabular-nums; }
.pcost th { font:600 9.5px 'IBM Plex Mono',ui-monospace,monospace; letter-spacing:.06em; text-transform:uppercase; color:var(--pc-text-2); background:transparent; }
.pcost th:first-child, .pcost td:first-child { text-align:left; white-space:normal; min-width:150px; }
.pcost tr:last-child td { border-bottom:none; }
.pcost td.pcost-total { font-weight:600; }
.pcost tfoot td { font-weight:600; border-top:1px solid var(--pc-line); }
.pcost td .pcost-slug { display:block; color:var(--pc-text-2); font-size:11px; }
.pcost .pcost-link { background:none; border:none; padding:0; color:var(--accent); font:inherit; font-size:12px; cursor:pointer; text-decoration:underline; }
.pcost details summary { cursor:pointer; }
.pcost details ul { margin:6px 0 0; padding-left:16px; color:var(--pc-text-2); font-size:12px; }
@media (max-width:700px) {
  .pcost .pcost-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pcost .pcost-tools { width:100%; }
}