:root {
  --lab0-bg: #1e1816;
  --lab0-panel: #212121;
  --lab0-panel-alt: #2a2623;
  --lab0-text: #f5f1e5;
  --lab0-accent: #ffdd00;
  --lab0-danger: #ff3b30;
}

[data-md-color-scheme="slate"] {
  --md-default-fg-color: var(--lab0-text);
  --md-default-bg-color: var(--lab0-bg);
  --md-primary-fg-color: var(--lab0-accent);
  --md-accent-fg-color: var(--lab0-danger);
  --md-accent-fg-color--transparent: color-mix(in srgb, var(--lab0-danger) 35%, transparent);
  --md-footer-bg-color--dark: var(--lab0-bg);
  --md-typeset-a-color: var(--lab0-accent);
}

body {
  font-family: "IBM Plex Mono", "Space Mono", Consolas, monospace;
  letter-spacing: 0.01em;
}

.md-header,
.md-tabs {
  background: var(--lab0-bg);
  border-bottom: 1px solid color-mix(in srgb, var(--lab0-accent) 40%, transparent);
}

.md-header__button,
.md-tabs__link {
  color: var(--lab0-text);
}

.md-tabs__item--active .md-tabs__link {
  color: var(--lab0-accent);
  text-shadow: 0 0 12px color-mix(in srgb, var(--lab0-accent) 40%, transparent);
}

.md-main__inner {
  margin: 0 auto;
  padding-top: 2rem;
}

.md-content {
  background: var(--lab0-bg);
}

.md-typeset {
  color: var(--lab0-text);
  line-height: 1.6;
}

.lab0-hero {
  padding: 3rem 2rem;
  border: 1px solid var(--lab0-accent);
  border-radius: 0;
  background: linear-gradient(135deg, rgba(33, 33, 33, 0.85), rgba(26, 20, 18, 0.95));
  box-shadow: 0 0 60px rgba(0, 0, 0, 0.65);
}

.lab0-hero h1 {
  font-size: clamp(2.4rem, 4vw, 3.4rem);
  text-transform: uppercase;
  letter-spacing: -0.08em;
  font-weight: 800;
  word-spacing: 0.01em;
  text-rendering: optimizeLegibility;
  color: var(--lab0-accent);
  margin-bottom: 1rem;
}

.lab0-hero__status {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 1rem;
  border: 1px solid var(--lab0-danger);
  color: var(--lab0-danger);
  text-transform: uppercase;
  font-size: 0.85rem;
}

.lab0-hero__status::before {
  content: "";
  width: 12px;
  height: 12px;
  background: var(--lab0-danger);
  border-radius: 999px;
  box-shadow: 0 0 12px var(--lab0-danger);
}

.lab0-grid {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 720px) {
  .lab0-grid {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  }
}

.lab0-panel {
  padding: 1.5rem;
  border: 1px solid color-mix(in srgb, var(--lab0-accent) 35%, transparent);
  background: var(--lab0-panel);
  box-shadow: inset 0 0 0 1px rgba(245, 241, 229, 0.02);
}

.lab0-panel--warning {
  border-color: var(--lab0-danger);
  background: color-mix(in srgb, var(--lab0-danger) 6%, var(--lab0-panel));
}

.lab0-panel h3 {
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.23em;
  color: var(--lab0-accent);
}

.lab0-terminal {
  background: var(--lab0-panel-alt);
  border: 1px solid var(--lab0-panel);
  padding: 1rem;
  font-size: 0.9rem;
  line-height: 1.4;
}

.lab0-terminal code {
  color: var(--lab0-accent);
}

