:root {
  --awm-bg: #f8fafc;
  --awm-surface: #ffffff;
  --awm-surface-soft: #f1f5f9;
  --awm-border: rgba(15, 23, 42, 0.1);
  --awm-border-strong: rgba(15, 23, 42, 0.16);
  --awm-text-soft: #475569;
  --awm-blue: #2563eb;
  --awm-cyan: #0891b2;
  --awm-green: #0f766e;
  --awm-amber: #d97706;
  --awm-shadow: 0 18px 55px rgba(15, 23, 42, 0.1);
  --awm-shadow-soft: 0 10px 28px rgba(15, 23, 42, 0.08);
  --md-primary-fg-color: #0f172a;
  --md-primary-fg-color--light: #1e293b;
  --md-primary-fg-color--dark: #020617;
  --md-accent-fg-color: #2563eb;
}

[data-md-color-scheme="slate"] {
  --awm-bg: #090d14;
  --awm-surface: #101721;
  --awm-surface-soft: #111c2b;
  --awm-border: rgba(148, 163, 184, 0.16);
  --awm-border-strong: rgba(148, 163, 184, 0.24);
  --awm-text-soft: #a6b3c4;
  --awm-blue: #60a5fa;
  --awm-cyan: #22d3ee;
  --awm-green: #2dd4bf;
  --awm-amber: #fbbf24;
  --awm-shadow: 0 22px 70px rgba(0, 0, 0, 0.38);
  --awm-shadow-soft: 0 16px 42px rgba(0, 0, 0, 0.26);
  --md-default-bg-color: #090d14;
  --md-default-fg-color: #d9e2ef;
  --md-code-bg-color: #0f1723;
  --md-accent-fg-color: #60a5fa;
}

html {
  scroll-padding-top: 4.2rem;
}

body {
  background:
    radial-gradient(circle at 12% 0, rgba(37, 99, 235, 0.08), transparent 30rem),
    radial-gradient(circle at 95% 8%, rgba(15, 118, 110, 0.08), transparent 28rem),
    var(--awm-bg);
}

.md-header {
  border-bottom: 1px solid var(--awm-border);
  background: rgba(255, 255, 255, 0.88);
  color: #0f172a;
  backdrop-filter: blur(16px);
  box-shadow: none;
}

[data-md-color-scheme="slate"] .md-header {
  background: rgba(9, 13, 20, 0.88);
  color: #f8fafc;
}

.md-tabs {
  border-bottom: 1px solid var(--awm-border);
  background: rgba(255, 255, 255, 0.76);
  backdrop-filter: blur(16px);
}

[data-md-color-scheme="slate"] .md-tabs {
  background: rgba(9, 13, 20, 0.72);
}

.md-tabs__link,
.md-header__topic,
.md-header__title {
  font-weight: 650;
}

.md-search__form {
  border: 1px solid var(--awm-border);
  border-radius: 8px;
  background: var(--awm-surface-soft);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.48);
}

.md-search__input {
  font-size: 0.82rem;
}

.md-main__inner {
  margin-top: 0;
}

.md-content {
  max-width: 960px;
}

.md-content__inner {
  padding-top: 1.55rem;
}

.md-typeset {
  color: var(--md-default-fg-color);
  font-size: 0.86rem;
  line-height: 1.74;
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4 {
  letter-spacing: 0;
}

.md-typeset h1 {
  margin: 0 0 1rem;
  color: var(--md-default-fg-color);
  font-size: 2.35rem;
  font-weight: 760;
  line-height: 1.08;
}

.md-typeset h2 {
  margin-top: 2.25rem;
  border-bottom: 1px solid var(--awm-border);
  padding-bottom: 0.42rem;
  font-size: 1.36rem;
  font-weight: 720;
}

.md-typeset h3 {
  margin-top: 1.55rem;
  font-size: 1.02rem;
  font-weight: 720;
}

.md-typeset p,
.md-typeset li {
  color: color-mix(in srgb, var(--md-default-fg-color) 84%, transparent);
}

.md-typeset a {
  text-underline-offset: 0.16em;
}

.md-sidebar {
  padding-top: 0.5rem;
}

.md-nav {
  font-size: 0.72rem;
}

.md-nav__title {
  color: var(--md-default-fg-color);
  font-weight: 720;
}

.md-nav__link {
  margin-top: 0.16rem;
  border-radius: 7px;
  padding: 0.28rem 0.4rem;
  line-height: 1.35;
}

.md-nav__link:hover {
  background: var(--awm-surface-soft);
}

.md-nav__link--active,
.md-nav__link[aria-current="page"] {
  color: var(--awm-blue);
  font-weight: 700;
}

.md-sidebar--secondary .md-nav__link {
  border-left: 2px solid transparent;
  border-radius: 0 6px 6px 0;
}

.md-sidebar--secondary .md-nav__link--active,
.md-sidebar--secondary .md-nav__link[aria-current="true"] {
  border-left-color: var(--awm-blue);
  background: color-mix(in srgb, var(--awm-blue) 10%, transparent);
}

.md-typeset .awm-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.65fr);
  gap: 1.2rem;
  margin: 0 0 1.8rem;
  padding: 2.2rem;
  border: 1px solid var(--awm-border);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(37, 99, 235, 0.1), transparent 36%),
    linear-gradient(160deg, rgba(15, 118, 110, 0.12), transparent 48%),
    var(--awm-surface);
  box-shadow: var(--awm-shadow);
}

