/* Tema del panel Community Tech · marca Marta Lorenzini
   Paleta: navy #271C67 · sage #B4CBAA · fondo #F5F4F0 */

:root {
  --ml-navy: #271C67;
  --ml-sage: #B4CBAA;
  --ml-paper: #F5F4F0;

  --color-bg: #F5F4F0;
  --color-panel: #FFFFFF;
  --color-fg: #1E1A33;
  --color-fg-muted: #5F5B6E;
  --color-border-line: #E1DED6;
  --color-ok: #2F7D4F;
  --color-warn: #A86A00;
  --color-bad: #B3261E;

  --serie-1: #271C67;
  --serie-2: #6E9A62;
  --serie-3: #C07A2C;
  --serie-4: #8C82C9;
  --serie-5: #2E7D8C;
  --serie-6: #B4546A;
  --serie-7: #7A6F45;
  --serie-8: #4A4A4A;

  --cds-chart-grid: #E8E5DD;
  --cds-chart-muted: #C9D9C1;
  --cds-chart-reference-tint: rgba(39, 28, 103, .07);
  --cds-surface-popover: #FFFFFF;
  --cds-border: #D6D2C8;
  --cds-shadow-popover: 0 4px 16px rgba(30, 26, 51, .14);
  --cds-text-secondary: #5F5B6E;

  --font-anthropic-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-anthropic-serif: "Fraunces", Georgia, "Times New Roman", serif;

  --cds-font-size-caption: 0.8125rem;
  --cds-font-size-body: 0.9375rem;
  --cds-font-size-heading: 1.125rem;
  --cds-font-size-title: 1.75rem;
  --cds-font-weight-medium: 600;

  --cds-gap-xs: 4px;
  --cds-gap-sm: 8px;
  --cds-gap-md: 16px;
  --cds-gap-lg: 24px;
  --cds-pad-xs: 4px;
  --cds-pad-sm: 8px;
  --cds-pad-md: 12px;
  --cds-pad-lg: 20px;
  --cds-radius: 10px;
  --cds-dur-slow: 300ms;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #15121F;
    --color-panel: #1F1B2E;
    --color-fg: #EDEAF5;
    --color-fg-muted: #A8A3B8;
    --color-border-line: #342F47;
    --color-ok: #6FC08F;
    --color-warn: #E3A64A;
    --color-bad: #F0857D;

    --serie-1: #A99EF0;
    --serie-2: #B4CBAA;
    --serie-3: #E3A15C;
    --serie-4: #7FB7C4;
    --serie-5: #6CC1CF;
    --serie-6: #E48AA0;
    --serie-7: #C9BC8A;
    --serie-8: #BDBDBD;

    --cds-chart-grid: #2C2840;
    --cds-chart-muted: #4E6448;
    --cds-chart-reference-tint: rgba(169, 158, 240, .12);
    --cds-surface-popover: #262138;
    --cds-border: #3E3855;
    --cds-shadow-popover: 0 4px 16px rgba(0, 0, 0, .5);
    --cds-text-secondary: #A8A3B8;
  }
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

html, body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-fg);
  font-family: var(--font-anthropic-sans);
  font-size: 16px;
  line-height: 1.45;
  -webkit-text-size-adjust: 100%;
}

.ml-top {
  border-bottom: 1px solid var(--color-border-line);
  background: var(--color-panel);
}
.ml-top-in {
  max-width: 1180px;
  margin-inline: auto;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.ml-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--color-fg);
  text-decoration: none;
  font-weight: 600;
}
.ml-mono {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--ml-navy);
  color: var(--ml-sage);
  font-family: var(--font-anthropic-serif);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .02em;
}
.ml-brand small { display: block; font-weight: 400; color: var(--color-fg-muted); font-size: 12px; }
.ml-top nav { font-size: 13px; color: var(--color-fg-muted); }
.ml-top nav a { color: inherit; }

#dash-root {
  max-width: 1180px;
  margin-inline: auto;
  padding: 24px 16px 48px;
}

.ml-foot {
  max-width: 1180px;
  margin-inline: auto;
  padding: 16px 16px 32px;
  font-size: 12px;
  color: var(--color-fg-muted);
  border-top: 1px solid var(--color-border-line);
}

.dash-skeleton { opacity: .5; }
[data-dash-source-state=loading] { opacity: .55; transition: opacity var(--cds-dur-slow); }

svg text { font-family: var(--font-anthropic-sans); }