/* Moonlight with Figures skin.
   Keep the base theme's typography and article layout intact; this file only
   adds the procedural Blakelock field, contrast corrections, and image shadows. */

html.mpe-moonlight-page {
  --moon-ink: #241f12;
  --moon-ink-soft: rgba(36, 31, 18, .78);
  --moon-link: #654618;
  --moon-panel: rgba(244, 232, 185, .9);
  --moon-panel-soft: rgba(248, 240, 207, .78);
  --moon-border: rgba(75, 58, 26, .24);
  --moon-shadow: rgba(5, 4, 2, .45);
  --moon-bg-fallback:
    radial-gradient(circle at 48% 43%, rgba(217, 174, 92, .48), rgba(217, 174, 92, .18) 7rem, transparent 18rem),
    linear-gradient(180deg, #080906, #11180d 44%, #2d2310 64%, #080806);
  background-color: #070807;
  color: #efe5bd;
  min-height: var(--mpe-moonlight-page-height, 100%);
}

html.mpe-moonlight-page[data-color-scheme="light"] {
  --moon-ink: #292312;
  --moon-ink-soft: rgba(41, 35, 18, .76);
  --moon-link: #654618;
  --moon-panel: rgba(246, 236, 197, .86);
  --moon-panel-soft: rgba(252, 246, 222, .72);
  --moon-border: rgba(82, 65, 31, .2);
  --moon-shadow: rgba(49, 39, 18, .25);
  --moon-bg-fallback:
    radial-gradient(circle at 48% 43%, rgba(224, 183, 94, .4), rgba(224, 183, 94, .14) 7rem, transparent 18rem),
    linear-gradient(180deg, #737957, #a09666 42%, #655936 64%, #2e2d1c);
  background-color: #726d4a;
  color: #292312;
}

html.mpe-moonlight-page::before,
html.mpe-moonlight-page::after {
  content: none !important;
  display: none !important;
}

html.mpe-moonlight-page body,
html.mpe-moonlight-page .gh-site,
html.mpe-moonlight-page .gh-main,
html.mpe-moonlight-page .gh-outer,
html.mpe-moonlight-page .gh-inner {
  background: transparent !important;
}

html.mpe-moonlight-page body {
  position: relative;
  min-height: var(--mpe-moonlight-page-height, 100vh);
  overflow-x: hidden;
}

html.mpe-moonlight-page .mpe-moonlight-art {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 50%;
  width: 100vw;
  height: var(--mpe-moonlight-page-height, 100vh);
  min-height: 100vh;
  pointer-events: none;
  overflow: hidden;
  transform: translateX(-50%);
  background-color: #050604;
  background-image:
    radial-gradient(ellipse at 50% 34%, transparent 0 28rem, rgba(0, 0, 0, .34) 82rem),
    linear-gradient(180deg, rgba(0, 0, 0, .18), rgba(0, 0, 0, .06) 42rem, rgba(0, 0, 0, .46)),
    var(--mpe-moonlight-pattern-image, var(--mpe-moonlight-bg-dark, var(--moon-bg-fallback)));
  background-position: top center;
  background-repeat: repeat-y, repeat-y, repeat-y;
  background-size:
    100% 1280px,
    100% 1280px,
    100% var(--mpe-moonlight-pattern-height, 3072px);
}

html.mpe-moonlight-page[data-color-scheme="light"] .mpe-moonlight-art {
  background-color: #726d4a;
  background-image:
    radial-gradient(ellipse at 50% 34%, rgba(255, 244, 197, .1) 0 22rem, rgba(48, 39, 20, .18) 84rem),
    linear-gradient(180deg, rgba(255, 245, 207, .2), rgba(255, 245, 207, .08) 42rem, rgba(48, 39, 20, .24)),
    var(--mpe-moonlight-pattern-image, var(--mpe-moonlight-bg-light, var(--moon-bg-fallback)));
}

html.mpe-moonlight-page .gh-site {
  position: relative;
  z-index: 1;
}

html.mpe-moonlight-page .gh-head,
html.mpe-moonlight-page .gh-foot {
  background: rgba(7, 8, 6, .72);
  border-color: rgba(232, 208, 137, .18);
  backdrop-filter: blur(8px) saturate(1.04);
}

html.mpe-moonlight-page[data-color-scheme="light"] .gh-head,
html.mpe-moonlight-page[data-color-scheme="light"] .gh-foot {
  background: rgba(230, 216, 168, .7);
  border-color: rgba(65, 52, 26, .16);
}

html.mpe-moonlight-page .gh-article,
html.mpe-moonlight-page .gh-article-header,
html.mpe-moonlight-page .gh-content {
  color: var(--moon-ink);
}

html.mpe-moonlight-page .gh-article-header,
html.mpe-moonlight-page .gh-content {
  width: min(calc(var(--content-width, 720px) + var(--gap, 3.6rem) * 2), calc(100vw - var(--gap, 3.6rem) * 2));
  margin-inline: auto;
  padding-block: clamp(2.8rem, 5vw, 5rem);
  background: linear-gradient(180deg, var(--moon-panel-soft), var(--moon-panel));
  border-color: var(--moon-border);
  box-shadow: 0 22px 55px var(--moon-shadow);
}

html.mpe-moonlight-page .gh-article-header {
  margin-top: clamp(4rem, 7vw, 8rem);
  margin-bottom: clamp(2rem, 4vw, 4rem);
  border-top: 1px solid var(--moon-border);
}

html.mpe-moonlight-page .gh-content {
  margin-top: clamp(2rem, 4vw, 4rem);
  margin-bottom: clamp(4rem, 7vw, 8rem);
  border-bottom: 1px solid var(--moon-border);
}

html.mpe-moonlight-page .gh-article-title,
html.mpe-moonlight-page .gh-article-excerpt,
html.mpe-moonlight-page .gh-article-tag,
html.mpe-moonlight-page .gh-article-sidebar,
html.mpe-moonlight-page .gh-article-sidebar a,
html.mpe-moonlight-page .gh-content h1,
html.mpe-moonlight-page .gh-content h2,
html.mpe-moonlight-page .gh-content h3,
html.mpe-moonlight-page .gh-content h4,
html.mpe-moonlight-page .gh-content h5,
html.mpe-moonlight-page .gh-content h6,
html.mpe-moonlight-page .gh-content p,
html.mpe-moonlight-page .gh-content li,
html.mpe-moonlight-page .gh-content blockquote,
html.mpe-moonlight-page .gh-content figcaption {
  color: var(--moon-ink);
}

html.mpe-moonlight-page .gh-article-excerpt,
html.mpe-moonlight-page .gh-article-tag,
html.mpe-moonlight-page .gh-article-sidebar {
  color: var(--moon-ink-soft);
}

html.mpe-moonlight-page .gh-content a {
  color: var(--moon-link);
  text-decoration-color: rgba(101, 70, 24, .48);
}

html.mpe-moonlight-page .gh-article-sidebar {
  position: static !important;
  left: auto !important;
  top: auto !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-column: main !important;
  align-items: center;
  gap: .7rem 1.2rem;
  width: 100%;
  margin: clamp(1.5rem, 2.5vw, 2.4rem) 0 clamp(1.2rem, 2vw, 2rem) !important;
  padding: 0 !important;
}

html.mpe-moonlight-page .gh-article-sidebar .gh-author-image-list {
  grid-row: 1 / 3;
  margin: 0 !important;
}

html.mpe-moonlight-page .gh-article-sidebar .gh-author-image,
html.mpe-moonlight-page .gh-article-sidebar .gh-author-image-list .gh-author-image:only-child {
  width: 44px;
  height: 44px;
  margin: 0 !important;
  border: 1px solid rgba(76, 57, 22, .42) !important;
  box-shadow: 0 7px 16px rgba(8, 6, 2, .16);
}

html.mpe-moonlight-page .gh-article-sidebar .gh-author-name-list,
html.mpe-moonlight-page .gh-article-sidebar .gh-author-name,
html.mpe-moonlight-page .gh-article-sidebar .gh-author-name a,
html.mpe-moonlight-page .gh-article-sidebar .gh-article-meta,
html.mpe-moonlight-page .gh-article-sidebar .gh-article-meta a {
  color: var(--moon-ink) !important;
}

html.mpe-moonlight-page .gh-article-sidebar .gh-author-name-list,
html.mpe-moonlight-page .gh-article-sidebar .gh-author-name,
html.mpe-moonlight-page .gh-article-sidebar .gh-article-meta {
  margin: 0 !important;
}

html.mpe-moonlight-page .gh-article-sidebar .gh-author-name,
html.mpe-moonlight-page .gh-article-sidebar .gh-author-name a {
  font-weight: 800;
}

html.mpe-moonlight-page .gh-article-sidebar .gh-article-meta {
  opacity: .86;
}

html.mpe-moonlight-page .gh-article-sidebar .gh-button-share {
  grid-column: 3;
  grid-row: 1 / 3;
  align-self: center;
  justify-self: end;
  margin: 0 !important;
  color: var(--moon-ink);
  background: rgba(255, 249, 216, .7);
  border-color: rgba(76, 57, 22, .34);
}

html.mpe-moonlight-page .gh-article-sidebar .gh-button-share:hover,
html.mpe-moonlight-page .gh-article-sidebar .gh-button-share:focus-visible {
  background: rgba(255, 250, 220, .92);
  border-color: rgba(76, 57, 22, .52);
}

html.mpe-moonlight-page .gh-article-image,
html.mpe-moonlight-page .kg-image-card,
html.mpe-moonlight-page .kg-gallery-card,
html.mpe-moonlight-page .kg-card {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.mpe-moonlight-page .gh-article-image::before,
html.mpe-moonlight-page .gh-article-image::after,
html.mpe-moonlight-page .kg-image-card::before,
html.mpe-moonlight-page .kg-image-card::after,
html.mpe-moonlight-page .kg-gallery-card::before,
html.mpe-moonlight-page .kg-gallery-card::after {
  content: none !important;
  display: none !important;
}

html.mpe-moonlight-page .gh-content > figure.kg-image-card,
html.mpe-moonlight-page .gh-content > figure.kg-gallery-card,
html.mpe-moonlight-page .gh-content > .kg-image-card,
html.mpe-moonlight-page .gh-content > .kg-gallery-card {
  grid-column: main !important;
  justify-self: center;
  width: fit-content !important;
  max-width: 100%;
  margin-inline: auto;
  padding: 0 !important;
}

html.mpe-moonlight-page .gh-article-image picture,
html.mpe-moonlight-page .kg-image-card picture,
html.mpe-moonlight-page .kg-gallery-card picture,
html.mpe-moonlight-page .kg-gallery-image {
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.mpe-moonlight-page .gh-article-image img,
html.mpe-moonlight-page .kg-image-card img,
html.mpe-moonlight-page .kg-gallery-card img,
html.mpe-moonlight-page .gh-content img {
  background: transparent !important;
  border: 0;
  border-radius: 0;
  outline: 0;
  padding: 0 !important;
  width: auto !important;
  max-width: 100%;
  margin-inline: auto;
  box-shadow: none !important;
  filter:
    contrast(1.04)
    saturate(.96)
    drop-shadow(0 24px 18px rgba(8, 6, 2, .32))
    drop-shadow(0 5px 5px rgba(8, 6, 2, .2));
}

html.mpe-moonlight-page .gh-content figcaption,
html.mpe-moonlight-page .gh-article-image figcaption {
  display: block;
  box-sizing: border-box;
  width: 100%;
  color: var(--moon-ink) !important;
  background: rgba(248, 238, 198, .72);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  padding: .55rem .85rem;
  font-weight: 900;
  text-shadow: 0 1px 0 rgba(255, 250, 225, .45);
}

html.mpe-moonlight-page .gh-content figcaption a,
html.mpe-moonlight-page .gh-article-image figcaption a,
html.mpe-moonlight-page .kg-card figcaption a {
  color: var(--moon-ink) !important;
  font-weight: inherit;
  text-decoration-color: rgba(36, 31, 18, .42);
}

html.mpe-moonlight-page .gh-content blockquote {
  border-color: rgba(74, 56, 22, .44);
  background: rgba(255, 248, 215, .3);
}

html.mpe-moonlight-page .gh-content hr {
  border-color: rgba(74, 56, 22, .34);
}

html.mpe-moonlight-page .mpe-print-tools {
  color: var(--moon-ink);
  background: rgba(245, 232, 181, .94);
  border: 1px solid rgba(72, 55, 22, .36);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .26);
}

html.mpe-moonlight-page .mpe-print-tools-label,
html.mpe-moonlight-page .mpe-print-button {
  color: var(--moon-ink);
}

html.mpe-moonlight-page .mpe-print-button {
  background: rgba(255, 250, 221, .86);
  border-color: rgba(72, 55, 22, .34);
}

html.mpe-moonlight-page .mpe-print-button:hover,
html.mpe-moonlight-page .mpe-print-button:focus-visible,
html.mpe-moonlight-page .mpe-print-button[aria-pressed="true"] {
  color: var(--moon-ink);
  background: rgba(255, 246, 199, .98);
  border-color: rgba(72, 55, 22, .58);
}

html.mpe-moonlight-page .mpe-post-routes,
html.mpe-moonlight-page .mpe-article-tags-panel,
html.mpe-moonlight-page .mpe-book-widget-panel,
html.mpe-moonlight-page .gh-read-next:not(.gh-comments) {
  display: block !important;
  width: min(calc(var(--content-width, 720px) + var(--gap, 3.6rem) * 2), calc(100vw - var(--gap, 3.6rem) * 2));
  margin-inline: auto;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html.mpe-moonlight-page .mpe-article-tags-panel,
html.mpe-moonlight-page .gh-read-next:not(.gh-comments) {
  color: #f3e8bd;
}

html.mpe-moonlight-page[data-color-scheme="light"] .mpe-article-tags-panel,
html.mpe-moonlight-page[data-color-scheme="light"] .gh-read-next:not(.gh-comments) {
  color: #201c10;
}

html.mpe-moonlight-page .mpe-article-tags-panel a,
html.mpe-moonlight-page .gh-read-next a {
  color: inherit;
}

html.mpe-moonlight-page .mpe-article-tags-panel .mpe-tag-link {
  background: rgba(255, 244, 197, .14);
  border-color: rgba(238, 215, 145, .28);
}

html.mpe-moonlight-page[data-color-scheme="light"] .mpe-article-tags-panel .mpe-tag-link {
  background: rgba(255, 249, 219, .52);
  border-color: rgba(76, 57, 22, .22);
}

html.mpe-moonlight-page .gh-comments {
  width: min(calc(var(--content-width, 720px) + var(--gap, 3.6rem) * 2), calc(100vw - var(--gap, 3.6rem) * 2));
  margin-inline: auto;
  color: #f2f4f8;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html.mpe-moonlight-page[data-color-scheme="light"] .gh-comments {
  color: #15171a;
}

html[data-moonlight-icons-unlocked="true"] .mpe-badge-rack {
  display: flex !important;
}

html[data-moonlight-icons-active="true"] .mpe-theme-icon {
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

html[data-moonlight-icons-active="true"] .mpe-theme-icon svg {
  display: none !important;
}

html[data-moonlight-icons-active="true"] .mpe-theme-icon-sun {
  background-image: var(--mpe-moonlight-sun-icon, radial-gradient(circle, #fff1b7 0 28%, #c79236 50%, #21120a 100%));
}

html[data-moonlight-icons-active="true"] .mpe-theme-icon-moon {
  background-image: var(--mpe-moonlight-moon-icon, radial-gradient(circle, #f3d98a 0 24%, #b17a35 45%, #08201c 100%));
}

.mpe-badge--moonlight {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

.mpe-badge--moonlight::before {
  content: "";
  position: absolute;
  inset: .56rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: .96;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .28));
  transition: transform .16s ease, opacity .16s ease;
}

html[data-color-scheme="dark"]:not([data-moonlight-icons-active="true"]) .mpe-badge--moonlight::before {
  background-image: var(--mpe-moonlight-moon-icon, radial-gradient(circle, #f3d98a 0 24%, #17342f 100%));
}

html[data-color-scheme="light"]:not([data-moonlight-icons-active="true"]) .mpe-badge--moonlight::before {
  background-image: var(--mpe-moonlight-sun-icon, radial-gradient(circle, #fff1b7 0 28%, #21120a 100%));
}

html[data-moonlight-icons-active="true"][data-color-scheme="light"] .mpe-badge--moonlight::before {
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M6.34 17.66l-1.41 1.41M19.07 4.93l-1.41 1.41'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M6.34 17.66l-1.41 1.41M19.07 4.93l-1.41 1.41'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
}

html[data-moonlight-icons-active="true"][data-color-scheme="dark"] .mpe-badge--moonlight::before {
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M21 12.79A9 9 0 1 1 11.21 3a7 7 0 0 0 9.79 9.79Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M21 12.79A9 9 0 1 1 11.21 3a7 7 0 0 0 9.79 9.79Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

html[data-moonlight-icons-active="true"] .mpe-badge--moonlight {
  color: inherit;
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

.mpe-badge--moonlight:hover,
.mpe-badge--moonlight:focus-visible {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 767px) {
  html.mpe-moonlight-page,
  html.mpe-moonlight-page body {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  html.mpe-moonlight-page .gh-site,
  html.mpe-moonlight-page .gh-main,
  html.mpe-moonlight-page .gh-outer,
  html.mpe-moonlight-page .gh-inner,
  html.mpe-moonlight-page main,
  html.mpe-moonlight-page .gh-article,
  html.mpe-moonlight-page .gh-article-header,
  html.mpe-moonlight-page .gh-content,
  html.mpe-moonlight-page .mpe-post-routes,
  html.mpe-moonlight-page .mpe-article-tags-panel,
  html.mpe-moonlight-page .mpe-book-widget-panel,
  html.mpe-moonlight-page .gh-read-next:not(.gh-comments) {
    max-width: 100vw !important;
    min-width: 0 !important;
    overflow-x: clip !important;
  }

  html.mpe-moonlight-page .gh-article-header,
  html.mpe-moonlight-page .gh-content,
  html.mpe-moonlight-page .mpe-post-routes,
  html.mpe-moonlight-page .mpe-article-tags-panel,
  html.mpe-moonlight-page .mpe-book-widget-panel,
  html.mpe-moonlight-page .gh-read-next:not(.gh-comments),
  html.mpe-moonlight-page .gh-comments {
    width: calc(100vw - var(--gap, 2rem) * 2);
  }

  html.mpe-moonlight-page .gh-article-header,
  html.mpe-moonlight-page .gh-content {
    padding-block: 2.4rem;
  }

  html.mpe-moonlight-page .gh-article-sidebar {
    grid-template-columns: auto minmax(0, 1fr);
    gap: .65rem 1rem;
  }

  html.mpe-moonlight-page .gh-article-sidebar .gh-button-share {
    grid-column: 1 / -1;
    grid-row: auto;
    justify-self: start;
    margin-top: .4rem !important;
  }

  html.mpe-moonlight-page .gh-content > *,
  html.mpe-moonlight-page .gh-content .kg-card,
  html.mpe-moonlight-page .gh-content figure,
  html.mpe-moonlight-page .gh-content img {
    max-width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.mpe-moonlight-page .mpe-moonlight-art {
    background-size:
      100% 1280px,
      100% 1280px,
      100% var(--mpe-moonlight-pattern-height, 3072px);
  }
}
