/* ==========================================================================
   Scripting Codex – game style for Material for MkDocs
   Avalonia (emerald) · Corleone (crimson) · Etherion (violet) · gold UI
   ========================================================================== */

@font-face {
  font-family: "Silkscreen";
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/silkscreen-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Silkscreen";
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/silkscreen-latin-700-normal.woff2") format("woff2");
}

:root {
  --gc-gold: #f2b544;
  --gc-gold-deep: #b9800f;
  --gc-emerald: #3ccf91;
  --gc-crimson: #e2483d;
  --gc-violet: #8b6cff;
  --gc-pixel-font: "Silkscreen", "Inter", system-ui, sans-serif;
  --gc-radius: 10px;
  --gc-xp: linear-gradient(90deg, var(--gc-emerald) 0 25%, var(--gc-gold) 25% 50%,
                                  var(--gc-crimson) 50% 75%, var(--gc-violet) 75% 100%);
}

/* ---------- Day (light) scheme: parchment ---------- */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #1a1d33;
  --md-primary-fg-color--light: #2a2f52;
  --md-primary-fg-color--dark: #10122a;
  --md-primary-bg-color: #f6ecd2;
  --md-primary-bg-color--light: #f6ecd2b3;
  --md-accent-fg-color: #c2410c;
  --md-accent-fg-color--transparent: #c2410c1a;
  --md-default-bg-color: #faf6ec;
  --md-default-fg-color: #1f2033;
  --md-default-fg-color--light: #4a4b63;
  --md-typeset-a-color: #9a3412;
  --md-code-bg-color: #f1e9d6;
  --md-code-fg-color: #2b2c44;
  --gc-surface: #fffaf0;
  --gc-border: #e4d7b8;
  --gc-heading: #1a1d33;
  --gc-mark: var(--gc-gold-deep);
  --gc-shadow: 0 1px 0 #e4d7b8, 0 8px 24px -16px #6b4e1655;
}

/* ---------- Night (dark) scheme: deep night sky ---------- */
[data-md-color-scheme="slate"] {
  --md-hue: 232;
  --md-primary-fg-color: #0b0e1d;
  --md-primary-fg-color--light: #151a33;
  --md-primary-fg-color--dark: #070914;
  --md-primary-bg-color: #eef0ff;
  --md-primary-bg-color--light: #eef0ffb3;
  --md-accent-fg-color: var(--gc-gold);
  --md-accent-fg-color--transparent: #f2b5441f;
  --md-default-bg-color: #0f1224;
  --md-default-fg-color: #d9dcf2;
  --md-default-fg-color--light: #a3a8c9;
  --md-default-fg-color--lighter: #6f7499;
  --md-default-fg-color--lightest: #2b3052;
  --md-typeset-a-color: #7fd8ff;
  --md-code-bg-color: #0a0d1a;
  --md-code-fg-color: #e3e6ff;
  --md-footer-bg-color: #0b0e1d;
  --md-footer-bg-color--dark: #070914;
  --gc-surface: #151a31;
  --gc-border: #262c4d;
  --gc-heading: #ffffff;
  --gc-mark: var(--gc-gold);
  --gc-shadow: 0 0 0 1px #262c4d, 0 12px 32px -18px #000;
}

/* subtle starfield behind the content in night mode */
[data-md-color-scheme="slate"] body {
  background:
    radial-gradient(1200px 500px at 85% -10%, #2a1f5c55, transparent 60%),
    radial-gradient(900px 400px at -10% 20%, #0d3b3a44, transparent 60%),
    var(--md-default-bg-color);
  background-attachment: fixed;
}
[data-md-color-scheme="slate"] .md-main,
[data-md-color-scheme="slate"] .md-container { background: transparent; }

/* ---------- Header & tabs ---------- */
.md-header {
  background: linear-gradient(180deg, var(--md-primary-fg-color--light), var(--md-primary-fg-color));
  box-shadow: none;
}
.md-header::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 3px;
  background: var(--gc-xp);
}
.md-tabs { position: relative; background: var(--md-primary-fg-color); }

.md-header__topic:first-child {
  font-family: var(--gc-pixel-font);
  font-weight: 400;
  letter-spacing: .03em;
}
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 1.7rem;
  image-rendering: pixelated;
  filter: drop-shadow(0 0 6px #f2b54466);
  transition: transform .25s ease;
}
.md-header__button.md-logo:hover img { transform: rotate(-12deg) scale(1.08); }

.md-tabs__link {
  font-family: var(--gc-pixel-font);
  font-size: .7rem;
  letter-spacing: .05em;
  text-transform: uppercase;
  opacity: .75;
}
.md-tabs__item--active .md-tabs__link,
.md-tabs__link:hover { color: var(--gc-gold); opacity: 1; }

.md-search__form { border-radius: 8px; }

/* ---------- Navigation ---------- */
.md-nav__title,
.md-nav--primary .md-nav__item--section > .md-nav__link {
  font-family: var(--gc-pixel-font);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--gc-mark);
}
.md-nav__link { transition: color .15s, transform .15s; }
.md-nav--primary .md-nav__link:hover { transform: translateX(3px); }
.md-nav__link--active {
  color: var(--gc-mark) !important;
  font-weight: 700;
  position: relative;
}
.md-sidebar--primary .md-nav__link--active::before {
  content: "";
  position: absolute; left: -.7rem; top: 50%;
  width: 6px; height: 6px; margin-top: -3px;
  background: var(--gc-mark);
  box-shadow: 0 0 8px var(--gc-mark);
  transform: rotate(45deg);
}