.awm-hero__content h1 {
  max-width: 14ch;
  margin-bottom: 0.75rem;
  font-size: 3.15rem;
}

.awm-hero__content > p {
  max-width: 45rem;
  color: var(--awm-text-soft);
  font-size: 1rem;
}

.awm-eyebrow {
  display: inline-flex;
  align-items: center;
  margin-bottom: 0.85rem;
  border: 1px solid color-mix(in srgb, var(--awm-blue) 28%, var(--awm-border));
  border-radius: 999px;
  padding: 0.18rem 0.56rem;
  background: color-mix(in srgb, var(--awm-blue) 8%, var(--awm-surface));
  color: var(--awm-blue);
  font-size: 0.68rem;
  font-weight: 760;
}

.awm-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 1.15rem;
}

.md-typeset .md-button {
  margin: 0;
  border-radius: 7px;
  padding: 0.58em 1em;
  font-weight: 720;
}

.md-typeset .md-button--primary {
  border-color: var(--awm-blue);
  background: var(--awm-blue);
  color: #ffffff;
  box-shadow: 0 12px 24px rgba(37, 99, 235, 0.22);
}

.awm-hero__panel {
  align-self: stretch;
  border: 1px solid var(--awm-border);
  border-radius: 8px;
  padding: 1rem;
  background: color-mix(in srgb, var(--awm-surface) 82%, var(--awm-surface-soft));
}

.awm-hero__panel > span {
  display: block;
  margin-bottom: 0.5rem;
  color: var(--awm-text-soft);
  font-size: 0.68rem;
  font-weight: 780;
  text-transform: uppercase;
}

.awm-hero__panel ol {
  margin: 0;
}

.awm-hero__panel li {
  margin-bottom: 0.36rem;
  color: var(--md-default-fg-color);
  font-size: 0.75rem;
}

.awm-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.8rem;
  margin: 1.5rem 0 2rem;
}

.md-typeset .awm-card {
  display: block;
  height: 100%;
  border: 1px solid var(--awm-border);
  border-radius: 8px;
  padding: 1rem;
  background: var(--awm-surface);
  color: inherit;
  text-decoration: none;
  box-shadow: var(--awm-shadow-soft);
  transition: border-color 150ms ease, transform 150ms ease, box-shadow 150ms ease;
}

.md-typeset .awm-card:hover {
  border-color: color-mix(in srgb, var(--awm-blue) 42%, var(--awm-border));
  transform: translateY(-2px);
  box-shadow: var(--awm-shadow);
}

.awm-card span {
  display: inline-grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  margin-bottom: 0.75rem;
  border-radius: 7px;
  background: color-mix(in srgb, var(--awm-cyan) 12%, var(--awm-surface-soft));
  color: var(--awm-cyan);
  font-size: 0.68rem;
  font-weight: 780;
}

.md-typeset .awm-card h3 {
  margin: 0 0 0.38rem;
  font-size: 0.9rem;
}

.md-typeset .awm-card p {
  margin: 0;
  color: var(--awm-text-soft);
  font-size: 0.73rem;
  line-height: 1.5;
}

.awm-feature-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  margin: 1rem 0 2rem;
  border: 1px solid var(--awm-border);
  border-radius: 8px;
  background: var(--awm-border);
}

.awm-feature-strip > div {
  padding: 1rem;
  background: var(--awm-surface);
}

.awm-feature-strip h3 {
  margin-top: 0;
}

.awm-feature-strip p {
  margin-bottom: 0;
  color: var(--awm-text-soft);
  font-size: 0.75rem;
}

.awm-figure {
  margin: 1.5rem 0;
  border: 1px solid var(--awm-border);
  border-radius: 8px;
  padding: 0.8rem;
  background: var(--awm-surface);
  box-shadow: var(--awm-shadow-soft);
}