.lab0-mermaid {
  position: relative;
  margin: 2rem 0;
  padding: 0;
  width: 100%;
  height: 300px;
  background: #020402;
  border: 2px solid rgba(0, 255, 128, 0.6);
  box-shadow:
    inset 0 0 18px rgba(0, 255, 128, 0.15),
    0 0 40px rgba(0, 0, 0, 0.9);
  overflow: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lab0-mermaid .mermaid {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 2rem;
  filter: drop-shadow(0 0 25px rgba(0, 255, 128, 0.15));
}

.lab0-mermaid .mermaid svg {
  font-family: "IBM Plex Mono", "Space Mono", "VT323", Consolas, monospace !important;
  display: block;
}

.lab0-mermaid .mermaid svg text {
  font-size: clamp(1.4rem, 2vw, 2.5rem) !important;
  letter-spacing: 0.04em;
  fill: #39ff93;
  text-transform: uppercase;
}

.lab0-mermaid .mermaid svg .edgeLabel text {
  font-size: clamp(1.2rem, 1.6vw, 1.8rem) !important;
  letter-spacing: 0.02em;
  fill: #39ff93;
}

.lab0-mermaid .mermaid svg .node rect,
.lab0-mermaid .mermaid svg .node polygon {
  rx: 4px;
  ry: 4px;
  stroke-width: 2px;
  stroke: rgba(0, 255, 128, 0.7);
  fill: rgba(0, 32, 0, 0.8);
  filter: drop-shadow(0 0 14px rgba(0, 255, 128, 0.3));
}

.lab0-mermaid .mermaid svg .cluster rect {
  fill: rgba(0, 6, 0, 0.6);
  stroke: rgba(0, 255, 128, 0.3);
  rx: 4px;
  ry: 4px;
}

.lab0-avatar {
  border-radius: 50%;
  width: 80px;
  height: 80px;
  object-fit: cover;
  display: block;
  border: 2px solid var(--lab0-accent);
  box-shadow: 0 0 15px rgba(255, 221, 0, 0.3);
}

.lab0-signature {
  margin: 2rem 0;
  padding: 1.5rem;
  background: var(--lab0-panel);
  border-left: 3px solid var(--lab0-accent);
}

.lab0-signature__quote {
  font-size: 1rem;
  font-style: italic;
  color: var(--lab0-text);
  margin: 0 0 1.5rem 0;
  padding: 0;
  border-left: none;
}

.lab0-signature__author {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.lab0-signature__name {
  font-size: 0.95rem;
  color: var(--lab0-accent);
  font-weight: 600;
}

.md-button {
  border-radius: 0;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.22em;
  border: 1px solid currentColor;
}

.md-button--primary {
  background: var(--lab0-danger);
  border-color: var(--lab0-danger);
  color: #140c0a;
}

.md-button--secondary {
  color: var(--lab0-accent);
  border-color: var(--lab0-accent);
}

.md-button[href*="pay-it-forward"] {
  background: var(--lab0-danger);
  border-color: var(--lab0-danger);
  color: var(--lab0-accent) !important;
}

.md-button[href*="pay-it-forward"]:hover,
.md-button[href*="pay-it-forward"]:focus {
  background: color-mix(in srgb, var(--lab0-danger) 85%, black);
  border-color: color-mix(in srgb, var(--lab0-danger) 90%, black);
  color: var(--lab0-accent) !important;
}

.pay-forward {
  color: var(--lab0-danger);
}

.md-tabs__link[href$="pay-it-forward/"],
.md-nav__link[href$="pay-it-forward/"],
.md-typeset a[href*="pay-it-forward"] {
  color: var(--lab0-danger);
}

.md-tabs__item--active .md-tabs__link[href$="pay-it-forward/"] {
  text-shadow: 0 0 12px color-mix(in srgb, var(--lab0-danger) 50%, transparent);
}

.md-footer {
  border-top: 1px solid color-mix(in srgb, var(--lab0-accent) 25%, transparent);
  background: var(--lab0-bg);
}

.md-nav__title,
.md-nav__item a,
.md-nav__link {
  font-size: 0.9rem;
  letter-spacing: 0.05em;
}

.md-header__title {
  display: none;
}

.md-header__button[title="Search"] {
  display: none;
}

.md-search {
  display: none;
}

.md-header__inner {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.md-header__inner .md-logo {
  margin-right: 1.5rem;
}

.md-header__inner .md-header__title {
  display: none;
}

.md-header__inner .md-tabs {
  margin-left: auto;
}