/* ---------- Typography ---------- */
.md-typeset h1 {
  font-family: var(--gc-pixel-font);
}
.md-typeset h1,
.md-typeset h2 {
  color: var(--gc-heading);
  letter-spacing: .02em;
}
.md-typeset h1 {
  font-weight: 400;
  font-size: 1.9rem;
  margin-bottom: 1.2rem;
  padding-bottom: .6rem;
  border-bottom: 3px solid transparent;
  border-image: var(--gc-xp) 1;
}
[data-md-color-scheme="slate"] .md-typeset h1 {
  text-shadow: 0 0 22px #f2b54433;
}
.md-typeset h2 {
  font-weight: 800;
  font-size: 1.4rem;
  letter-spacing: -.01em;
  margin-top: 2.2rem;
}
.md-typeset h2::before,
.md-typeset h3::before {
  content: "";
  display: inline-block;
  width: .5em; height: .5em;
  margin-right: .55em;
  vertical-align: .12em;
  background: var(--gc-mark);
  transform: rotate(45deg);
}
.md-typeset h3::before {
  width: .38em; height: .38em;
  background: transparent;
  border: 2px solid var(--gc-mark);
}
.md-typeset h3 { font-weight: 700; color: var(--gc-heading); }

.md-typeset a { text-underline-offset: 3px; }
.md-typeset a:hover { color: var(--md-accent-fg-color); }

.md-typeset strong { color: var(--gc-heading); }

/* list bullets as little gems */
.md-typeset ul:not(.gc-plain) > li::marker { color: var(--gc-mark); }

/* ---------- Code ---------- */
.md-typeset code {
  border-radius: 5px;
  padding: .1em .35em;
}
.md-typeset :not(pre) > code {
  background: var(--md-accent-fg-color--transparent);
  color: var(--md-code-fg-color);
  box-shadow: inset 0 0 0 1px var(--gc-border);
}
.md-typeset pre {
  border-radius: var(--gc-radius);
  box-shadow: var(--gc-shadow);
  position: relative;
  overflow: hidden;
}
.md-typeset pre::before {
  /* "terminal" title bar dots */
  content: "";
  display: block;
  height: 1.6rem;
  background:
    radial-gradient(circle at .9rem 50%, var(--gc-crimson) .22rem, transparent .24rem),
    radial-gradient(circle at 1.6rem 50%, var(--gc-gold) .22rem, transparent .24rem),
    radial-gradient(circle at 2.3rem 50%, var(--gc-emerald) .22rem, transparent .24rem),
    color-mix(in srgb, var(--md-code-bg-color) 80%, var(--gc-border));
  border-bottom: 1px solid var(--gc-border);
}
.md-typeset pre > code { border-radius: 0; }
.md-clipboard { top: 2.05rem; }

[data-md-color-scheme="slate"] {
  --md-code-hl-keyword-color: #ff7ab8;
  --md-code-hl-string-color: #9ef0a8;
  --md-code-hl-number-color: #ffb86b;
  --md-code-hl-function-color: #7fd8ff;
  --md-code-hl-name-color: #e3e6ff;
  --md-code-hl-comment-color: #6f7499;
  --md-code-hl-constant-color: #c5a3ff;
  --md-code-hl-operator-color: #f2b544;
  --md-code-hl-punctuation-color: #a3a8c9;
}

