:root {
  --matdem-brand: #0b5cab;
  --matdem-brand-dark: #082b4f;
  --matdem-brand-deep: #071e34;
  --matdem-accent: #18a999;
  --matdem-accent-strong: #f3b33d;
  --matdem-ink: #142033;
  --matdem-muted: #607086;
  --matdem-line: #d9e2ec;
  --matdem-page: #f4f7fa;
  --matdem-panel: #ffffff;
  --matdem-soft: #e9f2fb;
  --matdem-shadow: 0 18px 42px rgba(12, 31, 55, 0.12);
  --matdem-header-border: rgba(160, 188, 216, 0.18);
  --matdem-header-shadow: rgba(4, 16, 30, 0.18);
  --matdem-tabs-border: rgba(160, 188, 216, 0.2);
  --matdem-hero-white: rgba(255, 255, 255, 0.82);
  --matdem-code-bg: #f0f4f8;
  --matdem-footer-border: rgba(160, 188, 216, 0.15);
  --matdem-card-shadow: 0 12px 30px rgba(12, 31, 55, 0.06);
  --matdem-btn-primary-text: #061a31;
  --matdem-btn-primary-hover: #ffd47d;

  --md-primary-fg-color: var(--matdem-brand-deep);
  --md-primary-fg-color--light: var(--matdem-brand);
  --md-primary-fg-color--dark: var(--matdem-brand-dark);
  --md-primary-bg-color: var(--matdem-panel);
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.7);
  --md-accent-fg-color: var(--matdem-accent);
  --md-accent-fg-color--transparent: rgba(24, 169, 153, 0.1);
  --md-default-fg-color: var(--matdem-ink);
  --md-default-fg-color--light: var(--matdem-muted);
  --md-default-fg-color--lighter: var(--matdem-muted);
  --md-default-fg-color--lightest: var(--matdem-line);
  --md-default-bg-color: var(--matdem-page);
  --md-default-bg-color--light: var(--matdem-panel);
  --md-default-bg-color--lighter: rgba(255, 255, 255, 0.7);
  --md-default-bg-color--lightest: rgba(255, 255, 255, 0.3);
  --md-code-fg-color: var(--matdem-ink);
  --md-code-bg-color: var(--matdem-code-bg);
  --md-code-hl-keyword-color: #0E00FF;
  --md-code-hl-string-color: #A709F5;
  --md-code-hl-comment-color: #008013;
  --md-code-hl-number-color: #212121;
  --md-code-hl-special-color: #212121;
  --md-code-hl-function-color: #212121;
  --md-code-hl-constant-color: #212121;
  --md-typeset-a-color: var(--matdem-brand);
  --md-admonition-fg-color: var(--matdem-ink);
  --md-admonition-bg-color: var(--matdem-panel);
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #0a1b2e;
  --md-primary-fg-color--light: #0f2d4a;
  --md-primary-fg-color--dark: #06111f;
  --md-accent-fg-color: #2dd4bf;
  --md-default-fg-color: #e2e8f0;
  --md-default-fg-color--light: #94a3b8;
  --md-default-fg-color--lighter: #64748b;
  --md-default-fg-color--lightest: #334155;
  --md-default-bg-color: #0f172a;
  --md-default-bg-color--light: #1e293b;
  --md-default-bg-color--lighter: rgba(30, 41, 59, 0.7);
  --md-default-bg-color--lightest: rgba(30, 41, 59, 0.3);
  --md-code-bg-color: #1e293b;
  --md-typeset-a-color: #38bdf8;
  --matdem-brand: #38bdf8;
  --matdem-brand-dark: #0f2d4a;
  --matdem-brand-deep: #0a1b2e;
  --matdem-accent: #2dd4bf;
  --matdem-accent-strong: #fbbf24;
  --matdem-ink: #e2e8f0;
  --matdem-muted: #94a3b8;
  --matdem-line: #334155;
  --matdem-page: #0f172a;
  --matdem-panel: #1e293b;
  --matdem-soft: #1e3a5f;
  --matdem-shadow: 0 18px 42px rgba(0, 0, 0, 0.35);
  --matdem-header-border: rgba(160, 188, 216, 0.12);
  --matdem-header-shadow: rgba(0, 0, 0, 0.3);
  --matdem-tabs-border: rgba(160, 188, 216, 0.12);
  --matdem-hero-white: rgba(255, 255, 255, 0.78);
  --matdem-code-bg: #1e293b;
  --matdem-footer-border: rgba(160, 188, 216, 0.1);
  --matdem-card-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
  --matdem-btn-primary-text: #061a31;
  --matdem-btn-primary-hover: #ffd47d;
}

