:root {
  --relic-void: #070b12;
  --relic-stone: #111823;
  --relic-panel: #171f2d;
  --relic-cyan: #53edf3;
  --relic-cyan-soft: #77cdd1;
  --relic-gold: #edc96d;
  --relic-orange: #e78c47;
  --relic-purple: #b478ed;
  --relic-red: #ed6f72;
  --relic-green: #70dc9a;
  --relic-muted: #93a0b6;
  --relic-line: rgba(83, 237, 243, .22);
  --relic-shadow: 0 18px 48px rgba(0, 0, 0, .38);
}

[data-md-color-scheme="slate"] {
  --md-default-bg-color: var(--relic-void);
  --md-default-fg-color: #e7edf7;
  --md-default-fg-color--light: #b7c2d4;
  --md-default-fg-color--lighter: #778399;
  --md-primary-fg-color: #111a26;
  --md-primary-bg-color: #f1f7ff;
  --md-accent-fg-color: var(--relic-cyan);
  --md-code-bg-color: #0d1420;
  --md-code-fg-color: #dae7f5;
  --md-typeset-a-color: #66e4ea;
}

[data-md-color-scheme="default"] {
  --md-primary-fg-color: #142333;
  --md-accent-fg-color: #007f88;
  --md-typeset-a-color: #007b85;
}

body {
  background-image:
    radial-gradient(circle at 12% 14%, rgba(83, 237, 243, .08), transparent 24rem),
    radial-gradient(circle at 88% 38%, rgba(180, 120, 237, .07), transparent 28rem),
    linear-gradient(rgba(255,255,255,.013) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.013) 1px, transparent 1px);
  background-size: auto, auto, 32px 32px, 32px 32px;
}

