@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=IBM+Plex+Mono:wght@400;500;600&family=Manrope:wght@400;500;600;700;800&display=swap");
:root {
  --bg: #110f14;
  --surface: #1b181e;
  --line: #ffffff15;
  --muted: #a399ae;
  --green: #c29fe9;
  --purple: #c29fe9;
  background: var(--bg);
  color: #f0eef3;
  font-family: Manrope, system-ui, sans-serif;
}
body {
  background: var(--bg);
}
h1,
h2,
h3,
.brand {
  font-family: Manrope, system-ui, sans-serif;
}
.wrap {
  width: min(1280px, calc(100% - 96px));
}
#header {
  height: 80px;
  background: #110f14f5;
  border-bottom: 1px solid #ffffff13;
  position: sticky;
  top: 0;
  backdrop-filter: blur(18px);
  z-index: 20;
}
.header-inner {
  gap: 30px;
}
.brand {
  font-size: 19px;
  letter-spacing: -0.8px;
}
.brand span span {
  color: #d5d1da;
  font-weight: 500;
}
.brand img {
  width: 32px;
  height: 32px;
  filter: hue-rotate(240deg) saturate(0.7);
}
.nav {
  gap: 28px;
}
.nav a {
  font-size: 12px;
  padding: 30px 0;
  color: #a197ad;
}
.nav a.active:after {
  background: var(--green);
  height: 3px;
  width: 16px;
  right: auto;
  bottom: 15px;
}
.header-tools {
  gap: 16px;
  margin-left: 8px;
}
.cart-badge {
  color: #191024;
  border-radius: 3px;
  background: var(--green);
}
.btn {
  border-radius: 5px;
  border: 1px solid #ffffff26;
  background: #242029;
  color: #f0eef2;
  font-size: 12px;
  font-weight: 700;
  min-height: 44px;
  gap: 14px;
  box-shadow: inset 0 1px #ffffff07;
  transition:
    background 0.2s,
    border-color 0.2s,
    box-shadow 0.2s,
    transform 0.2s;
  position: relative;
  overflow: hidden;
}
.btn:hover {
  transform: translateY(-1px);
  background: #342e3a;
  border-color: #ffffff55;
}
.btn:active {
  transform: translateY(1px);
}
.btn .icon {
  transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.btn:hover .icon {
  transform: translateX(4px);
}
.btn.primary {
  background: var(--green);
  color: #1b1325;
  border-color: #d8c2f1;
  box-shadow:
    inset 0 1px #ffffff60,
    0 3px 0 #543a72;
}
.btn.primary:hover {
  background: #d6c0f0;
  box-shadow:
    inset 0 1px #ffffff80,
    0 3px 0 #543a72,
    0 8px 28px #b186e318;
}
.btn.primary:active {
  box-shadow:
    inset 0 1px #ffffff60,
    0 1px 0 #543a72;
}
.btn.secondary,
.btn.ghost {
  background: #16131aa8;
  border-color: #ffffff2b;
}
.btn.small {
  min-height: 36px;
}
.btn.purple {
  background: #46315e;
  border-color: #6a5484;
}
.text-link {
  color: #ccc1d8;
}
.icon-button {
  border-radius: 5px;
  min-width: 34px;
  min-height: 34px;
  transition: background 0.2s;
}
.icon-button:hover {
  background: #ffffff0c;
}
.eyebrow,
.mono,
.world-kicker,
.visual-tag,
.path-index,
.hero-footnote,
.world-caption,
.scroll-cue,
.faq-index {
  font-family: "IBM Plex Mono", monospace;
  font-size: 10px;
  letter-spacing: 1.3px;
  font-weight: 500;
}
.eyebrow {
  color: #a18fb5;
  display: block;
  margin-bottom: 20px;
}
.dot,
.status-dot {
  background: var(--green);
  width: 5px;
  height: 5px;
  display: inline-block;
  flex: none;
  border-radius: 0;
  box-shadow: 0 0 9px #c29fe955;
}
.world-hero {
  height: 680px;
  min-height: 600px;
  max-height: 850px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #1a1420;
}
.world-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 65% 52%;
  z-index: -3;
  animation: world-enter 1.8s ease-out both;
}
.world-shade {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(
      90deg,
      #0c0712e8 0%,
      #0f0a15c4 32%,
      #120b1936 66%,
      #0e09130c
    ),
    linear-gradient(0deg, #110f14 0%, transparent 27%, #0e0a1322 100%);
}
.world-grain {
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.09;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.4' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
  pointer-events: none;
}
.world-content {
  padding-top: 88px;
  position: relative;
}
.world-kicker {
  display: flex;
  align-items: center;
  gap: 13px;
  color: #d1cad9;
  font-size: 9px;
  letter-spacing: 1.7px;
}
.world-kicker > span:not(.pixel-mark) {
  color: #6a5e78;
}
.pixel-mark {
  width: 10px;
  height: 10px;
  border: 2px solid var(--green);
  box-shadow: 3px 3px 0 #c29fe940;
  transform: rotate(45deg);
}
.world-content h1 {
  font-family: "Barlow Condensed", Impact, sans-serif;
  font-size: clamp(80px, 8.3vw, 124px);
  font-weight: 700;
  line-height: 0.94;
  letter-spacing: -1.8px;
  text-transform: uppercase;
  margin: 29px 0 25px;
  color: #f4f1e9;
  max-width: 760px;
}
.world-content h1 span {
  color: var(--green);
}
.world-content > p {
  font-size: 14px;
  line-height: 1.8;
  color: #c8c1cf;
  max-width: 480px;
  margin-bottom: 30px;
}
.world-content .actions {
  gap: 12px;
}
.hero-button {
  min-height: 49px;
  padding: 14px 21px;
}
.hero-footnote {
  font-size: 9px;
  letter-spacing: 0.1px;
  color: #9f94ab;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 25px;
}
.world-caption {
  position: absolute;
  bottom: 53px;
  right: max(48px, calc((100vw - 1280px) / 2));
  display: grid;
  gap: 8px;
  text-align: right;
  color: #ddd6e5;
  font-size: 9px;
}
.world-caption small {
  font-family: Manrope, sans-serif;
  font-size: 9px;
  color: #a095ac;
  letter-spacing: 0;
}
.scroll-cue {
  position: absolute;
  left: max(48px, calc((100vw - 1280px) / 2));
  bottom: 42px;
  display: flex;
  gap: 24px;
  align-items: center;
  font-size: 8px;
  color: #aba2b6;
}
.scroll-cue > span:last-child {
  font-size: 22px;
  animation: scroll-tick 2.8s infinite;
}
.compat-band {
  border-block: 1px solid var(--line);
  background: #161319;
}
.compat-band > .wrap {
  display: flex;
  gap: 60px;
  align-items: center;
  min-height: 88px;
}
.compat-band .mono {
  font-size: 8px;
  max-width: 135px;
  line-height: 1.7;
  letter-spacing: 1px;
  color: #8c7f9a;
}
.platform-names {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 1;
  gap: 24px;
}
.platform-names > span {
  font-size: 19px;
  font-weight: 800;
  color: #ada4b8;
  display: flex;
  align-items: center;
  gap: 35px;
  letter-spacing: -0.6px;
}
.tiny-square {
  width: 3px;
  height: 3px;
  background: #544961;
}
.section {
  padding-top: 100px;
  padding-bottom: 100px;
}
.section-top {
  align-items: end;
  margin-bottom: 40px;
}
.section-top h2,
.studio-faq h2 {
  font-size: clamp(32px, 3.4vw, 46px);
  line-height: 1.15;
  letter-spacing: -1.8px;
  margin-bottom: 0;
  font-weight: 700;
}
.section-aside {
  color: #988ca5;
  font-size: 12px;
  line-height: 1.8;
  margin: 0 0 4px !important;
  max-width: 330px;
}
.path-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.path-card {
  border: 1px solid #ffffff13;
  border-radius: 7px;
  background: #19161d;
  overflow: hidden;
  display: block;
  transition:
    transform 0.35s,
    border-color 0.35s,
    box-shadow 0.35s;
}
.path-card:hover {
  transform: translateY(-6px);
  border-color: #a18db766;
  box-shadow: 0 18px 50px #0004;
}
.path-visual {
  height: 215px;
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  border-bottom: 1px solid #ffffff0b;
}
.visual-tag {
  position: absolute;
  top: 18px;
  left: 19px;
  font-size: 7px;
  letter-spacing: 1.4px;
  color: #bcb4c6;
  z-index: 2;
}
.mod-visual {
  background:
    radial-gradient(ellipse at 50% 100%, #6d508f44, transparent 65%),
    linear-gradient(140deg, #2a2333, #19141f);
}
.mod-visual:before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(#af9ac80a 1px, transparent 1px),
    linear-gradient(90deg, #af9ac80a 1px, transparent 1px);
  background-size: 26px 26px;
  transform: rotate(-12deg) scale(1.3);
}
.pixel-pickaxe {
  width: 115px;
  transform: rotate(-9deg);
  filter: drop-shadow(10px 15px 0 #0003);
  transition: transform 0.5s;
}
.path-card:hover .pixel-pickaxe {
  transform: rotate(9deg) translateY(-5px);
}
.visual-coordinates {
  position: absolute;
  bottom: 15px;
  right: 17px;
  color: #746782;
  font:
    8px "IBM Plex Mono",
    monospace;
  letter-spacing: 1px;
}
.plugin-visual {
  background: linear-gradient(130deg, #1c252c, #1b1720);
}
.server-console {
  background: #131016;
  border: 1px solid #796b8938;
  border-radius: 6px;
  width: 78%;
  transform: rotate(-5deg) translateY(14px);
  box-shadow: 14px 14px #0002;
  transition: transform 0.5s;
}
.path-card:hover .server-console {
  transform: rotate(0) translateY(8px);
}
.server-console > div {
  height: 29px;
  border-bottom: 1px solid #ffffff0c;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 10px;
}
.server-console i {
  display: block;
  width: 4px;
  height: 4px;
  background: #6e627c;
  border-radius: 50%;
}
.server-console > div span {
  font:
    7px "IBM Plex Mono",
    monospace;
  margin-left: 8px;
  color: #6f637d;
}
.server-console code {
  display: block;
  font:
    10px/2 "IBM Plex Mono",
    monospace;
  color: #d8d4dd;
  padding: 13px;
}
.server-console code > span {
  color: #a1b6d7;
}
.server-console code b {
  color: #a98cca;
  font-weight: 400;
}
.server-console em {
  display: block;
  border-top: 1px solid #ffffff0c;
  margin-top: 7px;
  padding-top: 7px;
  font-size: 8px;
  font-style: normal;
  color: #7f6c94;
}
.typing-caret {
  animation: caret 1.3s steps(2) infinite;
}
.custom-visual {
  background: linear-gradient(145deg, #27222c, #1d1a21);
}
.craft-grid {
  display: grid;
  grid-template-columns: repeat(3, 36px);
  gap: 5px;
  transform: rotate(7deg);
  transition: transform 0.5s;
}
.craft-grid > span {
  height: 36px;
  border: 1px solid #a592ba30;
  background: #a592ba08;
  display: grid;
  place-items: center;
  box-shadow: inset 2px 2px #0003;
}
.craft-grid b {
  color: #e0cd99;
  font: 26px "Barlow Condensed";
  background: #ac966224;
  width: 100%;
  height: 100%;
  text-align: center;
}
.craft-grid i {
  width: 12px;
  height: 12px;
  background: #81689d;
  box-shadow: 3px 3px #392b49;
}
.path-card:hover .craft-grid {
  transform: rotate(0) scale(1.05);
}
.craft-note {
  position: absolute;
  bottom: 14px;
  font: 8px "IBM Plex Mono";
  color: #8d7e9f;
}
.path-copy {
  padding: 23px 24px 0;
}
.path-index {
  float: right;
  color: #695d76;
  font-size: 9px;
}
.path-copy h3 {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.6px;
  min-height: 47px;
  margin: 8px 20px 11px 0;
  max-width: 260px;
}
.path-copy p {
  color: #978ba4;
  font-size: 12px;
  line-height: 1.85;
  min-height: 68px;
  margin: 0 0 25px;
}
.path-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #ffffff12;
  padding: 18px 0;
  font-size: 10px;
  font-weight: 700;
  color: #ccc1d8;
}
.path-bottom .icon {
  width: 16px;
  transition: transform 0.3s;
}
.path-card:hover .path-bottom .icon {
  transform: translate(3px, -3px);
}
.workshop-section {
  background: #201c25;
  border-block: 1px solid #b3a2c720;
  position: relative;
  overflow: hidden;
}
.workshop-section:after {
  content: "+";
  position: absolute;
  font: 400 430px "IBM Plex Mono";
  color: #ab96c304;
  bottom: -180px;
  left: 28%;
  pointer-events: none;
}
.workshop-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 110px;
  padding-block: 85px;
  position: relative;
  z-index: 1;
}
.workshop-intro h2 {
  font-family: "Barlow Condensed", Impact, sans-serif;
  text-transform: uppercase;
  font-size: 80px;
  line-height: 0.98;
  letter-spacing: -0.8px;
  font-weight: 700;
  margin-bottom: 26px;
}
.workshop-intro h2 em {
  font-style: normal;
  color: #b5a4c9;
}
.workshop-intro p {
  font-size: 12px;
  color: #a79db2;
  max-width: 345px;
  margin-bottom: 29px;
}
.workshop-steps {
  padding-top: 24px;
}
.workshop-step {
  display: grid;
  grid-template-columns: 35px 1fr 22px;
  gap: 17px;
  border-top: 1px solid #dbd0e720;
  padding: 30px 0;
}
.workshop-step > .mono {
  color: #8b7d9a;
  font-size: 10px;
  margin-top: 5px;
}
.workshop-step h3 {
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -0.4px;
  margin-bottom: 10px;
}
.workshop-step p {
  font-size: 12px;
  color: #a399af;
  line-height: 1.8;
  max-width: 345px;
  margin: 0;
}
.workshop-step > .icon {
  color: #7c6e8d;
  width: 17px;
  margin-top: 5px;
}
.project-receipt {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #15101a80;
  padding: 16px;
  font-size: 9px;
  color: #aea2bb;
  border: 1px solid #ad96c713;
  border-radius: 4px;
}
.project-receipt > .icon {
  margin-left: auto;
  width: 14px;
}
.studio-faq {
  gap: 100px;
}
.studio-faq h2 {
  margin-bottom: 30px;
}
.studio-faq details {
  background: none;
  border: 0;
  border-bottom: 1px solid #ffffff1a;
  border-radius: 0;
  padding: 0;
  margin: 0;
}
.studio-faq summary {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 24px 0;
  font-size: 12px;
  font-weight: 600;
}
.studio-faq summary:after {
  margin-left: auto;
  color: #ada4b7;
  font-weight: 400;
}
.faq-index {
  font-size: 9px;
  color: #665877;
}
.faq-answer p {
  padding: 0 32px 23px;
  margin: 0;
  font-size: 12px;
  color: #9f95ab;
}
.studio-faq details[open] .faq-answer {
  animation: answer-in 0.25s ease-out;
}
.studio-signoff {
  border-top: 1px solid var(--line);
  padding: 38px 0 30px;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
}
.studio-signoff > span {
  font-family: "Barlow Condensed";
  font-size: clamp(35px, 7.8vw, 110px);
  font-weight: 700;
  letter-spacing: -2px;
  line-height: 1;
  color: #ddd8e2;
}
.studio-signoff > span > span {
  color: #61546f;
}
.studio-signoff i {
  font: 15px Manrope;
  vertical-align: top;
  margin-left: 8px;
}
.studio-signoff p {
  color: #827492;
  font-size: 8px;
  margin-bottom: 7px;
  white-space: nowrap;
}
.footer {
  background: #0e0c10;
  border-top: 1px solid #ffffff12;
}
.footer-grid p,
.footer-links a,
.footer-links button {
  color: #9589a2;
}
.footer-bottom {
  border-color: #ffffff10;
  color: #6c5f7a;
}
.footer-links h4 {
  font: 10px "IBM Plex Mono";
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #c9c2d1;
}
.footer-links a:hover,
.footer-links button:hover {
  color: #d8c7eb;
}
.page-head h1 {
  font-family: "Barlow Condensed", Impact, sans-serif;
  text-transform: uppercase;
  font-size: clamp(45px, 5.6vw, 75px);
  letter-spacing: -0.5px;
  line-height: 1.05;
}
.page-head p {
  color: var(--muted);
}
.page {
  min-height: 65vh;
}
.panel,
.record,
.metric,
.auth-card,
.product-card {
  background: #1b181e;
  border-color: #ffffff16;
  border-radius: 7px;
  box-shadow: 0 2px 4px #0001;
}
.field {
  background: #131016;
  border-color: #ffffff20;
  border-radius: 5px;
  transition:
    border-color 0.2s,
    box-shadow 0.2s;
  color: #e6e3ea;
  min-height: 43px;
}
.field:focus {
  border-color: #a891c2;
  box-shadow: 0 0 0 3px #ac90cb14;
  outline: 0;
}
.toolbar {
  background: #1b181e;
  border: 1px solid #ffffff12;
  padding: 13px;
  border-radius: 7px;
  gap: 10px;
}
.product-card {
  transition:
    transform 0.3s,
    border-color 0.3s;
}
.product-card:hover {
  border-color: #a18eb777;
  transform: translateY(-5px);
}
.product-image {
  background: #27202f;
}
.product-body small {
  color: #998aaa;
}
.product-body h3 {
  letter-spacing: -0.4px;
}
.product-body p {
  color: #a79db2;
}
.product-bottom {
  border-color: #ffffff12;
}
.tag {
  background: #342940;
  color: #c2b1d5;
  border-color: #554468;
  border-radius: 4px;
  font-size: 9px;
}
.tag.gray {
  background: #28232d;
  color: #aca3b6;
}
.price {
  color: #f1edf5;
}
.sidebar {
  background: #17141b;
  border-color: #ffffff13;
}
.sidebar a.active {
  background: #30263c;
  color: #ccb6e5;
  border-color: #5b496f;
}
.sidebar a:hover {
  background: #221b2a;
}
.account-shell {
  background: var(--bg);
}
.account-heading h1 {
  letter-spacing: -1px;
}
.metric small {
  color: #9e93aa;
}
.metric strong {
  font-family: "Barlow Condensed";
  font-size: 44px;
  letter-spacing: 0;
}
.table-wrap {
  border-color: #ffffff18;
  border-radius: 5px;
}
th {
  background: #201b26;
  color: #b0a8ba;
}
td {
  border-color: #ffffff10;
}
.notice {
  background: #221c29;
  border-color: #5b3d7e55;
  color: #b9aacb;
}
.inline-error {
  background: #351f1d;
  color: #f5b8ae;
}
.loading {
  color: #b6aac4;
}
.empty {
  border-color: #ffffff15;
  background: #17141b;
}
.empty > .icon {
  color: #806d96;
}
.empty h2 {
  letter-spacing: -1px;
}
.legal-layout .prose {
  color: #c2bbc9;
}
.cookie-banner {
  background: #1f1b24f5;
  backdrop-filter: blur(20px);
  border: 1px solid #b3a3c538;
  box-shadow: 0 16px 60px #0008;
  border-radius: 8px;
  max-width: 356px;
  padding: 20px;
}
.cookie-banner h3 {
  font-size: 13px;
  margin-bottom: 8px;
}
.cookie-banner p {
  font-size: 10px;
  color: #aea5b8;
}
.cookie-banner .btn {
  font-size: 9px;
  min-height: 34px;
  padding: 9px 11px;
  box-shadow: none;
}
.cookie-banner .preferences {
  color: #afa0c0;
  font-size: 9px;
}
.cookie-banner .actions {
  gap: 8px;
}
dialog {
  background: #1e1a22;
  border: 1px solid #c2b0d633;
  border-radius: 9px;
  box-shadow: 0 24px 100px #000a;
  color: #f1eef4;
}
dialog::backdrop {
  background: #07040ab8;
  backdrop-filter: blur(5px);
}
dialog[open] {
  animation: dialog-enter 0.2s ease-out;
}
.modal-top h2 {
  font-size: 23px;
  letter-spacing: -0.7px;
}
.toast {
  background: #2b2137;
  border-color: #56426d;
}
.search-trigger {
  gap: 10px;
  border: 1px solid #ffffff15;
  padding: 7px 9px;
  background: transparent;
  color: #a49aaf;
  font-size: 11px;
  display: flex;
  align-items: center;
  border-radius: 5px;
}
.search-trigger:hover {
  background: #ffffff08;
}
.search-trigger .icon {
  width: 15px;
}
.search-trigger{width:38px;height:38px;justify-content:center;border-radius:10px;padding:0;cursor:pointer}
.search-trigger .icon{width:18px;height:18px}
.language-picker{position:relative;color:#bfb6ca;border:0;padding:0;margin:0}
.language-picker summary:after{display:none}
.language-picker summary{display:flex;align-items:center;gap:7px;padding:8px 6px;min-height:38px;box-sizing:border-box;border:0;border-radius:5px;list-style:none;cursor:pointer;font-size:11px;font-weight:500;background:transparent}
.language-picker summary::-webkit-details-marker{display:none}
.language-picker summary:hover,.language-picker[open] summary{color:#fff}
.language-picker summary>.icon{width:16px;height:16px}
.language-chevron{width:11px;height:11px;transition:transform .15s}
.language-picker[open] .language-chevron{transform:rotate(180deg)}
.language-menu{position:absolute;right:0;top:calc(100% + 8px);width:186px;padding:5px;border:1px solid #ffffff20;border-radius:7px;background:#1b1721;box-shadow:0 6px 18px #0005;z-index:100}
.language-menu button{display:flex;align-items:center;gap:12px;width:100%;min-height:38px;padding:9px 10px;border:0;border-radius:3px;background:transparent;color:#ccc4d5;text-align:left;cursor:pointer;font:400 12px Manrope,sans-serif}
.language-menu button:hover{background:#ffffff08;color:#fff}
.language-menu button[aria-pressed=true]{background:#ffffff06;color:#eee6f7}
.language-name{flex:1}.language-check{width:14px;height:14px;color:#bd94e5;flex-shrink:0}.language-check[hidden]{display:none}
.language-picker :focus-visible{outline:2px solid #c795ff;outline-offset:2px}
@media(max-width:600px){.language-picker summary{gap:4px;padding:7px 5px;min-height:34px}.language-picker summary>.icon{display:none}.language-menu{right:-45px}.language-menu button{min-height:44px}}
@media(prefers-reduced-motion:reduce){.language-chevron{transition:none}}
.command-search {
  min-width: min(480px, 70vw);
}
.command-search .field {
  width: 100%;
  margin-bottom: 12px;
}
.command-results {
  max-height: 320px;
  overflow: auto;
}
.command-results a {
  display: flex;
  justify-content: space-between;
  padding: 14px;
  border-radius: 4px;
  font-size: 12px;
}
.command-results a:hover,
.command-results a:focus {
  background: #352a41;
}
.command-results small {
  color: #9a8bab;
}
.command-results p {
  font-size: 12px;
  color: #a297ae;
}
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.7s ease,
    transform 0.7s cubic-bezier(0.2, 0.7, 0.3, 1);
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.path-card:nth-child(2) {
  transition-delay: 65ms;
}
.path-card:nth-child(3) {
  transition-delay: 130ms;
}
.path-card.is-visible:hover {
  transform: translateY(-6px);
  transition-delay: 0ms;
}
.world-content > * {
  animation: content-enter 0.9s both;
}
.world-content h1 {
  animation-delay: 0.08s;
}
.world-content > p {
  animation-delay: 0.16s;
}
.world-content .actions {
  animation-delay: 0.24s;
}
.world-content .hero-footnote {
  animation-delay: 0.3s;
}
@keyframes world-enter {
  from {
    transform: scale(1.035);
    opacity: 0.5;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes content-enter {
  from {
    opacity: 0;
    transform: translateY(15px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes scroll-tick {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(5px);
  }
}
@keyframes caret {
  50% {
    opacity: 0;
  }
}
@keyframes answer-in {
  from {
    opacity: 0;
    transform: translateY(-5px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes dialog-enter {
  from {
    opacity: 0;
    transform: scale(0.97) translateY(5px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@media (min-width: 1600px) {
  .world-hero {
    height: 740px;
  }
  .world-content {
    padding-top: 105px;
  }
}
@media (max-width: 1100px) {
  .wrap {
    width: calc(100% - 56px);
  }
  .header-inner {
    gap: 20px;
  }
  .nav {
    gap: 19px;
  }
  .header-tools {
    gap: 10px;
  }
  .search-trigger kbd {
    display: none;
  }
  .world-content h1 {
    font-size: 96px;
  }
  .world-hero {
    height: 650px;
  }
  .world-caption {
    right: 28px;
  }
  .scroll-cue {
    left: 28px;
  }
  .compat-band > .wrap {
    gap: 30px;
  }
  .platform-names > span {
    font-size: 16px;
    gap: 15px;
  }
  .workshop-grid {
    gap: 60px;
  }
  .path-grid {
    gap: 15px;
  }
  .path-copy {
    padding-inline: 19px;
  }
  .path-copy h3 {
    font-size: 17px;
  }
  .path-visual {
    height: 190px;
  }
  .studio-faq {
    gap: 50px;
  }
}
@media (max-width: 800px) {
  #header {
    height: 68px;
  }
  .brand {
    font-size: 17px;
  }
  .nav {
    background: #19151d;
    border-color: #ffffff1a;
  }
  .nav a {
    padding: 14px 0;
  }
  .nav a.active:after {
    bottom: 7px;
  }
  .header-tools {
    margin-left: auto;
    gap: 8px;
  }
  .header-tools .btn {
    padding: 8px 11px;
  }
  .language .icon {
    display: none;
  }
  .world-hero {
    height: 660px;
  }
  .world-content {
    padding-top: 75px;
  }
  .world-content h1 {
    font-size: 88px;
  }
  .world-shade {
    background:
      linear-gradient(90deg, #0d0812e6, #120b19a0 60%, #110a1835),
      linear-gradient(0deg, #110f14, transparent 40%);
  }
  .world-image {
    object-position: 70% center;
  }
  .world-caption {
    bottom: 36px;
  }
  .scroll-cue {
    bottom: 34px;
  }
  .compat-band > .wrap {
    flex-direction: column;
    gap: 16px;
    align-items: start;
    padding-block: 23px;
  }
  .compat-band .mono {
    max-width: none;
  }
  .platform-names {
    width: 100%;
    gap: 12px;
  }
  .platform-names > span {
    font-size: 15px;
  }
  .platform-names .tiny-square {
    display: none;
  }
  .section {
    padding-block: 65px;
  }
  .section-top {
    align-items: start;
    gap: 22px;
    flex-direction: column;
  }
  .section-top h2,
  .studio-faq h2 {
    font-size: 36px;
  }
  .section-aside {
    font-size: 12px;
  }
  .path-grid {
    grid-template-columns: 1fr;
  }
  .path-card {
    display: grid;
    grid-template-columns: 40% 60%;
    min-height: 230px;
  }
  .path-visual {
    height: 100%;
    min-height: 230px;
    border-bottom: 0;
    border-right: 1px solid #ffffff12;
  }
  .path-copy {
    padding: 22px 24px 0;
  }
  .path-copy h3 {
    min-height: 0;
    font-size: 20px;
  }
  .path-copy p {
    min-height: 0;
    margin-bottom: 15px;
  }
  .path-bottom {
    padding-block: 16px;
  }
  .server-console {
    width: 88%;
  }
  .server-console code {
    font-size: 8px;
  }
  .visual-tag {
    font-size: 6px;
    left: 13px;
  }
  .workshop-grid {
    gap: 40px;
    padding-block: 60px;
  }
  .workshop-intro h2 {
    font-size: 64px;
  }
  .workshop-step {
    grid-template-columns: 25px 1fr;
    gap: 10px;
    padding-block: 23px;
  }
  .workshop-step > .icon {
    display: none;
  }
  .workshop-step h3 {
    font-size: 17px;
  }
  .studio-faq {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .studio-signoff {
    align-items: start;
    flex-direction: column;
    gap: 18px;
  }
  .studio-signoff > span {
    font-size: 70px;
  }
  .studio-signoff p {
    font-size: 8px;
  }
  .cookie-banner {
    max-width: 330px;
  }
}
@media (max-width: 520px) {
  .wrap {
    width: calc(100% - 36px);
  }
  .brand {
    font-size: 15px;
    gap: 7px;
  }
  .brand img {
    width: 26px;
    height: 26px;
  }
  .header-inner {
    gap: 12px;
  }
  .header-tools {
    gap: 5px;
  }
  .header-tools > .btn {
    min-height: 34px;
    padding: 7px 9px;
    font-size: 10px;
  }
  .header-tools > .btn > .icon {
    display: none;
  }
  .language select {
    font-size: 9px;
    max-width: 57px;
  }
  .search-trigger {
    display: none;
  }
  .header-tools .icon-button {
    min-width: 28px;
    padding: 5px;
  }
  .menu-toggle {
    margin-left: 0;
  }
  .world-hero {
    height: 675px;
    min-height: 0;
  }
  .world-content {
    padding-top: 57px;
  }
  .world-kicker {
    font-size: 7px;
    letter-spacing: 1px;
    gap: 9px;
  }
  .world-content h1 {
    font-size: 76px;
    letter-spacing: -0.8px;
    margin-block: 30px 22px;
  }
  .world-content > p {
    font-size: 12px;
    max-width: 310px;
    line-height: 1.9;
  }
  .world-content > p br {
    display: none;
  }
  .world-content .actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 13px;
  }
  .hero-button {
    min-height: 46px;
    font-size: 11px;
  }
  .world-content .secondary {
    background: #1b1424d9;
  }
  .hero-footnote {
    font-size: 7px;
    max-width: 290px;
    line-height: 1.8;
    margin-top: 22px;
  }
  .world-caption {
    right: 18px;
    bottom: 23px;
    font-size: 7px;
  }
  .world-caption small {
    font-size: 7px;
  }
  .scroll-cue {
    left: 18px;
    bottom: 25px;
    font-size: 6px;
    gap: 9px;
  }
  .scroll-cue > span:last-child {
    font-size: 18px;
  }
  .world-image {
    object-position: 68% center;
  }
  .world-shade {
    background:
      linear-gradient(90deg, #0f0916f2, #140d1ba6 75%, #120b1b66),
      linear-gradient(0deg, #110f14, transparent 50%);
  }
  .compat-band .mono {
    font-size: 7px;
  }
  .platform-names > span {
    font-size: 12px;
  }
  .section-top h2,
  .studio-faq h2 {
    font-size: 32px;
    letter-spacing: -1.3px;
  }
  .eyebrow {
    font-size: 8px;
    letter-spacing: 1px;
    margin-bottom: 15px;
  }
  .section-top {
    margin-bottom: 27px;
  }
  .section {
    padding-block: 52px;
  }
  .path-card {
    display: block;
  }
  .path-visual {
    height: 200px;
    min-height: 0;
    border-right: 0;
  }
  .visual-tag {
    font-size: 7px;
    left: 20px;
    top: 18px;
  }
  .server-console {
    width: 75%;
    max-width: 250px;
  }
  .server-console code {
    font-size: 10px;
  }
  .path-copy {
    padding: 22px 22px 0;
  }
  .path-copy h3 {
    font-size: 21px;
  }
  .path-copy p {
    font-size: 12px;
  }
  .path-bottom {
    font-size: 11px;
    padding-block: 19px;
  }
  .workshop-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .workshop-intro h2 {
    font-size: 73px;
  }
  .workshop-intro h2 br:nth-of-type(2) {
    display: none;
  }
  .workshop-intro h2 em:before {
    content: " ";
  }
  .workshop-steps {
    padding-top: 0;
  }
  .workshop-step {
    padding-block: 23px;
    grid-template-columns: 30px 1fr;
  }
  .workshop-step h3 {
    font-size: 18px;
  }
  .project-receipt {
    font-size: 9px;
    padding: 13px;
  }
  .studio-faq summary {
    font-size: 11px;
    gap: 12px;
    padding-block: 21px;
  }
  .faq-answer p {
    font-size: 11px;
    padding-left: 23px;
  }
  .studio-signoff > span {
    font-size: 52px;
    letter-spacing: -1px;
  }
  .studio-signoff i {
    font-size: 9px;
  }
  .cookie-banner {
    max-width: none;
    left: 10px;
    right: 10px;
    bottom: 10px;
    padding: 17px;
  }
  .cookie-banner p {
    font-size: 10px;
  }
  .cookie-banner .actions {
    flex-wrap: nowrap;
  }
  .cookie-banner .btn {
    flex: 1;
  }
  .page-head h1 {
    font-size: 45px;
  }
  .toolbar {
    padding: 10px;
  }
  .command-search {
    min-width: 0;
    width: 100%;
  }
  .metric strong {
    font-size: 36px;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *:before,
  *:after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
  .reveal {
    opacity: 1;
    transform: none;
  }
}
#discover { scroll-margin-top: 100px; }

/* ErupsyStation — violet workshop. Original grids, geometry and sprite artwork. */
:root{--bg:#100d17;--surface:#1b1625;--green:#ba8afa;--purple:#a66aee;--muted:#afa7bf;--line:#cbb4ef19;color:#f4effb;background:#100d17}
body{background-color:#100d17;background-image:linear-gradient(90deg,transparent calc(50% - 641px),#ba8afa06 calc(50% - 640px),transparent calc(50% - 639px)),linear-gradient(90deg,transparent calc(50% + 639px),#ba8afa06 calc(50% + 640px),transparent calc(50% + 641px))}
#header{background:#100d17f2}.brand img{filter:none}.brand span span{color:#d5c8e9}.nav a{color:#b6adc6}.nav a:hover,.nav a.active{color:#f2eaff}
.btn{border-radius:8px;background:#241d31}.btn.primary{background:#a46aee;color:#fff;border-color:#c899ff;box-shadow:inset 0 1px #e7ccff55,0 3px 0 #613396,0 5px 22px #9451da12}.btn.primary:hover{background:#b37df4;box-shadow:inset 0 1px #efdcff80,0 3px 0 #613396,0 7px 24px #9451da30}.btn.primary:active{box-shadow:inset 0 1px #efdcff50,0 1px 0 #613396}.btn.secondary,.btn.ghost{background:#1c1726}.btn.secondary:hover{background:#30243f}.btn.purple{background:#563578;border-color:#8456ad}.cart-badge{color:#211333}.eyebrow{color:#b994e6}
.world-hero{height:auto!important;min-height:0;isolation:isolate;background:#100d17;overflow:hidden;border-bottom:0}
.station-blueprint{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(90deg,#ba8afa08 1px,transparent 1px),linear-gradient(#ba8afa08 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,transparent,#000 60%)}
.station-blueprint:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 76% 45%,#6e39832b,transparent 50%)}
.hero-layout{display:grid;grid-template-columns:1.03fr 1fr;gap:52px;align-items:center;padding-block:64px 52px}
.world-content{padding:0!important}.world-kicker{font-size:9px;color:#b9a5d2;letter-spacing:1.5px}.pixel-mark{transform:none;box-shadow:3px 3px 0 #73429a55;width:9px;height:9px}
.world-content h1{font-family:Manrope,system-ui,sans-serif;font-size:clamp(44px,4.55vw,68px);line-height:1.08;font-weight:800;text-transform:none;letter-spacing:-3.5px;margin:27px 0 24px;color:#f7f2fe;max-width:610px}.world-content h1 span{color:#bd8df8}.world-content>p{font-size:14px;line-height:1.85;color:#afa5be;max-width:430px}.world-content>p br{display:none}
.world-content .actions{flex-wrap:wrap;gap:12px}.hero-button{font-size:11px;padding-inline:17px;min-height:47px}.hero-footnote{font-size:9px;color:#a596b7;margin-top:27px}.status-dot{background:#bc8cf1;box-shadow:0 0 8px #b580e933}
.hero-baseline{border-top:1px solid #b799dc20;display:flex;justify-content:space-between;align-items:center;padding-block:20px;color:#796b8d;gap:16px}.hero-baseline .mono{font-size:8px;letter-spacing:1.1px}.hero-baseline a{font-size:10px;color:#d1bedf}
.station-lab{position:relative;border:1px solid #bc91ec33;border-radius:14px;background:linear-gradient(145deg,#22192ee6,#15111f);box-shadow:0 24px 80px #05020944,inset 0 1px #d8b8ff0f;min-width:0;overflow:hidden}
.lab-top{height:47px;border-bottom:1px solid #c4a0ee15;padding:0 20px;display:flex;align-items:center;justify-content:space-between;font:9px 'IBM Plex Mono',monospace;letter-spacing:1.2px;color:#c3abdd}.lab-top>span:first-child{display:flex;align-items:center;gap:10px}.lab-version{color:#756283}.lab-stage{position:relative;height:395px;background-image:radial-gradient(#bc92ed24 .7px,transparent .7px);background-size:18px 18px;overflow:hidden}.lab-stage canvas{position:relative;width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y;z-index:1}.lab-stage canvas:active{cursor:grabbing}.lab-stage canvas:focus-visible{outline:2px solid #c79aff;outline-offset:-4px}.lab-coordinate{position:absolute;top:21px;left:19px;color:#665575;font:8px/1.9 'IBM Plex Mono',monospace;letter-spacing:1px}.lab-orbit{position:absolute;left:13%;right:13%;height:32%;bottom:8%;border:1px solid #b288dd20;border-radius:50%;transform:rotate(-10deg);box-shadow:0 0 0 26px #b288dd04,0 0 0 27px #b288dd0c;background:radial-gradient(ellipse,#8b4ab721,transparent 65%)}.scene-reset{position:absolute;z-index:2;right:15px;bottom:16px;border:1px solid #b991e437;width:30px;height:30px;border-radius:6px;background:#21192f;color:#cda7fa;font-size:20px;cursor:pointer}.scene-reset:hover{background:#45305f}.lab-readout{display:flex;align-items:center;gap:13px;padding:16px 20px;border-top:1px solid #ba8afa15;background:#15111d80}.lab-cross{font:26px 'IBM Plex Mono';color:#a876d5}.lab-readout .mono{font-size:8px;color:#806c95;letter-spacing:1px}.lab-readout b{color:#d7b9f4;font-weight:500}.lab-readout small{display:block;font-size:9px;color:#93819e;margin-top:5px}.lab-cube{margin-left:auto;font-size:25px;color:#8057a6}.scene-modes{display:grid;grid-template-columns:repeat(3,1fr);padding:8px;gap:5px;border-top:1px solid #ba8afa15;background:#100d17}.scene-modes button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:37px;border:1px solid transparent;border-radius:6px;background:transparent;color:#a495b5;font:600 10px Manrope;cursor:pointer;transition:background .2s,color .2s,border-color .2s}.scene-modes button span{font:8px 'IBM Plex Mono';color:#745f8c}.scene-modes button:hover{background:#271d35;color:#e7d3ff}.scene-modes button[aria-pressed=true]{background:#30213f;border-color:#b885ee40;color:#e4c7ff}.scene-modes button[aria-pressed=true] span{color:#b787e9}
.compat-band{background:#15111d;border-block:1px solid #c4a0ee16}.compat-band>.wrap{min-height:75px}.platform-names>span{font-size:16px;font-weight:700;color:#ad9abd}.compat-band .mono{color:#7e6b90}.tiny-square{background:#58416d}
.discover-section{position:relative}.discover-section:before{content:"";position:absolute;left:-50px;top:58px;width:36px;height:36px;background:linear-gradient(#9d70c733 0 0) 0 0/12px 12px,linear-gradient(#9d70c719 0 0) 12px 12px/12px 12px,linear-gradient(#9d70c70c 0 0) 24px 24px/12px 12px;background-repeat:no-repeat;pointer-events:none}
.path-card{background:#1a1523;border:1px solid #c5a1ed22;border-radius:12px}.path-card:hover{border-color:#b98bee70;box-shadow:0 16px 42px #08040f66}.path-visual{height:225px;border-bottom:1px solid #c5a1ed18}.mod-visual,.custom-visual{background-color:#221a2f;background-image:linear-gradient(#bb95e80b 1px,transparent 1px),linear-gradient(90deg,#bb95e80b 1px,transparent 1px);background-size:24px 24px}.mod-visual:before{inset:30px 35px;border:1px dashed #bd99e42b;background:none;transform:none}.mod-visual:after{content:attr(data-art-caption);position:absolute;bottom:16px;left:20px;font:7px 'IBM Plex Mono';letter-spacing:1px;color:#9376ac}.pixel-pickaxe{width:144px;height:144px;transform:translate(12px,18px);filter:drop-shadow(5px 6px 0 #08051155)}.pixel-pickaxe img{width:144px;height:144px;image-rendering:pixelated}.path-card:hover .pixel-pickaxe{transform:translate(12px,12px)}.visual-coordinates{color:#775d8f;font-size:7px}.visual-tag{color:#ad90ca;font-size:8px;letter-spacing:1.2px}.plugin-visual{background:repeating-linear-gradient(0deg,#bc8af903 0 1px,transparent 1px 5px),#1c1728}.server-console{transform:translateY(13px);background:#120e1a;border-color:#aa7dc13d;box-shadow:7px 7px 0 #09060d44}.path-card:hover .server-console{transform:translateY(8px)}.server-console code b{color:#c493fa}.server-console em{color:#a27ec1}.server-console>div span{color:#9c82b0}.server-console i{background:#8f65b0}.pixel-workbench{width:160px;height:160px;filter:drop-shadow(6px 8px 0 #0c081255);transform:translateY(7px);transition:transform .3s}.pixel-workbench img{width:100%;height:100%;image-rendering:pixelated}.path-card:hover .pixel-workbench{transform:translateY(0)}.custom-visual{background-size:32px 32px;background-color:#261d2c}.craft-note{color:#af8abf;font-size:8px}.path-copy h3{font-weight:700;font-size:19px}.path-copy p{color:#a598b0;font-size:12px}.path-bottom{color:#d0afea}.path-index{color:#85629c}
.workshop-section{background-color:#1b1325;background-image:linear-gradient(90deg,#ae83d308 1px,transparent 1px),linear-gradient(#ae83d308 1px,transparent 1px);background-size:48px 48px;border-color:#b58ad429}.workshop-section:after{content:"E / S";font:700 240px Manrope;letter-spacing:-24px;transform:rotate(-90deg);left:auto;right:-110px;bottom:95px;color:#ba8afa05}.workshop-intro h2{font-family:Manrope;font-size:52px;text-transform:none;line-height:1.07;letter-spacing:-2.5px}.workshop-intro h2 em{color:#be8cf5}.workshop-step{border-color:#ba8afa26}.project-receipt{background:#281c37;border-color:#b884e72e}.studio-faq{position:relative}.studio-faq details{background:#1b1523;border:1px solid #b284db1f;border-radius:8px;margin-bottom:10px;padding-inline:20px}.studio-signoff>span{color:#342142}.studio-signoff>span>span{color:#64497b}.studio-signoff i{color:#b080d8}
.cookie-banner{background:#211a2a;border-color:#8f62b64d}.cookie-banner p{color:#b8a8c6}.section-aside{color:#a899b5}.world-content .secondary{background:#22192e}
@media(min-width:1600px){.hero-layout{padding-block:86px 68px}.lab-stage{height:430px}}
@media(max-width:1100px){.hero-layout{gap:28px}.world-content h1{font-size:52px;letter-spacing:-2.8px}.world-content .actions{flex-direction:column;align-items:flex-start}.lab-stage{height:360px}.hero-footnote{font-size:8px}.world-kicker{font-size:8px}.scene-modes button{font-size:9px;gap:5px}}
@media(max-width:800px){.hero-layout{grid-template-columns:1fr;gap:36px;padding-block:40px 30px}.hero-copy{max-width:560px}.world-content h1{font-size:58px;max-width:550px;margin-block:22px}.world-content .actions{flex-direction:row}.station-lab{max-width:560px;width:100%;justify-self:center}.lab-stage{height:380px}.hero-baseline>span:last-child{display:none}.world-content>p{font-size:13px;max-width:420px}.workshop-intro h2{font-size:43px}.path-visual{min-height:230px}.compat-band>.wrap{gap:14px}.nav{background:#1b1325}.lab-readout small{font-size:10px}.scene-modes button{font-size:11px}}
@media(max-width:520px){.world-content h1{font-size:44px;letter-spacing:-2px;line-height:1.12}.world-kicker{font-size:7px;gap:8px;letter-spacing:1px}.world-content .actions{gap:10px}.hero-button{font-size:10px;min-height:45px;padding:12px 14px}.hero-button .icon{width:15px}.hero-footnote{font-size:8px;margin-top:20px}.hero-layout{gap:30px;padding-block:34px 22px}.lab-stage{height:320px}.lab-top{padding-inline:15px;font-size:8px}.lab-readout{padding:13px 15px}.lab-readout small{font-size:8px}.scene-modes button{font-size:9px}.hero-baseline .mono{font-size:7px}.hero-baseline a{font-size:9px}.path-visual{height:225px;min-height:0}.workshop-intro h2{font-size:46px}.studio-signoff>span{font-size:53px}.cookie-banner{max-width:calc(100vw - 20px)}.platform-names>span{font-size:12px}}
@media(prefers-reduced-motion:reduce){.pixel-workbench,.pixel-pickaxe,.scene-modes button{transition:none}}
.station-blueprint:after{background:url('/station-lines.svg?v=purple-3') right center/640px 560px no-repeat,radial-gradient(ellipse at 76% 45%,#6e39832b,transparent 50%)}
.page-head{position:relative;isolation:isolate;padding:36px 40px;margin-bottom:32px;border:1px solid #bc8ded20;border-left:3px solid #9e66d8;border-radius:0 12px 12px 0;background:#191221;overflow:hidden}
.page-head:after{content:"";position:absolute;inset:0;z-index:-1;background:url('/station-lines.svg?v=purple-3') right center/440px auto no-repeat;pointer-events:none}
.page-head h1{max-width:800px}.page-head p{max-width:690px}.page-head .eyebrow{margin-bottom:14px}.workshop-section:before{content:"";position:absolute;inset:0;background:url('/station-lines.svg?v=purple-3') right center/720px auto no-repeat;opacity:.7;pointer-events:none}
@media(max-width:520px){.page-head{padding:26px 22px}.page-head:after{opacity:.35}.station-blueprint:after{background-size:640px 560px;background-position:70% 72%}}
.page-head h1{font-family:Manrope,system-ui,sans-serif;text-transform:none;letter-spacing:-2px;line-height:1.12;font-size:clamp(30px,4vw,52px)}
@media(max-width:800px){.toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.toolbar input[type=search]{grid-column:1/-1}.toolbar .field{width:100%;min-width:0}.toolbar select:last-child{grid-column:1/-1}}
@media(max-width:520px){.page-head h1{font-size:32px;letter-spacing:-1.3px}.toolbar select.field{font-size:12px;padding:12px 10px;min-height:44px}}
.delivery-choice{padding:0;border:0;margin:22px 0}.delivery-choice legend{font-size:16px;font-weight:750;margin-bottom:14px}.delivery-option{display:flex;gap:12px;padding:15px;border:1px solid #ad7be32e;border-radius:9px;margin-bottom:9px;background:#191321;cursor:pointer}.delivery-option:has(input:checked){background:#30203f;border-color:#b77eee}.delivery-option input{accent-color:#b680ee;margin-top:3px}.delivery-option strong{display:block;font-size:13px}.delivery-option small{display:block;font-size:11px;color:#b9a8cb;line-height:1.7;margin-top:5px}.guest-fields{display:grid;gap:14px;margin-bottom:20px}.guest-fields[hidden],.delivery-account-note[hidden]{display:none}.delivery-notice{font-size:11px;line-height:1.9;border-left:3px solid #b780ed;padding:15px}.delivery-release{display:flex;align-items:center;justify-content:space-between;gap:20px}.delivery-release h2{font-size:20px;margin-bottom:8px}@media(max-width:520px){.delivery-release{align-items:flex-start;flex-direction:column}.delivery-choice legend{font-size:15px}}

/* Matching two-pixel grids keep both item illustrations crisp at display size. */
.pixel-pickaxe,.pixel-pickaxe img{width:160px;height:160px}.pixel-pickaxe,.pixel-workbench{filter:drop-shadow(0 8px 12px #08051144)}
/* Platform identities remain in their original colors within the station palette. */
.compat-band{padding:26px 0;background:#15101d;border-block:1px solid #b188d423}
.compat-band>.wrap{display:grid;grid-template-columns:180px minmax(0,1fr);align-items:center;gap:32px}
.compat-intro>.mono{display:block;max-width:155px;font-size:9px;line-height:1.8;letter-spacing:1.6px;color:#b79acb}
.compat-intro>p{margin:7px 0 0;font-size:11px;color:#847291}
.compat-band .platform-names{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;width:100%}
.compat-band .platform-badge{display:flex;align-items:center;gap:12px;min-width:0;padding:14px 12px;background:#21172c;border:1px solid #b488d526;border-radius:12px;transition:background .2s,border-color .2s,transform .2s}
.compat-band .platform-badge:hover{background:#291c36;border-color:#b68add60;transform:translateY(-2px)}
.compat-band .platform-logo{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;background:#100c17;border:1px solid #b488d51c;border-radius:10px}
.compat-band .platform-logo img{display:block;width:30px;height:30px;object-fit:contain}
.compat-band .platform-spigot img{filter:invert(81%) sepia(45%) saturate(749%) hue-rotate(341deg) brightness(100%)}
.compat-band .platform-label{display:grid;gap:5px;min-width:0}.compat-band .platform-label strong{font-family:Manrope,sans-serif;font-size:14px;font-weight:650;letter-spacing:-.3px;color:#e6dced}.compat-band .platform-label small{font-size:10px;color:#a58db8;letter-spacing:.3px}
@media(max-width:1150px){.compat-band>.wrap{grid-template-columns:1fr;gap:18px}.compat-intro{display:flex;justify-content:space-between;align-items:center;gap:16px}.compat-intro>.mono{max-width:none}.compat-intro>p{margin:0}}
@media(max-width:650px){.compat-band{padding:22px 0}.compat-band .platform-names{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.compat-band .platform-badge{padding:12px}.compat-band .platform-badge:last-child{grid-column:1/-1}.compat-intro{display:block}.compat-intro>p{margin-top:5px}.compat-band .platform-label strong{font-size:13px}}
@media(prefers-reduced-motion:reduce){.compat-band .platform-badge{transition:none}.compat-band .platform-badge:hover{transform:none}}
/* High-resolution sprites retain their square proportions at every breakpoint. */
.path-visual{height:300px}
.pixel-pickaxe,.pixel-workbench{display:block;width:240px;height:240px;max-width:85%;aspect-ratio:1;transform:none;filter:none;transition:translate .25s ease}
.pixel-pickaxe img,.pixel-workbench img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto;transform:none}
.path-card:hover .pixel-pickaxe,.path-card:hover .pixel-workbench{transform:none;translate:0 -4px}
@media(prefers-reduced-motion:reduce){.pixel-pickaxe,.pixel-workbench{transition:none}.path-card:hover .pixel-pickaxe,.path-card:hover .pixel-workbench{translate:none}}