html { scroll-behavior: smooth; }

body { font-family: Arial, "Microsoft YaHei", "PingFang SC", sans-serif; }

.md-header {
  background: var(--matdem-brand-deep);
  border-bottom: 1px solid var(--matdem-header-border);
  box-shadow: 0 16px 34px var(--matdem-header-shadow);
  color: #ffffff;
}

.md-header__title { color: #ffffff; }
.md-header__topic { color: #ffffff; }
.md-header__button { color: rgba(255, 255, 255, 0.9); }
.md-header__button:hover { color: var(--matdem-accent-strong); }

.md-tabs {
  background: var(--matdem-brand-dark);
  border-top: 1px solid var(--matdem-tabs-border);
}

.md-tabs__link {
  color: #ffffff;
  font-weight: 600;
  opacity: 0.92;
  transition: color 0.2s, background 0.2s;
}

.md-tabs__link:hover,
.md-tabs__link--active { color: #ffffff; opacity: 1; }

.md-tabs__item--active .md-tabs__link {
  color: #ffffff;
  border-bottom: 2px solid var(--matdem-accent-strong);
}

.md-page-hero {
  color: var(--matdem-panel);
  background: linear-gradient(105deg, rgba(6, 26, 49, 0.96), rgba(8, 43, 79, 0.86));
}

.md-page-hero .md-page-hero__inner {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding: 40px 0;
  display: flex;
  gap: 40px;
  align-items: center;
}

.md-page-hero .md-page-hero__body {
  flex: 1 1 0;
  min-width: 0;
}

.md-page-hero .md-page-hero__eyebrow {
  margin: 0 0 8px;
  color: var(--matdem-accent);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.md-page-hero h1 {
  margin: 0;
  color: var(--matdem-panel);
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.15;
  font-weight: 800;
}

.md-page-hero .md-page-hero__desc {
  margin: 12px 0 0;
  color: var(--matdem-hero-white);
  font-size: clamp(14px, 2.2vw, 17px);
  line-height: 1.6;
}

.md-page-hero .md-page-hero__actions {
  display: flex;
  gap: 12px;
  margin-top: 20px;
  flex-wrap: wrap;
}

.md-page-hero .md-page-hero__carousel {
  flex: 0 0 auto;
  width: 380px;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3);
}

.md-page-hero__carousel-track {
  display: flex;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.md-page-hero__carousel-track img {
  width: 380px;
  flex-shrink: 0;
  object-fit: cover;
  aspect-ratio: 4 / 3;
}

.md-page-hero__carousel-dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  padding: 8px 0;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5));
}

.md-page-hero__carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  padding: 0;
  background: rgba(255, 255, 255, 0.4);
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
}

.md-page-hero__carousel-dot--active {
  background: var(--matdem-accent-strong);
  transform: scale(1.3);
}

.md-page-hero__carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.35);
  color: #ffffff;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.md-page-hero__carousel-btn:hover { background: rgba(0, 0, 0, 0.6); }
.md-page-hero__carousel-btn--prev { left: 8px; }
.md-page-hero__carousel-btn--next { right: 8px; }

.md-main { background: var(--matdem-page); }

.md-sidebar--primary .md-sidebar__scrollwrap {
  border: 1px solid var(--matdem-line);
  border-radius: 8px;
  background: var(--matdem-panel);
  box-shadow: var(--matdem-card-shadow);
}

.md-nav--primary > .md-nav__title {
  color: var(--matdem-panel);
  background: var(--matdem-brand-deep);
  font-size: 18px;
  font-weight: 800;
}

.md-nav--primary > .md-nav__title .md-nav__icon { color: var(--matdem-panel); }
.md-nav--primary > .md-nav__title span { color: var(--matdem-panel); }

.md-nav--primary .md-nav__link {
  border-top: 1px solid var(--matdem-line);
  color: var(--matdem-muted);
  font-weight: 500;
  transition: color 0.2s, background 0.2s;
}

.md-nav--primary .md-nav__link:hover,
.md-nav--primary .md-nav__link--active { color: var(--matdem-brand); background: var(--matdem-soft); }
.md-nav--primary .md-nav__link--active { font-weight: 700; }

.md-content__inner {
  background: var(--matdem-panel);
  border: 1px solid var(--matdem-line);
  border-radius: 8px;
  box-shadow: var(--matdem-card-shadow);
}

.md-content__inner::before { display: none; }