/* ---------- Tables ---------- */
.md-typeset table:not([class]) {
  border-radius: var(--gc-radius);
  overflow: hidden;
  border: 1px solid var(--gc-border);
  box-shadow: var(--gc-shadow);
  font-size: .72rem;
}
.md-typeset table:not([class]) th {
  background: var(--md-primary-fg-color);
  color: var(--gc-gold);
  font-family: var(--gc-pixel-font);
  letter-spacing: .05em;
  text-transform: uppercase;
  font-weight: 600;
}
.md-typeset table:not([class]) tbody tr:nth-child(even) { background: color-mix(in srgb, var(--gc-surface) 60%, transparent); }
.md-typeset table:not([class]) tbody tr:hover { background: var(--md-accent-fg-color--transparent); }

/* ---------- Admonitions ---------- */
.md-typeset .admonition,
.md-typeset details {
  border-radius: var(--gc-radius);
  border-width: 0 0 0 4px;
  background: var(--gc-surface);
  box-shadow: var(--gc-shadow);
}

/* ---------- Content card feel ---------- */
.md-typeset hr {
  border: 0;
  height: 3px;
  background: var(--gc-xp);
  opacity: .5;
  border-radius: 3px;
}
.md-typeset blockquote {
  border-left: 4px solid var(--gc-mark);
  background: var(--gc-surface);
  border-radius: 0 var(--gc-radius) var(--gc-radius) 0;
  padding: .4rem 1rem;
}

/* ---------- Footer ---------- */
.md-footer { position: relative; }
.md-footer::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--gc-xp);
}

/* ==========================================================================
   Home page hero
   ========================================================================== */