.md-header {
  border-bottom: 1px solid rgba(237, 201, 109, .28);
  background: linear-gradient(90deg, #0d151f, #13202d 45%, #0b121c);
  box-shadow: 0 5px 28px rgba(0,0,0,.35);
}

.md-tabs {
  background: rgba(8, 14, 22, .94);
  border-bottom: 1px solid var(--relic-line);
}

.md-tabs__link--active, .md-tabs__link:hover { color: var(--relic-gold); }
.md-search__form { border: 1px solid rgba(83,237,243,.22); }

.md-typeset h1, .md-typeset h2, .md-typeset h3 {
  font-family: Georgia, "Times New Roman", serif;
  letter-spacing: .02em;
}

.md-typeset h1 {
  color: var(--relic-gold);
  text-shadow: 0 0 24px rgba(237,201,109,.14);
}

.md-typeset h2 {
  color: var(--relic-cyan-soft);
  padding-bottom: .3rem;
  border-bottom: 1px solid var(--relic-line);
}

.md-typeset table:not([class]) {
  border: 1px solid rgba(83,237,243,.22);
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}

.md-typeset table:not([class]) th {
  color: var(--relic-gold);
  background: linear-gradient(180deg, #182536, #111b29);
}

.md-typeset table:not([class]) tr:nth-child(even) { background: rgba(83,237,243,.025); }
.md-typeset code { border: 1px solid rgba(83,237,243,.13); }

.version-rail {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem 1rem;
  min-height: 2rem;
  padding: .25rem .8rem;
  color: #c3cfdf;
  font-size: .68rem;
  letter-spacing: .035em;
  background: linear-gradient(90deg, #090f17, #121b28, #090f17);
}
.version-rail span { white-space: nowrap; }
.version-rail b { color: var(--relic-cyan); font-weight: 600; }
.version-rail__label { color: var(--relic-gold); font-weight: 800; white-space:nowrap; }
.version-rail__label:hover { color:#ffe4a0; }

.relic-hero {
  position: relative;
  overflow: hidden;
  margin: 0 0 2rem;
  padding: clamp(1.4rem, 5vw, 3.4rem);
  min-height: 24rem;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(15rem, .65fr);
  align-items: center;
  gap: 2rem;
  border: 1px solid rgba(237,201,109,.34);
  clip-path: polygon(0 18px, 18px 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 18px 100%, 0 calc(100% - 18px));
  background:
    linear-gradient(110deg, rgba(8,13,22,.96), rgba(16,30,42,.86)),
    repeating-linear-gradient(135deg, transparent 0 28px, rgba(83,237,243,.04) 28px 29px);
  box-shadow: var(--relic-shadow), inset 0 0 80px rgba(83,237,243,.04);
}

.relic-hero::before, .relic-hero::after {
  content: "✦";
  position: absolute;
  color: rgba(83,237,243,.14);
  font-size: 11rem;
  line-height: 1;
  filter: blur(.2px);
}
.relic-hero::before { right: -2rem; top: -3rem; transform: rotate(17deg); }
.relic-hero::after { left: 48%; bottom: -5rem; color: rgba(237,201,109,.08); }
.relic-hero > * { position: relative; z-index: 1; }
.relic-hero h1 { margin: 0 0 .55rem; font-size: clamp(2.1rem, 5vw, 4rem); line-height: .98; }
.relic-hero__eyebrow { color: var(--relic-cyan); text-transform: uppercase; letter-spacing: .18em; font-size: .7rem; }
.relic-hero__lead { color: #c8d3e2; max-width: 42rem; font-size: 1.02rem; }
.relic-hero__actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.25rem; }

.relic-button {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .62rem .92rem;
  color: #071016 !important;
  font-weight: 800;
  border: 1px solid var(--relic-cyan);
  background: linear-gradient(180deg, #75f8fb, #35c8d0);
  box-shadow: 0 0 20px rgba(83,237,243,.16);
}
.relic-button--ghost { color: var(--relic-gold) !important; background: rgba(237,201,109,.05); border-color: rgba(237,201,109,.6); }
.relic-button:hover { transform: translateY(-1px); filter: brightness(1.08); }

.hero-relics { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; transform: rotate(2deg); }
.hero-relics .item-frame:nth-child(2) { transform: translateY(-1.2rem); }

.item-frame {
  position: relative;
  min-height: 7.2rem;
  padding: .7rem .4rem .5rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(83,237,243,.3);
  background: radial-gradient(circle, rgba(83,237,243,.12), rgba(8,13,22,.9) 67%);
  box-shadow: inset 0 0 25px rgba(83,237,243,.07), 0 9px 24px rgba(0,0,0,.28);
}
.item-frame::before, .item-frame::after { content:""; position:absolute; width:.8rem; height:.8rem; border-color:var(--relic-gold); }
.item-frame::before { left:3px; top:3px; border-left:2px solid; border-top:2px solid; }
.item-frame::after { right:3px; bottom:3px; border-right:2px solid; border-bottom:2px solid; }
.item-frame small { color: #aebbd0; font-size: .56rem; text-align: center; }

.item-sprite {
  width: 64px;
  height: 64px;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 64px auto;
  image-rendering: pixelated;
  filter: drop-shadow(0 0 9px rgba(83,237,243,.42));
}
.item-sprite--t1 { background-image:url('../textures/aster_core_tier1.png'); }
.item-sprite--t2 { background-image:url('../textures/aster_core_tier2.png'); }
.item-sprite--t3 { background-image:url('../textures/aster_core_tier3.png'); }
.item-sprite--dust { background-image:url('../textures/dust_of_enlightenment.png'); filter:drop-shadow(0 0 9px rgba(180,120,237,.5)); }
.item-sprite--r1 { background-image:url('../textures/resonance_core_lvl1.png'); }
.item-sprite--r2 { background-image:url('../textures/resonance_core_lvl2.png'); }
.item-sprite--r3 { background-image:url('../textures/resonance_core_lvl3.png'); }
.item-sprite--r4 { background-image:url('../textures/resonance_core_lvl4.png'); }
.item-sprite--r5 { background-image:url('../textures/resonance_core_lvl5.png'); }
.item-sprite--r6 { background-image:url('../textures/resonance_core_lvl6.png'); }

.relic-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:.85rem; margin:1rem 0 1.6rem; }
.relic-card {
  position:relative;
  padding:1rem;
  border:1px solid rgba(83,237,243,.2);
  border-left:3px solid var(--relic-cyan);
  background:linear-gradient(135deg,rgba(22,32,47,.92),rgba(11,17,27,.94));
  box-shadow:0 10px 28px rgba(0,0,0,.2);
}
.relic-card--gold { border-left-color:var(--relic-gold); }
.relic-card--purple { border-left-color:var(--relic-purple); }
.relic-card--green { border-left-color:var(--relic-green); }
.relic-card h3 { margin:.05rem 0 .35rem; color:#e9eef7; }
.relic-card p, .relic-card li { color:#b9c4d4; }
.relic-card p:last-child { margin-bottom:0; }
.relic-card__kicker { color:var(--relic-cyan); font-size:.64rem; text-transform:uppercase; letter-spacing:.12em; }

.release-preview { margin:1rem 0 1.6rem; }

.release-timeline {
  position:relative;
  margin:1.5rem 0 2rem;
  padding-left:2rem;
}
.release-timeline::before {
  content:"";
  position:absolute;
  top:.5rem;
  bottom:.5rem;
  left:.42rem;
  width:2px;
  background:linear-gradient(var(--relic-gold),var(--relic-cyan),rgba(83,237,243,.12));
  box-shadow:0 0 14px rgba(83,237,243,.2);
}
.release-entry {
  position:relative;
  margin:0 0 1.5rem;
  padding:1.15rem 1.25rem;
  border:1px solid rgba(83,237,243,.2);
  background:linear-gradient(135deg,rgba(22,32,47,.94),rgba(9,15,24,.97));
  box-shadow:0 14px 34px rgba(0,0,0,.24);
}
.release-entry::before {
  content:"";
  position:absolute;
  top:1.3rem;
  left:-1.94rem;
  width:.72rem;
  height:.72rem;
  border:2px solid var(--relic-cyan);
  border-radius:50%;
  background:var(--relic-void);
  box-shadow:0 0 12px rgba(83,237,243,.48);
}
.release-entry--latest { border-color:rgba(237,201,109,.38); }
.release-entry--latest::before { border-color:var(--relic-gold);box-shadow:0 0 14px rgba(237,201,109,.52); }
.release-entry__meta { display:flex;align-items:center;flex-wrap:wrap;gap:.45rem .75rem;margin-bottom:.2rem; }
.release-entry__version { color:var(--relic-gold);font:800 1rem/1 Georgia,"Times New Roman",serif; }
.release-entry__meta time { color:var(--relic-muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em; }
.release-entry__badge { padding:.12rem .42rem;color:#071016;font-size:.58rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em;background:var(--relic-gold); }
.release-entry > h2 { margin-top:.65rem; }
.release-entry > :last-child { margin-bottom:0; }

.rarity { font-weight:800; }
.rarity--common { color:#b7b7b7; }.rarity--uncommon { color:#63d879; }.rarity--rare { color:#58aef6; }
.rarity--epic { color:#b578f0; }.rarity--legendary { color:#f0bd58; }.rarity--mythical { color:#f16f7b; }.rarity--supreme { color:#6ff5ee; text-shadow:0 0 8px rgba(111,245,238,.4); }

.md-typeset img.recipe-image {
  display:block;
  width:min(100%,23.375rem);
  height:auto;
  margin:1rem 0 1.25rem;
  image-rendering:pixelated;
  border:1px solid rgba(83,237,243,.18);
  box-shadow:0 0 0 3px rgba(7,11,18,.85),0 12px 30px rgba(0,0,0,.38),0 0 24px rgba(83,237,243,.07);
}

.game-shot { display:block; width:min(100%,54rem); margin:1.2rem auto; border:1px solid rgba(237,201,109,.35); background:#080d14; box-shadow:var(--relic-shadow); }
.gallery-row { display:flex; flex-wrap:wrap; gap:.75rem; margin:1rem 0; }
.gallery-row .item-frame { width:8rem; }

.guide-flow {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:1rem 0;
  border-top:1px solid rgba(83,237,243,.3);border-left:1px solid rgba(83,237,243,.3);
  background:#0a111b;box-shadow:var(--relic-shadow);
}
.guide-step {
  position:relative;min-height:8rem;padding:1rem;display:grid;
  grid-template-columns:2.75rem minmax(0,1fr);grid-template-rows:2.75rem auto;
  gap:.65rem .8rem;align-items:center;border-right:1px solid rgba(83,237,243,.3);border-bottom:1px solid rgba(83,237,243,.3);
}
.guide-step__number { position:absolute;top:.45rem;left:.55rem;color:var(--relic-cyan);font-size:.56rem;font-weight:900; }
.guide-step__image,.guide-step__sprite,.guide-step__symbol { grid-row:1 / span 2;width:2.75rem;height:2.75rem; }
.guide-step__image { object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 0 7px rgba(83,237,243,.28)); }
.guide-step__sprite { background-size:2.75rem auto;animation:none!important; }
.guide-step__symbol { display:grid;place-items:center;color:var(--relic-gold);font-size:.76rem;font-weight:900;border:1px solid rgba(237,201,109,.45);background:rgba(237,201,109,.07); }
.guide-step strong { display:block;color:#eef6ff;font-size:.82rem; }
.guide-step div>span { display:block;margin-top:.18rem;color:#98a8bb;font-size:.66rem;line-height:1.45; }
.flow-next { margin:.7rem 0 1.5rem;padding:.75rem 1rem;border-left:3px solid var(--relic-cyan);background:rgba(83,237,243,.05); }

.aster-interface { width:min(100%,52rem);margin:1.15rem auto;border:1px solid rgba(237,201,109,.38);background:#09111a;box-shadow:var(--relic-shadow); }
.aster-interface__title { padding:.8rem 1rem;text-align:center;border-bottom:1px solid rgba(83,237,243,.22);background:#142535; }
.aster-interface__title strong { display:block;color:var(--relic-gold);font-family:Georgia,serif;font-size:1rem; }
.aster-interface__title span { display:block;margin-top:.1rem;color:#71869a;font-size:.49rem;letter-spacing:.12rem;text-transform:uppercase; }
.aster-interface__work { display:grid;grid-template-columns:minmax(15rem,.9fr) minmax(14rem,1.1fr);gap:1rem;padding:1rem; }
.aster-interface__slots { min-width:0;display:flex;align-items:center;justify-content:center;gap:.75rem; }
.aster-slot { min-width:6rem;text-align:center; }
.aster-slot>span { display:block;margin-bottom:.35rem;color:var(--relic-cyan);font-size:.55rem;font-weight:900;text-transform:uppercase; }
.aster-slot small { display:block;margin-top:.35rem;color:#8292a5;font-size:.52rem; }
.aster-slot__box { position:relative;width:4.4rem;height:4.4rem;margin:auto;display:grid;place-items:center;border:2px solid #4c5d70;background:#080e17;box-shadow:inset 0 0 0 3px #111c29; }
.aster-slot__box img { width:3.45rem;height:3.45rem;object-fit:contain;image-rendering:pixelated; }
.aster-slot__box .item-sprite { width:3.3rem;height:3.3rem;background-size:3.3rem auto;animation:none!important; }
.aster-slot__box b { position:absolute;right:.18rem;bottom:.08rem;color:#fff;font-size:.6rem;text-shadow:1px 1px #000; }
.aster-interface__operator { color:var(--relic-cyan);font-size:1.5rem;font-weight:300; }
.aster-preview { min-width:0;padding:.85rem;border-left:2px solid var(--relic-gold);background:#101925; }
.aster-preview__label { display:block;color:var(--relic-gold);font-size:.54rem;font-weight:900;text-transform:uppercase; }
.aster-preview>strong { display:block;margin:.38rem 0 .6rem;color:#f0f5fb;font-size:.78rem;overflow-wrap:anywhere; }
.aster-preview__change { display:flex;justify-content:space-between;gap:.8rem;padding:.16rem 0;color:#a8b5c4;font-size:.62rem; }
.aster-preview__change b { color:#6ee3ab;white-space:nowrap; }
.aster-preview__cost { margin:.55rem 0 .35rem;padding-top:.45rem;color:var(--relic-gold);font-size:.62rem;font-weight:800;border-top:1px solid #344151; }
.aster-preview small { color:#77879a;font-size:.54rem; }
.aster-interface__inventory { padding:.7rem 1rem;display:flex;align-items:center;gap:.35rem;color:#74869a;font-size:.5rem;border-top:1px solid #283646;background:#0c151f; }
.aster-interface__inventory i { width:1.4rem;height:1.4rem;flex:0 0 auto;border:1px solid #344558;background:#111b27; }
.aster-interface__inventory span:last-child { margin-left:auto;text-align:right; }
.screen-key { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin:1rem 0 1.5rem; }
.screen-key>div { display:grid;grid-template-columns:1.7rem minmax(0,1fr);gap:.55rem;align-items:start; }
.screen-key b { width:1.7rem;height:1.7rem;display:grid;place-items:center;color:#071018;background:var(--relic-cyan);font-size:.67rem; }
.screen-key span { color:#9daabd;font-size:.64rem;line-height:1.5; }
.screen-key strong { color:#eef4fb; }

.dust-summary { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:1rem 0;border-top:1px solid rgba(180,120,237,.38);border-left:1px solid rgba(180,120,237,.38); }
.dust-summary>div { padding:.85rem;border-right:1px solid rgba(180,120,237,.38);border-bottom:1px solid rgba(180,120,237,.38);background:#10131e; }
.dust-summary strong,.dust-summary span { display:block; }
.dust-summary strong { color:#d5b8ee;font-size:.68rem; }
.dust-summary span { margin-top:.25rem;color:#9ca9ba;font-size:.6rem;line-height:1.45; }
.dust-flow { display:grid;grid-template-columns:.8fr .85fr 1.35fr .8fr;margin:1.2rem 0;border:1px solid rgba(180,120,237,.42);background:#0c0e18;box-shadow:var(--relic-shadow); }
.dust-step { position:relative;min-width:0;min-height:8.5rem;padding:1rem .8rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;text-align:center;border-right:1px solid rgba(180,120,237,.28); }
.dust-step:last-child { border-right:0; }
.dust-step>b { position:absolute;top:.45rem;left:.55rem;color:#c894ef;font-size:.58rem; }
.dust-step strong,.dust-step span { display:block; }
.dust-step strong { color:#e8d8f6;font-size:.72rem; }
.dust-step span { color:#97a4b5;font-size:.58rem;line-height:1.4; }
.dust-step .item-sprite { width:3rem;height:3rem;background-size:3rem auto;animation:none!important; }
.dust-step--compare { align-items:stretch;text-align:left; }
.dust-allocation { margin-top:.35rem;padding:.3rem .4rem;white-space:normal; }
.dust-allocation--old { color:#eabf65!important;background:rgba(234,191,101,.07); }
.dust-allocation--new { color:#58e8ed!important;background:rgba(88,232,237,.07); }
.dust-step small { display:block;margin-top:.35rem;color:#78869a;font-size:.52rem; }
.dust-step--choose em { display:inline-block;margin:.25rem .1rem 0;padding:.2rem .35rem;color:#8ce8ad;font-style:normal;border:1px solid rgba(112,220,154,.35); }
.dust-warning { padding:.78rem 1rem;color:#c7d1df;border-left:3px solid var(--relic-gold);background:rgba(237,201,109,.07); }

.build-callout { padding:1rem 1.1rem;border:1px solid rgba(237,201,109,.34);background:linear-gradient(90deg,rgba(237,201,109,.07),rgba(83,237,243,.04)); }
.build-callout strong { color:var(--relic-gold); }

.calculator {
  margin:1.2rem 0;padding:1.1rem;border:1px solid rgba(83,237,243,.28);background:linear-gradient(135deg,#111b29,#0a111b);box-shadow:var(--relic-shadow);
}
.calculator__grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.75rem;align-items:end; }
.calculator label { display:grid;gap:.25rem;color:#b9c7d8;font-size:.68rem; }
.calculator input,.calculator select { width:100%;padding:.5rem;color:#e9f2ff;border:1px solid #3f5268;background:#080e17; }
.calculator button { padding:.56rem .8rem;color:#061013;font-weight:800;border:1px solid var(--relic-cyan);background:var(--relic-cyan);cursor:pointer; }
.calculator__result { min-height:3rem;margin:.9rem 0 0;padding:.75rem;display:grid;gap:.18rem;color:#dce8f7;border-left:3px solid var(--relic-gold);background:rgba(237,201,109,.06); }
.calculator__result[data-state="error"] { color:#ffd0d1;border-left-color:#ed6f72;background:rgba(237,111,114,.07); }
.calculator__result[data-state="success"] { border-left-color:#70dc9a; }
.calculator__result span,.calculator__result small { display:block; }
.calculator__result small { color:#91a0b3; }
.calculator__answer strong { color:#70dc9a; }


.relic-footer { margin-top:3rem;padding:1.2rem;display:flex;justify-content:center;color:#aeb9ca;border-top:1px solid rgba(83,237,243,.17);background:#080d14; }
.relic-footer div { display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;justify-content:center; }
.relic-footer__sigil { color:var(--relic-cyan);font-size:1.2rem; }.relic-footer small { color:#718096; }

@media (max-width: 800px) {
  .relic-hero { grid-template-columns:1fr; min-height:0; }
  .hero-relics { max-width:22rem; }
  .release-timeline { padding-left:1.35rem; }
  .release-entry::before { left:-1.3rem; }
  .guide-flow { grid-template-columns:1fr; }
  .guide-step { min-height:6.6rem;grid-template-columns:2.4rem minmax(0,1fr);grid-template-rows:auto; }
  .guide-step__image,.guide-step__sprite,.guide-step__symbol { grid-row:auto;width:2.4rem;height:2.4rem; }
  .aster-interface__work { grid-template-columns:1fr; }
  .aster-preview { border-left:0;border-top:2px solid var(--relic-gold); }
  .aster-interface__inventory span:last-child { display:none; }
  .screen-key,.dust-summary { grid-template-columns:1fr; }
  .dust-flow { grid-template-columns:1fr; }
  .dust-step { min-height:6.5rem;border-right:0;border-bottom:1px solid rgba(180,120,237,.28); }
  .dust-step:last-child { border-bottom:0; }
}

@media (max-width: 420px) {
  .aster-interface__slots { gap:.35rem; }
  .aster-slot { min-width:0; }
  .aster-slot__box { width:3.8rem;height:3.8rem; }
  .aster-interface__operator { font-size:1.1rem; }
  .aster-preview__change { align-items:flex-start;flex-direction:column;gap:.05rem; }
}

@media (prefers-reduced-motion:no-preference) {
  .item-sprite { animation:relic-float 3.6s ease-in-out infinite; }
  .item-frame:nth-child(2) .item-sprite { animation-delay:-1.2s; }
  @keyframes relic-float { 0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)} }
}