.md-sidebar--secondary .md-sidebar__scrollwrap {
  border: 1px solid var(--matdem-line);
  border-radius: 8px;
  background: var(--matdem-panel);
  box-shadow: var(--matdem-card-shadow);
}

.md-sidebar--secondary .md-nav__title {
  color: var(--matdem-brand-dark);
  font-weight: 800;
  font-size: 14px;
  border-bottom: 1px solid var(--matdem-line);
  padding-bottom: 8px;
  margin-bottom: 8px;
}

.md-sidebar--secondary .md-nav__link {
  color: var(--matdem-muted);
  font-size: 0.82rem;
  transition: color 0.2s;
}

.md-sidebar--secondary .md-nav__link:hover,
.md-sidebar--secondary .md-nav__link--active { color: var(--matdem-brand); }

.md-typeset h1 {
  color: var(--matdem-brand-dark);
  border-bottom: 1px solid var(--matdem-line);
}

.md-typeset h2 {
  color: var(--matdem-brand-dark);
  padding-left: 12px;
  border-left: 3px solid var(--matdem-brand);
}

.md-typeset h3 {
  color: var(--matdem-brand-dark);
  padding-left: 10px;
  border-left: 2px solid var(--matdem-accent);
}

.md-typeset a { color: var(--matdem-brand); text-decoration: none; transition: color 0.2s; }
.md-typeset a:hover { color: var(--matdem-accent); }
.md-typeset strong { color: var(--matdem-brand-dark); }

.md-typeset code {
  background: var(--matdem-code-bg);
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 0.88em;
  color: var(--matdem-ink);
}

.md-typeset pre { border-radius: 8px; box-shadow: 0 8px 24px rgba(12, 31, 55, 0.08); }
.md-typeset pre > code { background: var(--matdem-code-bg); }
.md-typeset .md-code__nav { border-radius: 0 8px 8px 0; }

.md-clipboard { color: var(--matdem-muted); transition: color 0.2s; }
.md-clipboard:hover { color: var(--matdem-brand); }

.md-footer {
  background: var(--matdem-brand-deep);
  color: #ffffff;
  border-top: 1px solid var(--matdem-footer-border);
}