.gc-hero {
  position: relative;
  overflow: hidden;
  color: #eef0ff;
  background:
    radial-gradient(700px 320px at 80% 10%, #6d4bff55, transparent 65%),
    radial-gradient(600px 300px at 10% 90%, #12a37355, transparent 65%),
    radial-gradient(500px 260px at 95% 95%, #e2483d40, transparent 65%),
    linear-gradient(160deg, #10132b 0%, #0b0e1d 100%);
}
.gc-hero__inner {
  position: relative;
  z-index: 1;
  padding: 3.4rem .8rem 3.2rem;
}
.gc-hero__kicker {
  margin: 0 0 .8rem;
  font-family: var(--gc-pixel-font);
  font-size: .8rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gc-gold);
}
.gc-blink { animation: gc-blink 1.1s steps(2, start) infinite; }
@keyframes gc-blink { to { visibility: hidden; } }

.gc-hero__title {
  margin: 0;
  font-family: var(--gc-pixel-font);
  font-weight: 400;
  font-size: clamp(2.2rem, 7vw, 4.4rem);
  line-height: 1.05;
  letter-spacing: 0;
  color: #fff;
  text-shadow: 4px 4px 0 #00000055;
}
.gc-hero__title span {
  background: linear-gradient(90deg, var(--gc-gold), #ffe29a 40%, var(--gc-gold) 60%, #ff9f43);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: gc-shine 6s linear infinite;
  filter: drop-shadow(0 0 18px #f2b54455);
}
@keyframes gc-shine { to { background-position: -200% 0; } }

.gc-hero__lead {
  max-width: 36rem;
  margin: 1.2rem 0 1.4rem;
  font-size: 1rem;
  line-height: 1.6;
  color: #c3c7e6;
}

.gc-worlds { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.6rem; }
.gc-world {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .3rem .75rem;
  border-radius: 999px;
  font-size: .72rem; font-weight: 700;
  letter-spacing: .04em;
  background: #ffffff0d;
  border: 1px solid #ffffff1f;
  backdrop-filter: blur(4px);
}
.gc-world::before {
  content: ""; width: .55rem; height: .55rem; transform: rotate(45deg);
  background: currentColor; box-shadow: 0 0 10px currentColor;
}
.gc-world--avalonia { color: var(--gc-emerald); }
.gc-world--corleone { color: #ff6b5f; }
.gc-world--etherion { color: #b19bff; }

.gc-hero__actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.gc-btn {
  display: inline-block;
  padding: .7rem 1.2rem;
  font-family: var(--gc-pixel-font);
  font-size: .85rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #eef0ff !important;
  background: #ffffff10;
  border: 2px solid #ffffff2e;
  border-radius: 6px;
  box-shadow: 0 4px 0 #00000066;
  transition: transform .12s, box-shadow .12s, background .2s;
}
.gc-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 0 #00000066; background: #ffffff1c; }
.gc-btn:active { transform: translateY(3px); box-shadow: 0 1px 0 #00000066; }
.gc-btn--primary {
  color: #1a1206 !important;
  background: linear-gradient(180deg, #ffd27a, var(--gc-gold));
  border-color: #ffe7b0;
  box-shadow: 0 4px 0 #8a5a08, 0 0 24px #f2b54455;
}
.gc-btn--primary:hover { background: linear-gradient(180deg, #ffe09c, #ffc659); box-shadow: 0 6px 0 #8a5a08, 0 0 30px #f2b54477; }
.gc-btn--primary:active { box-shadow: 0 1px 0 #8a5a08; }

/* pixel stars (pure CSS, two drifting layers) */
.gc-hero__stars,
.gc-hero__stars::after {
  position: absolute; top: 0; left: 0;
  width: 2px; height: 2px;
  background: transparent;
  box-shadow:
    40px 60px #fff, 120px 210px #ffffffaa, 260px 90px #fff, 330px 250px #ffe29a,
    420px 40px #ffffffaa, 520px 180px #fff, 610px 70px #b19bff, 700px 230px #fff,
    780px 120px #ffffff88, 880px 40px #fff, 960px 200px #7fd8ff, 1040px 100px #fff,
    1130px 260px #ffffffaa, 1210px 60px #ffe29a, 1300px 170px #fff, 1390px 30px #ffffff88,
    1480px 220px #fff, 1570px 110px #b19bff, 1660px 250px #fff, 1750px 70px #ffffffaa,
    80px 300px #ffffff66, 300px 320px #ffffff66, 640px 310px #ffffff66, 1000px 330px #ffffff66,
    1350px 310px #ffffff66, 1700px 330px #ffffff66;
  animation: gc-twinkle 4s ease-in-out infinite alternate;
}
.gc-hero__stars::after {
  content: "";
  transform: translate(60px, 20px);
  animation-delay: 2s;
}
@keyframes gc-twinkle { from { opacity: .35; } to { opacity: 1; } }

.gc-xpbar {
  position: absolute; left: 0; right: 0; bottom: 0; height: 4px;
  background: var(--gc-xp);
}


@media (prefers-reduced-motion: reduce) {
  .gc-blink, .gc-hero__title span, .gc-hero__stars, .gc-hero__stars::after { animation: none; }
}
@media screen and (max-width: 44.9375em) {
  .gc-hero__inner { padding: 2.2rem 1rem 2.4rem; }
}

/* ==========================================================================
   Home page: quest cards built from the navigation
   ========================================================================== */
.md-container:has(.gc-hero) .md-sidebar { display: none; }
.md-container:has(.gc-hero) .md-content { max-width: none; margin: 0; }
.md-container:has(.gc-hero) .md-content__inner { margin: 0 .8rem 2rem; }

.gc-home h2 { margin-top: 1.8rem; }
.gc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr));
  gap: .8rem;
  margin: 1rem 0 0;
}
.md-typeset a.gc-card {
  position: relative;
  display: flex; flex-direction: column; gap: .25rem;
  padding: .95rem 1rem 1rem;
  color: var(--md-default-fg-color);
  background: var(--gc-surface);
  border: 1px solid var(--gc-border);
  border-radius: var(--gc-radius);
  box-shadow: var(--gc-shadow);
  overflow: hidden;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.md-typeset a.gc-card::before {
  content: "";
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--gc-card-color, var(--gc-mark));
}
.md-typeset a.gc-card:hover {
  transform: translateY(-3px);
  border-color: var(--gc-card-color, var(--gc-mark));
  box-shadow: var(--gc-shadow), 0 10px 26px -14px var(--gc-card-color, var(--gc-mark));
}
.gc-card__label {
  font-weight: 700;
  font-size: .95rem;
  color: var(--gc-heading);
}
.gc-card__meta {
  font-size: .64rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
}
.gc-section--1 { --gc-card-color: var(--gc-emerald); }
.gc-section--2 { --gc-card-color: var(--gc-gold); }
.gc-section--3 { --gc-card-color: var(--gc-violet); }
.gc-section--4 { --gc-card-color: var(--gc-crimson); }

.gc-arrow { display: none; }