.md-typeset .awm-figure img[src$=".svg"],
.md-typeset img[src$=".svg"] {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
  border: 1px solid var(--awm-border);
  border-radius: 6px;
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0.92), rgba(241, 245, 249, 0.72)),
    #ffffff;
}

/* Diagramas SVG: en pantallas con holgura real (>=1400px) el parrafo del
   diagrama se ensancha mas alla de la columna de prosa, hasta 1100px,
   centrado, para que su texto de 9px se lea comodo sin pisar el TOC.
   Por debajo de 1400px, el diagrama simplemente llena la columna (width:100%). */
@media screen and (min-width: 87.5em) {
  .md-typeset p:has(> img[src$=".svg"]) {
    width: min(1100px, calc(100vw - 6rem));
    max-width: none;
    margin-left: 50%;
    transform: translateX(-50%);
  }
}

.awm-figure figcaption,
.md-typeset img + em {
  display: block;
  margin: 0.7rem auto 0;
  color: var(--awm-text-soft);
  text-align: center;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 650;
}

.md-typeset .md-typeset__table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: thin;
}

.md-typeset table:not([class]) {
  display: table;
  width: 100%;
  overflow: hidden;
  border: 1px solid var(--awm-border);
  border-radius: 8px;
  background: var(--awm-surface);
  box-shadow: var(--awm-shadow-soft);
}

.md-typeset table:not([class]) th {
  background: var(--awm-surface-soft);
  color: var(--md-default-fg-color);
  font-weight: 760;
}

.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td {
  min-width: 9rem;
  border-color: var(--awm-border);
  vertical-align: top;
}

.md-typeset .highlight {
  overflow: hidden;
  border: 1px solid var(--awm-border);
  border-radius: 8px;
  background: var(--md-code-bg-color);
  box-shadow: var(--awm-shadow-soft);
}

.md-typeset pre > code {
  font-size: 0.75rem;
  line-height: 1.62;
}

.md-typeset code {
  border-radius: 5px;
}

.md-typeset .admonition,
.md-typeset details {
  overflow: hidden;
  border-width: 0 0 0 0.16rem;
  border-radius: 8px;
  background: var(--awm-surface);
  box-shadow: var(--awm-shadow-soft);
}

.md-typeset .admonition-title,
.md-typeset summary {
  font-weight: 760;
}

.md-typeset blockquote {
  border-left: 0.18rem solid var(--awm-amber);
  border-radius: 0 8px 8px 0;
  padding: 0.55rem 0.85rem;
  background: color-mix(in srgb, var(--awm-amber) 8%, var(--awm-surface));
  color: var(--md-default-fg-color);
}

.md-footer {
  background: #0f172a;
}

.md-footer-meta {
  border-top: 1px solid var(--awm-border);
  background: var(--md-default-bg-color);
}

.md-footer__link {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.md-footer__title {
  font-weight: 720;
}

:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--awm-blue) 78%, white);
  outline-offset: 2px;
}

[data-md-color-scheme="slate"] .md-typeset .awm-figure img[src$=".svg"],
[data-md-color-scheme="slate"] .md-typeset img[src$=".svg"] {
  border-color: rgba(148, 163, 184, 0.22);
  background:
    linear-gradient(180deg, rgba(15, 23, 35, 0.96), rgba(11, 18, 30, 0.94)),
    #0f1723;
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background: rgba(148, 163, 184, 0.1);
}

[data-md-color-scheme="slate"] .md-footer {
  background: #060912;
}

@media screen and (min-width: 76.25em) {
  .md-sidebar--primary {
    border-right: 1px solid var(--awm-border);
  }

  .md-sidebar--secondary {
    border-left: 1px solid var(--awm-border);
  }
}

@media screen and (max-width: 76.2344em) {
  .awm-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 44.9844em) {
  .md-typeset {
    font-size: 0.82rem;
    line-height: 1.66;
  }

  .md-content__inner {
    padding-top: 1rem;
  }

  .md-typeset h1 {
    font-size: 1.75rem;
  }

  .md-typeset h2 {
    font-size: 1.2rem;
  }

  .md-typeset .awm-hero {
    grid-template-columns: 1fr;
    margin-top: 0.4rem;
    padding: 1.15rem;
  }

  .awm-hero__content h1 {
    max-width: none;
    font-size: 2.05rem;
  }

  .awm-card-grid,
  .awm-feature-strip {
    grid-template-columns: 1fr;
  }

  .awm-figure {
    margin: 1.1rem 0;
    padding: 0.55rem;
  }

  .md-typeset table:not([class]) th,
  .md-typeset table:not([class]) td {
    min-width: 11rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}