.md-footer-meta { background: transparent; color: #ffffff; }
.md-footer__link { color: #ffffff; transition: color 0.2s; }
.md-footer__link:hover { color: var(--matdem-accent-strong); }
.md-footer__direction { color: rgba(255, 255, 255, 0.7); }
.md-footer__title { color: #ffffff; }
.md-copyright { color: rgba(255, 255, 255, 0.85); }
.md-copyright__highlight { color: #ffffff; }
.md-footer-meta.md-typeset a:not(:focus,:hover) { color: rgba(255, 255, 255, 0.85); }
.md-footer-meta.md-typeset a:focus,
.md-footer-meta.md-typeset a:hover { color: var(--matdem-accent-strong); }

.md-search__form {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(214, 231, 246, 0.28);
  border-radius: 8px;
  box-shadow: none;
}

.md-search__form:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(214, 231, 246, 0.4);
}

.md-search__input { color: #eaf4ff; }
.md-search__input::placeholder { color: rgba(234, 244, 255, 0.5); }
.md-search__icon { color: rgba(234, 244, 255, 0.6); }
.md-search__overlay { background-color: var(--matdem-brand-deep); }
.md-search-result__article { border-bottom: 1px solid var(--matdem-line); }
.md-search-result__title { color: var(--matdem-brand-dark); font-weight: 700; }
.md-search-result__teaser { color: var(--matdem-muted); }

.md-top {
  background: var(--matdem-brand);
  border-radius: 8px;
  color: var(--matdem-panel);
  box-shadow: 0 8px 20px rgba(11, 92, 171, 0.25);
}

.md-top:hover { background: var(--matdem-brand-dark); }

.md-typeset .md-button { border-radius: 8px; font-weight: 700; transition: all 0.2s; }

.md-typeset .md-button--primary {
  background: var(--matdem-accent-strong);
  color: var(--matdem-btn-primary-text);
  border-color: var(--matdem-accent-strong);
}

.md-typeset .md-button--primary:hover {
  background: var(--matdem-btn-primary-hover);
  border-color: var(--matdem-btn-primary-hover);
}

.md-typeset .md-button--outline {
  background: transparent;
  color: var(--matdem-brand);
  border: 2px solid var(--matdem-brand);
}

.md-typeset .md-button--outline:hover {
  background: var(--matdem-brand);
  color: #ffffff;
}

.md-typeset .admonition, .md-typeset details {
  border-radius: 8px;
  border: 1px solid var(--matdem-line);
  box-shadow: 0 8px 20px rgba(12, 31, 55, 0.05);
}

.md-typeset .admonition-title, .md-typeset summary {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.md-typeset .tabbed-labels { border-bottom: 2px solid var(--matdem-line); }
.md-typeset .tabbed-labels--linked .tabbed-label__link { color: var(--matdem-muted); transition: color 0.2s, border-color 0.2s; }
.md-typeset .tabbed-labels--linked .tabbed-label__link:hover { color: var(--matdem-brand); }
.md-typeset .tabbed-labels--active .tabbed-label--active { border-bottom-color: var(--matdem-brand); color: var(--matdem-brand-dark); }

.md-typeset table:not([class]) {
  border-radius: 8px;
  border: 1px solid var(--matdem-line);
  box-shadow: 0 8px 20px rgba(12, 31, 55, 0.05);
}

.md-typeset table:not([class]) th { background: var(--matdem-brand-dark); color: var(--matdem-panel); font-weight: 700; }
.md-typeset table:not([class]) td { border-top: 1px solid var(--matdem-line); }
.md-typeset table:not([class]) tr:nth-child(even) td { background: rgba(233, 242, 251, 0.3); }
.md-typeset table:not([class]) tr:hover td { background: var(--matdem-soft); }

.md-typeset h2.md-section--alt {
  background: var(--matdem-brand-deep);
  color: var(--matdem-panel);
  border-left: none;
  border-bottom: 2px solid var(--matdem-accent);
}

.flex {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  grid-gap: 12px;
  margin: 1em 0;
}

.flex > .items {
  display: block;
  border: 1px solid var(--matdem-line);
  border-radius: 8px;
  margin: 0;
  padding: 18px;
  background: var(--matdem-panel);
  box-shadow: 0 8px 20px rgba(12, 31, 55, 0.05);
  transition: border 0.25s, box-shadow 0.25s, transform 0.2s;
  color: var(--matdem-brand-dark);
  font-weight: 700;
  overflow: hidden;
}

.flex > .items:hover {
  border-color: var(--matdem-brand);
  box-shadow: 0 12px 28px rgba(12, 31, 55, 0.1);
  transform: translateY(-2px);
}

.flex > .items img {
  width: 100%;
  border-radius: 4px;
  margin-bottom: 8px;
  transition: transform 0.3s;
}

.flex > .items:hover img { transform: scale(1.03); }

.md-post--excerpt {
  border: 1px solid var(--matdem-line);
  border-radius: 8px;
  background: var(--matdem-panel);
  box-shadow: var(--matdem-card-shadow);
}

.md-pagination__link {
  border: 1px solid var(--matdem-line);
  border-radius: 6px;
  color: var(--matdem-brand-dark);
  background: var(--matdem-panel);
  transition: all 0.2s;
}

.md-pagination__link:hover { color: var(--matdem-brand); border-color: var(--matdem-brand); background: var(--matdem-soft); }
.md-pagination__link--active { color: var(--matdem-panel); border-color: var(--matdem-brand); background: var(--matdem-brand); }

.md-feedback { border-top: 1px solid var(--matdem-line); }

.md-path__link { color: var(--matdem-brand); font-weight: 500; }
.md-path__link:hover { color: var(--matdem-accent); }
.md-path__separator { color: var(--matdem-muted); }

@media (max-width: 768px) {
  .md-page-hero .md-page-hero__inner {
    flex-direction: column;
    padding: 28px 0;
  }
  .md-page-hero .md-page-hero__carousel {
    width: 100%;
    max-width: 400px;
  }
  .md-page-hero__carousel-track img {
    width: 100%;
  }
}

@media (max-width: 600px) {
  .flex { grid-template-columns: 1fr; }
  .md-page-hero .md-page-hero__carousel {
    max-width: 320px;
  }
}

@media print {
  .md-page-hero, .md-header, .md-tabs, .md-footer, .md-top, .md-feedback { display: none !important; }
  .md-content__inner { border: none; box-shadow: none; border-radius: 0; background: transparent; }
  .md-main { background: transparent; }
}

.md-api-toc { padding: 0; }

.md-api-toc__title {
  font-weight: 800;
  font-size: 14px;
  color: var(--matdem-brand-dark);
  border-bottom: 1px solid var(--matdem-line);
  padding-bottom: 8px;
  margin-bottom: 8px;
}

.md-api-toc__link {
  display: block;
  color: var(--matdem-muted);
  font-size: 0.82rem;
  padding: 3px 0;
  text-decoration: none;
  transition: color 0.2s;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.md-api-toc__link:hover { color: var(--matdem-brand); }
