:root {
  color-scheme: dark;
  --bg: #070708;
  --bg-soft: #111214;
  --panel: #17181b;
  --panel-strong: #202126;
  --line: #30323a;
  --text: #f2f1eb;
  --muted: #b7b2a5;
  --muted-strong: #d8d2c3;
  --gold: #efbd4f;
  --gold-soft: #f4d37a;
  --green: #64d087;
  --blue: #79b8ff;
  --danger: #ff7d73;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
  --max: 1180px;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f6f2;
  --bg-soft: #ffffff;
  --panel: #f7f8f5;
  --panel-strong: #e9ece8;
  --line: #b9bdb4;
  --text: #111413;
  --muted: #62655e;
  --muted-strong: #2e332f;
  --gold: #c88713;
  --gold-soft: #835708;
  --green: #157847;
  --blue: #1f62b4;
  --danger: #a52a25;
  --shadow: 0 20px 60px rgba(26, 31, 32, 0.16);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  display: flex;
  flex-direction: column;
  margin: 0;
  min-height: 100vh;
  background:
    linear-gradient(180deg, rgba(239, 189, 79, 0.08), rgba(7, 7, 8, 0) 340px),
    radial-gradient(circle at 10% 0%, rgba(121, 184, 255, 0.12), transparent 34rem),
    var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
}

:root[data-theme="light"] body {
  background:
    linear-gradient(180deg, rgba(200, 135, 19, 0.14), rgba(244, 246, 242, 0) 340px),
    radial-gradient(circle at 10% 0%, rgba(31, 98, 180, 0.13), transparent 34rem),
    var(--bg);
}

a {
  color: inherit;
}

img {
  display: block;
  max-width: 100%;
}

.site-header,
main,
.site-footer {
  width: min(var(--max), calc(100% - 32px));
  margin: 0 auto;
}

main {
  flex: 1 0 auto;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 0 10px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.98rem;
  font-weight: 800;
  letter-spacing: 0;
  text-decoration: none;
}

.brand img {
  width: 54px;
  height: 54px;
  object-fit: contain;
}

.nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.nav-tools {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-height: 72px;
  padding-right: 72px;
}

.nav-links a,
.text-link {
  border: 1px solid transparent;
  color: var(--muted-strong);
  font-size: 0.93rem;
  font-weight: 700;
  text-decoration: none;
  padding: 9px 12px;
}

.nav-links a:hover,
.text-link:hover {
  border-color: var(--line);
  background: rgba(255, 255, 255, 0.05);
}

/* Optional navigation treatment: calm line icons keep the text labels unmistakable. */
.nav-links .nav-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding-inline: 8px;
}

.nav-links .nav-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  fill: none;
  stroke: color-mix(in srgb, var(--green) 66%, var(--muted-strong));
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .72;
  transition: color .18s ease, opacity .18s ease, transform .18s ease;
}

.nav-links .nav-link:hover .nav-icon,
.nav-links .nav-link[aria-current="page"] .nav-icon {
  color: var(--gold-soft);
  stroke: currentColor;
  opacity: 1;
  transform: translateY(-1px);
}

.nav-links .nav-link[aria-current="page"]::after {
  position: absolute;
  right: 8px;
  bottom: 3px;
  left: 27px;
  height: 2px;
  content: "";
  background: linear-gradient(90deg, var(--gold-soft), var(--green));
}

:root[data-theme="dark"] .nav-links .nav-icon {
  stroke: color-mix(in srgb, #a7e6bb 70%, #efbd4f);
}

/* Wide screens: keep the full navigation in one composed row beside the tools. */
@media (min-width: 1180px) {
  .topbar {
    gap: 10px;
    justify-content: flex-start;
  }

  .nav-tools {
    gap: 7px;
    margin-left: 28px;
    padding-right: 58px;
  }

  .nav-links {
    flex-wrap: nowrap;
    gap: 3px;
  }

  .nav-links .nav-link {
    gap: 4px;
    padding-inline: 5px;
  }
}

.language-select {
  position: relative;
  display: block;
  width: 58px;
  min-width: 58px;
  height: 112px;
  cursor: pointer;
  margin-top: -22px;
}

.language-select select {
  position: absolute;
  top: 30px;
  right: 0;
  z-index: 2;
  width: 92px;
  min-height: 38px;
  border-color: rgba(239, 189, 79, 0.55);
  background: rgba(17, 18, 20, 0.88);
  color: var(--gold-soft);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.86rem;
  font-weight: 800;
  padding: 8px 10px;
}

.language-flag-select select {
  width: 1px;
  height: 1px;
  min-height: 0;
  border: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  clip-path: inset(50%);
}

.language-flag-rig {
  position: absolute;
  inset: 0;
  pointer-events: none;
  transform-origin: 50% 0;
  animation: language-flag-swing 5.1s ease-in-out infinite;
}

.language-flag-cord {
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 48px;
  background:
    repeating-linear-gradient(180deg, rgba(112, 87, 45, 0.92) 0 5px, rgba(53, 44, 34, 0.92) 5px 8px);
  transform: translateX(-50%);
}

.language-flag-pin {
  position: absolute;
  top: 42px;
  left: 50%;
  width: 10px;
  height: 10px;
  border: 1px solid rgba(102, 75, 32, 0.68);
  border-radius: 50%;
  background: #f5d58b;
  transform: translateX(-50%);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.18);
}

.language-flag-crossbar {
  position: absolute;
  top: 52px;
  left: 50%;
  width: 46px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, #7b5415, #f2cd72 45%, #7b5415);
  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.22),
    0 0 0 1px rgba(77, 48, 8, 0.28);
  transform: translateX(-50%);
}

.language-flag-cloth {
  position: absolute;
  top: 55px;
  left: 50%;
  width: 44px;
  height: 54px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.44);
  border-radius: 2px 7px 7px 2px;
  clip-path: polygon(0 0, 96% 0, 100% 18%, 94% 36%, 100% 55%, 94% 76%, 98% 100%, 0 100%);
  box-shadow:
    0 13px 28px rgba(0, 0, 0, 0.24),
    inset 0 0 14px rgba(0, 0, 0, 0.2);
  transform-origin: 50% 0;
  animation: language-flag-wave 2.25s ease-in-out infinite;
}

.language-flag-cloth::before,
.language-flag-cloth::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.language-flag-cloth::before {
  top: 0;
  left: 0;
  width: 42%;
  height: 54%;
  background:
    radial-gradient(circle, rgba(255, 255, 255, 0.92) 0 1px, transparent 1.2px) 2px 2px / 7px 6px,
    #3c3b6e;
  opacity: 0;
}

.language-flag-cloth::after {
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.22), transparent 22%, rgba(0, 0, 0, 0.15) 50%, transparent 76%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0 1px, transparent 1px 10px);
  mix-blend-mode: soft-light;
}

.language-flag-select[data-language-flag="de"] .language-flag-cloth {
  background: linear-gradient(90deg, #101010 0 33.33%, #dd0000 33.33% 66.66%, #ffce00 66.66% 100%);
}

.language-flag-select[data-language-flag="en"] .language-flag-cloth {
  background: repeating-linear-gradient(180deg, #b22234 0 4.15px, #ffffff 4.15px 8.3px);
}

.language-flag-select[data-language-flag="en"] .language-flag-cloth::before {
  opacity: 1;
}

.language-flag-select:focus-visible {
  outline: none;
}

.language-flag-select:hover .language-flag-cloth,
.language-flag-select:focus-visible .language-flag-cloth,
.language-flag-select:focus-within .language-flag-cloth {
  filter: saturate(1.1) brightness(1.06);
  box-shadow:
    0 16px 32px rgba(0, 0, 0, 0.28),
    inset 0 0 14px rgba(0, 0, 0, 0.17);
}

.theme-toggle {
  position: absolute;
  top: -22px;
  right: 0;
  display: block;
  width: 58px;
  height: 112px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  padding: 0;
  z-index: 3;
}

.theme-lamp-rig {
  position: absolute;
  inset: 0;
  transform-origin: 50% 0;
}

.theme-lamp-cord {
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 56px;
  background:
    repeating-linear-gradient(180deg, rgba(112, 87, 45, 0.95) 0 5px, rgba(53, 44, 34, 0.95) 5px 8px);
  transform: translateX(-50%);
}

.theme-lamp-shade {
  position: absolute;
  top: 48px;
  left: 50%;
  width: 48px;
  height: 30px;
  border: 1px solid rgba(102, 75, 32, 0.55);
  background:
    linear-gradient(180deg, #e6c072, #b47d1b 72%, #6f4710);
  clip-path: polygon(22% 0, 78% 0, 100% 100%, 0 100%);
  transform: translateX(-50%);
  box-shadow: inset 0 -8px 12px rgba(36, 25, 9, 0.24);
}

.theme-lamp-bulb {
  position: absolute;
  top: 72px;
  left: 50%;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ffe7a2;
  transform: translateX(-50%);
  box-shadow:
    0 0 14px rgba(255, 210, 97, 0.76),
    0 0 34px rgba(255, 210, 97, 0.42);
}

.theme-lamp-glow {
  position: absolute;
  top: 70px;
  left: 50%;
  width: 92px;
  height: 78px;
  background: radial-gradient(ellipse at 50% 0%, rgba(255, 219, 129, 0.42), rgba(255, 219, 129, 0.12) 42%, transparent 72%);
  opacity: 0.72;
  transform: translateX(-50%);
  pointer-events: none;
}

.theme-lamp-pull {
  position: absolute;
  top: 80px;
  left: calc(50% + 22px);
  width: 1px;
  height: 24px;
  background: rgba(102, 75, 32, 0.72);
}

.theme-lamp-pull::after {
  content: "";
  position: absolute;
  right: -4px;
  bottom: -8px;
  width: 9px;
  height: 9px;
  border: 1px solid rgba(102, 75, 32, 0.66);
  border-radius: 50%;
  background: #f5d58b;
}

.theme-toggle .theme-lamp-rig {
  animation: theme-lamp-swing 5.6s ease-in-out infinite;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
  outline: none;
}

.theme-toggle:hover .theme-lamp-shade,
.theme-toggle:focus-visible .theme-lamp-shade {
  filter: brightness(1.08);
}

.theme-toggle:focus-visible .theme-lamp-rig {
  outline: 2px solid var(--blue);
  outline-offset: 4px;
}

.theme-toggle-pulled .theme-lamp-rig {
  animation: theme-lamp-pull 460ms ease-out;
}

:root[data-theme="dark"] .theme-lamp-shade {
  border-color: rgba(239, 189, 79, 0.34);
  background:
    linear-gradient(180deg, #3a3229, #181512 72%, #080808);
}

:root[data-theme="dark"] .theme-lamp-bulb {
  background: #5a554b;
  box-shadow: 0 0 6px rgba(239, 189, 79, 0.16);
}

:root[data-theme="dark"] .theme-lamp-glow {
  opacity: 0.06;
}

:root[data-theme="dark"] .theme-lamp-pull,
:root[data-theme="dark"] .theme-lamp-pull::after {
  border-color: rgba(239, 189, 79, 0.28);
  background-color: rgba(239, 189, 79, 0.34);
}

@keyframes theme-lamp-swing {
  0%,
  100% {
    transform: rotate(-2.2deg);
  }

  50% {
    transform: rotate(2deg);
  }
}

@keyframes theme-lamp-pull {
  0% {
    transform: translateY(0) rotate(0deg);
  }

  38% {
    transform: translateY(8px) rotate(-3deg);
  }

  100% {
    transform: translateY(0) rotate(0deg);
  }
}

@keyframes language-flag-swing {
  0%,
  100% {
    transform: rotate(1.4deg);
  }

  50% {
    transform: rotate(-1.8deg);
  }
}

@keyframes language-flag-wave {
  0%,
  100% {
    transform: translateX(-50%) skewY(-1.4deg) scaleX(1);
  }

  50% {
    transform: translateX(-50%) skewY(2.2deg) scaleX(0.96);
  }
}

:root[data-theme="light"] .language-select select {
  background:
    repeating-linear-gradient(180deg, rgba(200, 135, 19, 0.08) 0, rgba(200, 135, 19, 0.08) 1px, transparent 1px, transparent 5px),
    rgba(255, 255, 255, 0.92);
}

:root[data-theme="dark"] .language-flag-cord {
  background:
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.46) 0 5px, rgba(50, 40, 24, 0.92) 5px 8px);
}

:root[data-theme="dark"] .language-flag-crossbar {
  background: linear-gradient(90deg, #3c2a11, #9d772d 45%, #3c2a11);
  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.28),
    0 0 0 1px rgba(239, 189, 79, 0.2);
}

:root[data-theme="dark"] .language-flag-pin {
  border-color: rgba(239, 189, 79, 0.42);
  background: #2c2417;
}

:root[data-theme="light"] .theme-toggle {
  background: transparent;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
  gap: 28px;
  align-items: end;
  min-height: clamp(380px, 58vh, 580px);
  padding: 34px 0 42px;
}

.hero-copy {
  max-width: 760px;
}

.eyebrow {
  margin: 0 0 12px;
  color: var(--gold-soft);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  overflow-wrap: anywhere;
}

h1 {
  margin: 0;
  max-width: 980px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: clamp(3.2rem, 9vw, 7.6rem);
  line-height: 0.9;
  letter-spacing: 0;
  text-transform: uppercase;
  text-shadow: 0 0 18px rgba(239, 189, 79, 0.16);
}

.hero-art {
  position: relative;
  display: grid;
  min-height: clamp(270px, 27vw, 360px);
  margin-top: 4px;
  overflow: hidden;
  align-items: end;
  border: 1px solid rgba(239, 189, 79, 0.36);
  background:
    linear-gradient(90deg, rgba(7, 7, 8, 0.16), rgba(7, 7, 8, 0.12) 44%, rgba(7, 7, 8, 0.9) 78%),
    var(--hero-dark, url("hero-reversing-anime-v1.jpg")) center / cover no-repeat;
  box-shadow: var(--shadow);
}

.hero-art::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.055) 0, rgba(255, 255, 255, 0.055) 1px, transparent 1px, transparent 6px),
    radial-gradient(circle at 76% 42%, rgba(121, 184, 255, 0.16), transparent 28%),
    linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.35));
  mix-blend-mode: screen;
  opacity: 0.58;
  pointer-events: none;
}

.hero-art::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 240, 168, 0.16);
  pointer-events: none;
}

.bmc-widget-dock {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 70px;
  border: 1px solid rgba(255, 221, 0, 0.44);
  background: rgba(7, 7, 8, 0.78);
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.42), inset 0 0 26px rgba(95, 127, 255, 0.1);
  padding: 7px 8px;
  backdrop-filter: blur(4px);
}

.bmc-widget-dock::before {
  content: "DONATE";
  color: #ffdd00;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0;
  text-shadow: 0 0 8px rgba(255, 221, 0, 0.34);
  writing-mode: vertical-rl;
}

.bmc-support-button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  padding: 0;
  border: 1px solid rgba(239, 189, 79, .7);
  background:
    repeating-linear-gradient(180deg, rgba(255, 255, 255, .035) 0, rgba(255, 255, 255, .035) 1px, transparent 1px, transparent 6px),
    linear-gradient(145deg, #161816, #090a0b);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .05), 0 10px 22px rgba(0, 0, 0, .36);
  color: var(--gold-soft);
  cursor: pointer;
  text-decoration: none;
  transition: border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.bmc-support-button::after {
  content: "";
  position: absolute;
  inset: 4px;
  border: 1px solid rgba(239, 189, 79, .14);
  pointer-events: none;
}

.bmc-support-button:hover,
.bmc-support-button:focus-visible {
  border-color: var(--green);
  box-shadow: inset 0 0 0 1px rgba(100, 208, 135, .1), 0 12px 25px rgba(0, 0, 0, .42);
  color: var(--green);
  transform: translateY(-2px);
}

.bmc-support-button:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}

.bmc-support-button svg {
  width: 31px;
  height: 31px;
  fill: currentColor;
}

.bmc-support-button .bmc-support-steam {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 1.8;
}

body.bmc-modal-open {
  overflow: hidden;
}

.bmc-support-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  padding: 24px;
  background: rgba(4, 5, 6, .76);
  backdrop-filter: blur(5px);
  place-items: center;
}

.bmc-support-modal[hidden] {
  display: none;
}

.bmc-support-dialog {
  position: relative;
  width: min(420px, calc(100vw - 32px));
  height: min(700px, calc(100dvh - 48px));
  min-height: 520px;
  border: 1px solid rgba(239, 189, 79, .6);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .58);
  overflow: hidden;
}

.bmc-support-dialog iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff url("https://cdn.buymeacoffee.com/assets/img/widget/loader.svg") center / 58px no-repeat;
}

.bmc-support-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  display: grid;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(20, 22, 24, .18);
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .12);
  color: #222;
  cursor: pointer;
  font: 700 1.55rem/1 Arial, sans-serif;
  place-items: center;
}

.bmc-support-close:hover,
.bmc-support-close:focus-visible {
  border-color: #ff813f;
  color: #b74a16;
}

.bmc-support-close:focus-visible {
  outline: 2px solid #ff813f;
  outline-offset: 2px;
}

@media (max-width: 479px) {
  .bmc-support-modal {
    padding: 0;
  }

  .bmc-support-dialog {
    width: 100vw;
    height: 100dvh;
    min-height: 0;
    border: 0;
    border-radius: 0;
  }
}

.hero-brand-card {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 16px;
  width: min(520px, calc(100% - 32px));
  margin: 16px;
  margin-left: auto;
  border: 1px solid rgba(239, 189, 79, 0.44);
  background: rgba(7, 7, 8, 0.76);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45), inset 0 0 28px rgba(121, 184, 255, 0.07);
  padding: 16px;
  backdrop-filter: blur(4px);
}

.hero-brand-card img {
  width: 74px;
  height: 74px;
  object-fit: contain;
}

.hero-brand-title,
.hero-brand-subtitle,
.hero-brand-line {
  display: block;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  letter-spacing: 0;
}

.hero-brand-title {
  color: var(--text);
  font-size: clamp(2.1rem, 5vw, 4.5rem);
  font-weight: 900;
  line-height: 0.9;
  text-shadow: 0 0 14px rgba(242, 241, 235, 0.28), 0 0 34px rgba(121, 184, 255, 0.2);
}

.hero-brand-subtitle {
  margin-top: 4px;
  color: var(--gold);
  font-size: clamp(1.4rem, 3.7vw, 3rem);
  font-weight: 900;
  line-height: 1;
}

.hero-brand-line {
  margin-top: 10px;
  color: var(--muted-strong);
  font-size: clamp(0.68rem, 1.2vw, 0.9rem);
  font-weight: 800;
}

.lede {
  max-width: 720px;
  margin: 22px 0 0;
  color: var(--muted-strong);
  font-size: clamp(1.03rem, 2vw, 1.3rem);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.hero-side {
  display: grid;
  align-self: end;
  gap: 18px;
  min-width: 0;
}

.hub-dosi-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 9px;
  min-height: 226px;
  overflow: visible;
  padding: 0;
}

.hub-dosi-card::before {
  content: none;
}

.hero-side .hub-dosi-card .hub-dosi-quote {
  order: 2;
  display: block;
  width: min(100%, 370px);
  position: relative;
  z-index: 2;
  margin: 0 auto;
  border: 0;
  background: none;
  box-shadow: none;
  color: var(--muted-strong);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(0.68rem, 0.82vw, 0.78rem);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.015em;
  text-align: center;
  text-wrap: balance;
  padding: 0 10px;
}

.hero-side .hub-dosi-card .hub-dosi-quote::before,
.hero-side .hub-dosi-card .hub-dosi-quote::after {
  color: var(--gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.15em;
  font-weight: 700;
  line-height: 0;
  opacity: 0.9;
}

.hero-side .hub-dosi-card .hub-dosi-quote::before {
  content: "“";
  margin-right: 0.18em;
}

.hero-side .hub-dosi-card .hub-dosi-quote::after {
  content: "”";
  margin-left: 0.18em;
}

.hub-dosi-source {
  order: 3;
  width: min(100%, 370px);
  margin: -5px auto 0;
  color: var(--green);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.58rem;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0.1em;
  text-align: center;
  text-shadow: 0 0 10px rgba(100, 208, 135, 0.18);
}

.hub-dosi-source::before,
.hub-dosi-source::after {
  color: var(--gold);
  opacity: 0.9;
}

.hub-dosi-source::before {
  content: "[ ";
}

.hub-dosi-source::after {
  content: " ]";
}

.blog-comments {
  max-width: 780px;
  margin: 54px auto 0;
  padding-top: 34px;
  border-top: 1px solid var(--line);
}

.blog-comments-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
}

.blog-comments-head h2 {
  margin: 4px 0 0;
  font-size: clamp(1.65rem, 3.6vw, 2.55rem);
}

.blog-comments-count {
  flex: 0 0 auto;
  border: 1px solid rgba(100, 208, 135, 0.36);
  color: var(--green);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  padding: 7px 9px;
  text-transform: uppercase;
}

.blog-comments-intro {
  max-width: 690px;
  margin: 15px 0 22px;
  color: var(--muted-strong);
  line-height: 1.65;
}

.blog-comment-form {
  position: relative;
  display: grid;
  gap: 16px;
  border: 1px solid var(--line);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.025) 0, rgba(100, 208, 135, 0.025) 1px, transparent 1px, transparent 7px),
    var(--bg-soft);
  padding: clamp(18px, 3.5vw, 28px);
}

.blog-comment-form::before {
  content: "C:\\DOSGAME\\BLOG> COMMENT";
  color: var(--green);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.blog-comment-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.blog-comment-fields label,
.blog-comment-message {
  display: grid;
  gap: 7px;
  color: var(--muted-strong);
  font-size: 0.78rem;
  font-weight: 800;
}

.blog-comment-fields input,
.blog-comment-message textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 0;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  font-size: 1rem;
  font-weight: 500;
  padding: 12px 13px;
}

.blog-comment-message textarea {
  min-height: 138px;
  line-height: 1.55;
  resize: vertical;
}

.blog-comment-fields input:focus,
.blog-comment-message textarea:focus {
  border-color: var(--green);
  outline: 2px solid rgba(100, 208, 135, 0.14);
  outline-offset: 1px;
}

.blog-comment-fields small {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 500;
}

.blog-comment-privacy {
  margin: 0;
}

.blog-comment-list {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.blog-comment-thread {
  display: grid;
  gap: 10px;
}

.blog-comment {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 15px;
  border: 1px solid var(--line);
  background: var(--panel);
  padding: 16px;
}

.blog-comment-avatar {
  width: 56px;
  height: 56px;
  border: 1px solid rgba(239, 189, 79, 0.52);
  border-radius: 50%;
  background: #0b0d0c;
  object-fit: cover;
  box-shadow: 0 0 0 3px rgba(100, 208, 135, 0.07);
}

.blog-comment-body {
  min-width: 0;
}

.blog-comment-body header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px dashed rgba(100, 208, 135, 0.22);
}

.blog-comment-body strong {
  color: var(--green);
  overflow-wrap: anywhere;
}

.blog-comment-body time {
  flex: 0 0 auto;
  color: var(--muted);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.62rem;
}

.blog-comment-body p {
  margin: 10px 0 0;
  color: var(--text);
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.blog-comment-official {
  position: relative;
  margin-left: 70px;
  border-color: rgba(239, 189, 79, 0.48);
  background:
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.025) 0, rgba(239, 189, 79, 0.025) 1px, transparent 1px, transparent 7px),
    var(--bg-soft);
}

.blog-comment-official::before {
  position: absolute;
  top: -11px;
  left: 26px;
  width: 1px;
  height: 11px;
  background: rgba(239, 189, 79, 0.48);
  content: "";
}

.blog-comment-official-avatar {
  background: #f1ead8;
  padding: 5px;
}

.blog-comment-official .blog-comment-body strong {
  color: var(--gold);
}

.blog-comment-official .blog-comment-body strong span {
  display: inline-block;
  margin-left: 7px;
  border: 1px solid rgba(239, 189, 79, 0.42);
  color: var(--muted-strong);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.56rem;
  letter-spacing: 0.06em;
  padding: 3px 5px;
  vertical-align: 2px;
}

@media (max-width: 620px) {
  .blog-comments-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .blog-comment-fields {
    grid-template-columns: 1fr;
  }

  .blog-comment {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 11px;
    padding: 13px;
  }

  .blog-comment-avatar {
    width: 44px;
    height: 44px;
  }

  .blog-comment-official {
    margin-left: 28px;
  }

  .blog-comment-official::before {
    left: 20px;
  }

  .blog-comment-body header {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }
}

.hub-dosi-stage {
  order: 1;
  position: relative;
  z-index: 1;
  width: 220px;
  min-height: 184px;
  overflow: visible;
}

.hub-dosi-image {
  position: absolute;
  bottom: -2px;
  left: 50%;
  width: 176px;
  max-width: none;
  height: auto;
  pointer-events: none;
  transform: translateX(-50%);
  transform-origin: 50% 86%;
  filter:
    drop-shadow(0 14px 20px rgba(0, 0, 0, 0.28))
    drop-shadow(0 0 14px rgba(100, 208, 135, 0.18));
  transition: opacity 240ms ease, transform 240ms ease, filter 240ms ease;
}

.hub-dosi-dark-hole {
  position: absolute;
  left: 50%;
  bottom: 24px;
  width: 228px;
  aspect-ratio: 520 / 227;
  max-width: none;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%);
  transition: opacity 260ms ease, filter 260ms ease;
  filter:
    drop-shadow(0 14px 20px rgba(0, 0, 0, 0.36))
    drop-shadow(0 0 18px rgba(117, 255, 220, 0.14));
}

.hub-dosi-dark-hole picture {
  display: block;
}

.hub-dosi-dark-hole img {
  display: block;
  width: 100%;
  height: auto;
}

.hub-dosi-eyelid {
  position: absolute;
  top: 43.6%;
  width: 8.7%;
  height: 19.8%;
  border-radius: 50%;
  background:
    linear-gradient(
      to bottom,
      #010707 0,
      #010707 calc(50% - 1px),
      rgba(76, 246, 234, 0.72) 50%,
      #010707 calc(50% + 1px),
      #010707 100%
    );
  box-shadow:
    inset 0 0 5px rgba(0, 10, 12, 0.92),
    0 0 4px rgba(76, 246, 234, 0.18);
  opacity: 0;
  transform: scaleY(0);
  transform-origin: 50% 50%;
}

.hub-dosi-eyelid-left {
  left: 37.1%;
}

.hub-dosi-eyelid-right {
  left: 54.6%;
}

:root[data-theme="dark"] .hub-dosi-image {
  opacity: 0;
  transform: translateX(-50%) translateY(10px) scale(0.94);
  filter: none;
}

:root[data-theme="dark"] .hub-dosi-dark-hole {
  opacity: 1;
  transform: translateX(-50%);
}

:root[data-theme="dark"] .hub-dosi-eyelid {
  animation: dosi-eye-blink 8.4s ease-in-out infinite;
}

@keyframes dosi-eye-blink {
  0%,
  41.8%,
  44.7%,
  47.2%,
  77.4%,
  80.2%,
  100% {
    opacity: 0;
    transform: scaleY(0);
  }
  42.9%,
  43.6%,
  45.7%,
  46.2%,
  78.5%,
  79.1% {
    opacity: 1;
    transform: scaleY(1);
  }
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border: 1px solid var(--line);
  color: var(--text);
  font-weight: 800;
  text-decoration: none;
  padding: 11px 16px;
}

.button-primary {
  border-color: rgba(239, 189, 79, 0.85);
  background: var(--gold);
  color: #14100a;
}

.button-primary:hover {
  background: var(--gold-soft);
}

.button-ghost:hover {
  border-color: rgba(239, 189, 79, 0.6);
  background: rgba(239, 189, 79, 0.08);
}

.hero-social-links {
  display: flex;
  align-items: center;
  gap: 8px;
}

.release-entry-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  border: 1px solid rgba(239, 189, 79, 0.62);
  background: rgba(31, 24, 10, 0.76);
  box-shadow: inset 3px 0 0 var(--gold);
  color: var(--gold-soft);
  font-size: 0.88rem;
  font-weight: 900;
  padding: 9px 13px 9px 11px;
  text-decoration: none;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.release-entry-icon {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
}

.release-entry-icon svg {
  width: 21px;
  height: 21px;
  fill: currentColor;
}

.release-entry-arrow {
  color: var(--green);
  font-size: 1.05rem;
  transition: transform 160ms ease;
}

.release-entry-button:hover,
.release-entry-button:focus-visible {
  transform: translateY(-2px);
  border-color: var(--gold);
  background: rgba(48, 36, 12, 0.94);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22), inset 3px 0 0 var(--gold);
  color: #fff0bd;
  outline: none;
}

.release-entry-button:hover .release-entry-arrow,
.release-entry-button:focus-visible .release-entry-arrow { transform: translateY(3px); }

.social-logo {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(8, 10, 13, 0.72);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
  text-decoration: none;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.social-logo svg {
  width: 23px;
  height: 23px;
  transition: transform 160ms ease, filter 160ms ease;
}

.social-logo-youtube svg { fill: #ff3155; }
.social-logo-facebook svg { fill: #3f8cff; }
.social-logo-x svg { fill: #d7e0dc; }

.social-logo:hover,
.social-logo:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(239, 189, 79, 0.58);
  background: rgba(18, 21, 26, 0.96);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.24), inset 0 -2px 0 rgba(239, 189, 79, 0.42);
  outline: none;
}

.social-logo:hover svg,
.social-logo:focus-visible svg { transform: scale(1.07); filter: saturate(1.2) brightness(1.08); }

.hero-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(100, 208, 135, 0.46);
  background:
    linear-gradient(180deg, rgba(7, 16, 10, 0.98), rgba(3, 6, 4, 0.98));
  box-shadow:
    inset 0 0 0 1px rgba(100, 208, 135, 0.1),
    inset 0 0 32px rgba(100, 208, 135, 0.08),
    var(--shadow);
  padding: 42px 22px 22px;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
}

.hero-panel::before {
  content: "C:\\DOSGAME\\ARCHIVE> STATUS";
  position: absolute;
  top: 14px;
  right: 20px;
  left: 20px;
  z-index: 1;
  overflow: hidden;
  color: rgba(100, 208, 135, 0.82);
  font-size: 0.72rem;
  line-height: 1;
  text-overflow: ellipsis;
  text-shadow: 0 0 8px rgba(100, 208, 135, 0.34);
  white-space: nowrap;
}

.hero-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: repeating-linear-gradient(
    180deg,
    rgba(100, 208, 135, 0.09) 0,
    rgba(100, 208, 135, 0.09) 1px,
    transparent 1px,
    transparent 4px
  );
  opacity: 0.25;
  pointer-events: none;
}

.hero-panel > * {
  position: relative;
  z-index: 1;
}

.about-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 520px);
  grid-template-areas:
    "eyebrow art"
    "lede art";
  gap: 14px 34px;
  align-items: center;
  padding: 42px 0 28px;
}

.about-hero > .eyebrow {
  grid-area: eyebrow;
  margin-bottom: 0;
}

.about-hero h1 {
  margin: 0;
  max-width: 980px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: clamp(3rem, 9vw, 7rem);
  line-height: 0.9;
  text-transform: uppercase;
  text-shadow: 0 0 18px rgba(239, 189, 79, 0.16);
}

.about-art {
  grid-area: art;
  position: relative;
  justify-self: end;
  width: min(100%, 520px);
  height: 320px;
  overflow: hidden;
  aspect-ratio: auto;
  min-height: 0;
  border: 1px solid rgba(239, 189, 79, 0.42);
  background:
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.045) 0, rgba(239, 189, 79, 0.045) 1px, transparent 1px, transparent 7px),
    #08090a;
  box-shadow: 0 22px 64px rgba(0, 0, 0, 0.42), inset 0 0 28px rgba(121, 184, 255, 0.06);
}

.about-art::before {
  content: "";
  position: absolute;
  inset: 10px;
  z-index: 2;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.045) 0, rgba(255, 255, 255, 0.045) 1px, transparent 1px, transparent 6px),
    linear-gradient(90deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.28) 72%, rgba(0, 0, 0, 0.55));
  pointer-events: none;
}

.about-art::after {
  content: "";
  position: absolute;
  inset: 10px;
  z-index: 2;
  border: 1px solid rgba(255, 240, 168, 0.16);
  pointer-events: none;
}

.about-art-label {
  position: absolute;
  right: 22px;
  bottom: 22px;
  z-index: 3;
  border: 1px solid rgba(239, 189, 79, 0.48);
  background: rgba(7, 7, 8, 0.72);
  color: var(--gold-soft);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 800;
  padding: 8px 10px;
}

.about-art-image {
  position: absolute;
  inset: 10px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  object-fit: cover;
  object-position: 39% center;
}

.about-art-image-light {
  display: none;
}

.about-lede {
  grid-area: lede;
  max-width: 760px;
  margin: 0;
  color: var(--muted-strong);
  font-size: clamp(1.05rem, 2vw, 1.32rem);
}

.about-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  padding: 20px 0 72px;
}

.about-panel {
  border: 1px solid var(--line);
  background:
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.035) 0, rgba(239, 189, 79, 0.035) 1px, transparent 1px, transparent 6px),
    var(--panel);
  padding: 24px;
}

.about-panel-wide {
  grid-column: 1 / -1;
  border-color: rgba(239, 189, 79, 0.42);
}

.about-panel h2 {
  margin: 8px 0 14px;
  font-size: clamp(1.55rem, 3vw, 2.45rem);
  line-height: 1;
}

.about-panel p {
  margin: 0;
  color: var(--muted-strong);
}

.about-panel p + p {
  margin-top: 14px;
}

.release-index-hero,
.release-detail {
  padding: 58px 0 30px;
}

.release-index-hero h1 {
  margin: 0;
  max-width: 980px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: clamp(2.7rem, 8vw, 6.8rem);
  line-height: 0.9;
  text-transform: uppercase;
}

.release-detail h1 {
  margin: 0;
  max-width: 900px;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(1.85rem, 4vw, 3.35rem);
  line-height: 1.04;
  overflow-wrap: anywhere;
  text-transform: none;
}

.release-index-hero p:not(.eyebrow),
.release-description p {
  max-width: 780px;
  color: var(--muted-strong);
  font-size: clamp(1rem, 1.8vw, 1.24rem);
}

.release-description {
  display: grid;
  gap: 0.9rem;
}

.release-description p {
  margin: 0;
}

.release-feature-box {
  max-width: 820px;
  border: 1px solid rgba(239, 189, 79, 0.42);
  background:
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.035) 0, rgba(239, 189, 79, 0.035) 1px, transparent 1px, transparent 6px),
    linear-gradient(135deg, rgba(239, 189, 79, 0.09), rgba(100, 208, 135, 0.055) 58%, rgba(5, 7, 8, 0.92)),
    var(--panel);
  box-shadow: inset 0 0 24px rgba(239, 189, 79, 0.045);
  margin-top: 20px;
  padding: 16px 18px;
}

.release-feature-box .mini-label {
  display: block;
  margin-top: 0;
  color: var(--green);
}

.release-feature-box h2 {
  margin: 8px 0 8px;
  color: var(--text);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  line-height: 1.15;
  text-transform: uppercase;
}

.release-feature-box p {
  margin: 0;
  color: var(--muted-strong);
  font-size: 0.96rem;
  line-height: 1.45;
}

.release-feature-box ul {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
}

.release-feature-box li {
  position: relative;
  color: var(--text);
  line-height: 1.42;
  padding-left: 22px;
}

.release-feature-box li::before {
  content: ">";
  position: absolute;
  left: 0;
  color: var(--gold-soft);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-weight: 900;
}

.release-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  padding: 10px 0 72px;
}

.release-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 1px solid var(--line);
  background: var(--panel);
  color: inherit;
  overflow: hidden;
}

.release-card:hover {
  border-color: rgba(239, 189, 79, 0.54);
}

.release-card-image {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  background: #08090a;
  overflow: hidden;
}

.release-card-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 6px);
  pointer-events: none;
}

.release-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.release-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 10px;
  padding: 18px;
}

.release-card-copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
  color: inherit;
  text-decoration: none;
}

.release-card-copy:hover h2,
.release-card-copy:focus-visible h2 {
  color: var(--blue);
}

.release-card-body .archive-link {
  margin-top: 0;
}

.release-card-body .article-type-tags {
  margin-top: auto;
}

.release-card-body-no-tags .archive-link {
  margin-top: auto;
}

.release-card-body h2 {
  display: -webkit-box;
  min-height: 2em;
  overflow: hidden;
  margin: 0;
  font-size: clamp(1.25rem, 2.4vw, 1.8rem);
  line-height: 1;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.release-card-body p {
  margin: 0;
  color: var(--muted-strong);
}

.release-card-copy > p:not(.mini-label) {
  display: -webkit-box;
  min-height: 6.75em;
  max-height: 6.75em;
  overflow: hidden;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
}

.release-empty {
  border: 1px dashed rgba(239, 189, 79, 0.4);
  color: var(--muted-strong);
  margin-bottom: 72px;
  padding: 24px;
}

.release-type-filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 22px;
  border: 1px solid var(--line);
  background: var(--panel);
  padding: 12px;
}

.release-type-filter-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.release-type-filter-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(239, 189, 79, 0.38);
  background: rgba(239, 189, 79, 0.06);
  color: var(--muted-strong);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.72rem;
  font-weight: 850;
  padding: 9px 10px;
  text-decoration: none;
  text-transform: uppercase;
}

.release-type-filter-link span {
  min-width: 22px;
  border-left: 1px solid currentColor;
  color: var(--muted);
  padding-left: 8px;
  text-align: center;
}

.release-type-filter-link:hover,
.release-type-filter-link:focus-visible,
.release-type-filter-link.is-active {
  border-color: var(--gold);
  background: rgba(239, 189, 79, 0.16);
  color: var(--gold-soft);
  outline: none;
}

.release-type-filter > p {
  flex: 0 0 auto;
  margin: 0;
  color: var(--muted);
  font-size: 0.76rem;
  text-transform: uppercase;
}

.release-type-filter > p strong {
  color: var(--green);
}

.release-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 520px);
  gap: 28px;
  align-items: start;
}

.release-detail-copy {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.release-detail-copy > .release-share { order: 10; }
.release-detail-copy > .release-feature-box { order: 20; }
.release-detail-copy > .release-blog-callout { order: 30; }
.release-detail-copy > .release-downloads { order: 31; }
.release-detail-copy > .release-video-callout { order: 35; }
.release-detail-copy > .release-actions { order: 40; }
.release-detail-copy > .release-keyfile-card { order: 32; }
.release-detail-copy > .release-rating { order: 50; }
.release-detail-copy > .release-legal-note { order: 70; }

.release-detail-copy .mini-label {
  display: block;
  margin-top: 24px;
}

.release-detail-side {
  display: grid;
  gap: 18px;
  align-content: start;
  min-width: 0;
}

.release-detail-image {
  --monitor-pad: clamp(10px, 1.35vw, 16px);
  --monitor-bottom: clamp(28px, 4.3vw, 42px);
  --monitor-screen-radius: 7px;
  position: relative;
  aspect-ratio: 16 / 10.7;
  border: 1px solid rgba(239, 189, 79, 0.5);
  border-radius: 16px 16px 28px 28px;
  background:
    radial-gradient(circle at calc(100% - 34px) calc(100% - 19px), rgba(100, 208, 135, 0.95) 0 3px, rgba(100, 208, 135, 0.32) 4px 6px, transparent 7px),
    repeating-linear-gradient(90deg, rgba(239, 189, 79, 0.28) 0 2px, transparent 2px 7px) 18px calc(100% - 22px) / 88px 10px no-repeat,
    linear-gradient(180deg, transparent calc(100% - var(--monitor-bottom)), rgba(239, 189, 79, 0.09) calc(100% - var(--monitor-bottom)), rgba(0, 0, 0, 0.34) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.1), transparent 18%),
    linear-gradient(145deg, #2b2721, #111214 44%, #050506 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 0 0 5px rgba(255, 255, 255, 0.025),
    inset 0 -24px 34px rgba(0, 0, 0, 0.48),
    0 9px 0 rgba(5, 5, 6, 0.96),
    0 24px 58px rgba(0, 0, 0, 0.42);
  overflow: hidden;
  padding: var(--monitor-pad) var(--monitor-pad) var(--monitor-bottom);
}

.release-detail-image::before,
.release-detail-image::after {
  content: "";
  position: absolute;
  inset: var(--monitor-pad) var(--monitor-pad) var(--monitor-bottom);
  z-index: 2;
  border-radius: var(--monitor-screen-radius);
  pointer-events: none;
}

.release-detail-image::before {
  border: 1px solid rgba(239, 189, 79, 0.28);
  background:
    radial-gradient(circle at 50% 44%, transparent 44%, rgba(0, 0, 0, 0.18) 100%),
    linear-gradient(115deg, rgba(255, 255, 255, 0.16), transparent 21%, transparent 76%, rgba(121, 184, 255, 0.07));
  box-shadow:
    inset 0 0 22px rgba(0, 0, 0, 0.48),
    inset 0 0 0 1px rgba(255, 255, 255, 0.06);
  opacity: 0.78;
  animation: release-monitor-flicker 7.5s steps(2, end) infinite;
}

.release-detail-image::after {
  z-index: 3;
  background:
    repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0, rgba(255, 255, 255, 0.035) 1px, transparent 1px, transparent 5px),
    linear-gradient(180deg, rgba(100, 208, 135, 0.045), transparent 48%, rgba(239, 189, 79, 0.035));
  mix-blend-mode: screen;
  opacity: 0.5;
  animation: release-monitor-scan 9s linear infinite;
}

.release-detail-image img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  border-radius: var(--monitor-screen-radius);
  background: #050506;
  filter: saturate(1.06) contrast(1.04);
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.82);
}

.release-gallery {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  border-radius: var(--monitor-screen-radius);
  background: #050506;
  overflow: hidden;
}

.release-gallery-slide {
  position: absolute;
  inset: 0;
  display: block;
  margin: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity .85s ease;
}

.release-gallery-slide.is-active {
  opacity: 1;
  pointer-events: auto;
}

.release-gallery-slide > button {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #050506;
  cursor: zoom-in;
  padding: 0;
}

.release-gallery-slide img {
  display: block;
  object-fit: contain;
  image-rendering: auto;
}

.release-gallery-controls {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
}

.release-gallery-controls button {
  position: absolute;
  top: 50%;
  display: grid;
  width: 28px;
  height: 52px;
  border: 0;
  background: rgba(0, 0, 0, .34);
  color: #fff;
  cursor: pointer;
  font: 700 1rem/1 system-ui, sans-serif;
  opacity: .16;
  padding: 0;
  place-items: center;
  pointer-events: auto;
  transform: translateY(-50%);
  transition: opacity .2s ease, background-color .2s ease, color .2s ease;
}

.release-gallery-controls button:first-child { left: 5px; }
.release-gallery-controls button:last-child { right: 5px; }

.release-gallery:hover .release-gallery-controls button,
.release-gallery-controls button:hover,
.release-gallery-controls button:focus-visible {
  background: rgba(0, 0, 0, .7);
  color: var(--green);
  opacity: .9;
}

@media (prefers-reduced-motion: reduce) {
  .release-gallery-slide { transition: none; }
}

body.release-gallery-modal-open {
  overflow: hidden;
}

.release-gallery-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  padding: 28px;
  background: rgba(2, 3, 4, .9);
  backdrop-filter: blur(6px);
  place-items: center;
}

.release-gallery-modal img {
  display: block;
  max-width: min(1200px, calc(100vw - 56px));
  max-height: calc(100dvh - 56px);
  border: 1px solid rgba(239, 189, 79, .55);
  background: #050506;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .7);
  object-fit: contain;
}

.release-gallery-modal button {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 2;
  display: grid;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(239, 189, 79, .55);
  background: #0a0b0c;
  color: #fff;
  cursor: pointer;
  font-size: 1.7rem;
  place-items: center;
}

@media(max-width:600px){.release-gallery-modal{padding:10px}.release-gallery-modal img{max-width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}.release-gallery-modal button{top:10px;right:10px}.release-gallery-controls button{opacity:.48;width:26px;height:46px}}

.dosi-card {
  --dosi-size: clamp(92px, 20vw, 122px);
  --dosi-lane: calc(var(--dosi-size) + 38px);
  position: relative;
  display: block;
  min-height: 220px;
  border: 1px solid rgba(239, 189, 79, 0.34);
  background:
    linear-gradient(135deg, rgba(239, 189, 79, 0.09), rgba(100, 208, 135, 0.055) 52%, rgba(5, 7, 8, 0.98)),
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.035) 0, rgba(100, 208, 135, 0.035) 1px, transparent 1px, transparent 6px),
    #08090a;
  box-shadow: var(--shadow);
  overflow: hidden;
  padding: 16px 16px 42px var(--dosi-lane);
  isolation: isolate;
}

.dosi-card::before {
  content: "";
  position: absolute;
  top: 13px;
  bottom: 34px;
  left: 13px;
  z-index: 0;
  width: calc(var(--dosi-size) + 18px);
  border: 1px dashed rgba(100, 208, 135, 0.24);
  background:
    radial-gradient(circle at 50% 18%, rgba(100, 208, 135, 0.13), transparent 36%),
    rgba(0, 0, 0, 0.08);
  pointer-events: none;
}

.dosi-card::after {
  content: "D.O.S.I.";
  position: absolute;
  right: 12px;
  bottom: 8px;
  color: rgba(239, 189, 79, 0.12);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 2.3rem;
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
}

.dosi-mascot {
  position: absolute;
  display: block;
  top: 24px;
  left: 24px;
  z-index: 2;
  width: var(--dosi-size);
  max-width: none;
  height: auto;
  pointer-events: none;
  filter:
    drop-shadow(0 16px 22px rgba(0, 0, 0, 0.38))
    drop-shadow(0 0 18px rgba(100, 208, 135, 0.22));
}

.dosi-mascot img {
  display: block;
  width: 100%;
  height: auto;
}

.dosi-bubble {
  position: relative;
  z-index: 1;
  border: 1px solid rgba(100, 208, 135, 0.45);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.045) 0, rgba(100, 208, 135, 0.045) 1px, transparent 1px, transparent 6px),
    rgba(5, 12, 9, 0.9);
  color: var(--muted-strong);
  min-height: 152px;
  padding: 13px 14px;
}

.dosi-bubble::before {
  content: "";
  position: absolute;
  left: -9px;
  bottom: 26px;
  width: 16px;
  height: 16px;
  border-left: 1px solid rgba(100, 208, 135, 0.45);
  border-bottom: 1px solid rgba(100, 208, 135, 0.45);
  background: #07110c;
  transform: rotate(45deg);
}

.dosi-bubble .mini-label {
  display: block;
  color: var(--green);
}

.dosi-bubble p {
  margin: 8px 0 0;
  font-size: 0.98rem;
  line-height: 1.45;
}

.dosi-subtitle {
  position: absolute;
  right: 16px;
  bottom: 14px;
  z-index: 1;
  color: rgba(239, 189, 79, 0.72);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

@keyframes release-monitor-flicker {
  0%,
  100% {
    opacity: 0.76;
  }

  48% {
    opacity: 0.82;
  }

  52% {
    opacity: 0.7;
  }
}

@keyframes release-monitor-scan {
  0% {
    background-position: 0 0, 0 0;
  }

  100% {
    background-position: 0 10px, 0 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hub-dosi-eyelid,
  .release-detail-image::before,
  .release-detail-image::after,
  .language-flag-rig,
  .language-flag-cloth,
  .theme-toggle .theme-lamp-rig,
  .theme-toggle-pulled .theme-lamp-rig,
  .release-keyfile-button::before,
  .release-keyfile-button::after {
    animation: none;
  }
}

.release-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.release-share {
  display: grid;
  gap: 9px;
  margin-top: 18px;
}

.release-share .mini-label {
  color: var(--muted);
}

.release-share-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.blog-post-panel > .release-share {
  justify-items: center;
  text-align: center;
  margin: 28px auto 0;
}

.blog-post-panel > .release-share .release-share-buttons {
  justify-content: center;
}

.release-rating {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 4px 14px;
  align-items: center;
  max-width: 560px;
  margin-top: 24px;
  padding: 13px 16px 13px 8px;
  border: 1px solid rgba(239, 189, 79, 0.28);
  background: linear-gradient(105deg, rgba(239, 189, 79, 0.08), rgba(10, 11, 13, 0.35));
}

.release-rating-visual {
  display: block;
  width: 112px;
  aspect-ratio: 13 / 15;
  align-self: end;
}

.release-rating-visual img {
  display: block;
  width: 100%;
  height: auto;
}

.release-rating-content { min-width: 0; }

.release-rating h2 {
  margin: 2px 0 9px;
  font-size: 1.05rem;
}

.release-rating-stars { display: flex; gap: 3px; }

.release-rating-star {
  display: inline-grid;
  min-width: 1.8rem;
  place-items: center;
  appearance: none;
  border: 0;
  padding: 2px;
  color: rgba(239, 189, 79, 0.34);
  background: transparent;
  font-size: 0;
  line-height: 1;
  cursor: pointer;
  transition: color 150ms ease, transform 150ms ease;
}

.release-rating-star::before {
  content: "\2605";
  font-size: 1.8rem;
  line-height: 1;
}

.release-rating-star:hover,
.release-rating-star:focus-visible,
.release-rating-star.is-selected { color: var(--gold-soft); transform: translateY(-2px) scale(1.08); }
.release-rating-star:disabled { cursor: default; }
.release-rating-summary,
.release-rating-message { margin: 8px 0 0; font-size: 0.82rem; color: var(--muted); }
.release-rating-message { min-height: 1.2em; color: var(--green); }
.release-rating-done .release-rating-star { color: var(--gold-soft); }

@media (max-width: 460px) {
  .release-rating { grid-template-columns: 82px minmax(0, 1fr); padding-right: 10px; }
  .release-rating-visual { width: 82px; }
  .release-rating-star { min-width: 1.52rem; }
  .release-rating-star::before { font-size: 1.52rem; }
}

@media (prefers-reduced-motion: reduce) {
  .release-rating-star { transition: none; }
  .release-rating-star:hover,
  .release-rating-star:focus-visible,
  .release-rating-star.is-selected { transform: none; }
}


.share-button {
  appearance: none;
  display: inline-grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(239, 189, 79, 0.34);
  background:
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.04) 0, rgba(239, 189, 79, 0.04) 1px, transparent 1px, transparent 5px),
    rgba(10, 11, 13, 0.88);
  color: var(--text);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.88rem;
  font-weight: 900;
  line-height: 1;
  padding: 0;
  text-decoration: none;
  text-transform: uppercase;
  transition: border-color 160ms ease, color 160ms ease, background 160ms ease, transform 160ms ease;
}

.share-button:hover,
.share-button:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(239, 189, 79, 0.76);
  background:
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.08) 0, rgba(239, 189, 79, 0.08) 1px, transparent 1px, transparent 5px),
    rgba(239, 189, 79, 0.1);
  color: var(--gold-soft);
}

.share-button-facebook {
  color: #79b8ff;
}

.share-button-native {
  display: none;
  color: var(--gold-soft);
}

.share-button-native-visible {
  display: inline-grid;
}

.share-button-whatsapp,
.share-button-copied {
  color: var(--green);
}

.share-button-email,
.share-button-native,
.share-button-copy {
  cursor: pointer;
}

.release-keyfile-card {
  position: relative;
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  max-width: 560px;
  min-height: 156px;
  overflow: hidden;
  margin-top: 12px;
  border: 1px solid rgba(239, 189, 79, 0.3);
  background:
    radial-gradient(circle at 108px 54%, rgba(255, 116, 105, 0.13), transparent 31%),
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.035) 0, rgba(239, 189, 79, 0.035) 1px, transparent 1px, transparent 6px),
    linear-gradient(105deg, rgba(239, 189, 79, 0.075), rgba(10, 11, 13, 0.42));
  padding: 10px 16px 10px 8px;
  isolation: isolate;
}

.release-detail-side .release-keyfile-card {
  max-width: none;
  margin-top: 0;
}

.release-detail-side .release-rating {
  max-width: none;
  margin-top: 0;
}

.release-keyfile-support {
  position: absolute;
  top: 10px;
  left: 50%;
  z-index: 3;
  border: 1px solid rgba(239, 189, 79, 0.46);
  background: rgba(20, 15, 7, 0.72);
  color: var(--gold-soft);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.045em;
  line-height: 1;
  padding: 6px 7px;
  transform: translateX(-50%);
  text-transform: uppercase;
}

.release-keyfile-visual {
  display: block;
  width: 210px;
  aspect-ratio: 9 / 5;
  align-self: center;
  justify-self: center;
  pointer-events: none;
  filter:
    drop-shadow(0 13px 19px rgba(0, 0, 0, 0.38))
    drop-shadow(0 0 14px rgba(255, 116, 105, 0.1));
}

.release-keyfile-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.release-keyfile-content {
  min-width: 0;
  padding: 33px 0 3px;
}

.release-detail-copy .release-keyfile-content .mini-label {
  margin: 0 0 5px;
  color: var(--gold-soft);
}

.release-keyfile-content h2 {
  margin: 0 0 7px;
  font-size: 1.05rem;
  line-height: 1.18;
}

.release-keyfile-content p {
  margin: 0;
  color: var(--muted-strong);
  font-size: 0.88rem;
  line-height: 1.48;
}

.release-keyfile-content .release-keyfile-optional {
  margin-top: 8px;
  color: var(--muted);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.025em;
  line-height: 1.35;
  text-transform: uppercase;
}

.release-keyfile-button {
  position: relative;
  min-height: 46px;
  margin-top: 12px;
  border-color: rgba(239, 189, 79, 0.9);
  background: linear-gradient(180deg, #f6d275, #c98d1b);
  box-shadow:
    0 8px 18px rgba(200, 135, 19, 0.22),
    inset 0 1px 0 rgba(255, 250, 226, 0.56);
  color: #171108;
  font-weight: 900;
  text-shadow: 0 1px 0 rgba(255, 248, 220, 0.34);
}

.release-keyfile-button::before,
.release-keyfile-button::after {
  position: absolute;
  z-index: 2;
  width: 5px;
  height: 7px;
  opacity: 0;
  pointer-events: none;
  content: "";
}

.release-keyfile-button::before {
  left: 34%;
  bottom: 60%;
  background: #fff4bc;
  box-shadow:
    10px -5px #62d087,
    21px 2px #ff7669,
    33px -11px #fff4bc,
    45px -3px #5ca9f6,
    57px 5px #62d087;
}

.release-keyfile-button::after {
  right: 35%;
  bottom: 58%;
  width: 6px;
  height: 5px;
  background: #ff7669;
  box-shadow:
    -11px -10px #5ca9f6,
    -24px -4px #fff4bc,
    -37px 5px #62d087,
    -49px -7px #ff7669;
}

.release-keyfile-button:hover::before,
.release-keyfile-button:focus-visible::before {
  animation: keyfile-confetti-left 880ms cubic-bezier(.16, .72, .28, 1) both;
}

.release-keyfile-button:hover::after,
.release-keyfile-button:focus-visible::after {
  animation: keyfile-confetti-right 920ms cubic-bezier(.16, .72, .28, 1) both;
}

.release-keyfile-button:hover {
  border-color: #ffe3a0;
  background: linear-gradient(180deg, #ffe39a, #dba32e);
  box-shadow:
    0 10px 22px rgba(200, 135, 19, 0.32),
    inset 0 1px 0 rgba(255, 255, 238, 0.65);
}

:root[data-theme="light"] .release-keyfile-button {
  border-color: rgba(171, 107, 6, 0.62);
  background: linear-gradient(180deg, #fff3cb, #e8b746);
  color: #171108;
}

:root[data-theme="light"] .release-keyfile-support {
  border-color: rgba(171, 107, 6, 0.34);
  background: rgba(255, 250, 235, 0.84);
  color: #80530a;
}

@keyframes keyfile-confetti-left {
  0% { opacity: 0; transform: translate(0, 6px) rotate(0deg); }
  18% { opacity: 1; }
  100% { opacity: 0; transform: translate(-26px, -33px) rotate(-135deg); }
}

@keyframes keyfile-confetti-right {
  0% { opacity: 0; transform: translate(0, 7px) rotate(0deg); }
  18% { opacity: 1; }
  100% { opacity: 0; transform: translate(26px, -30px) rotate(135deg); }
}

.release-legal-note {
  max-width: 820px;
  border: 1px solid rgba(100, 208, 135, 0.32);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.035) 0, rgba(100, 208, 135, 0.035) 1px, transparent 1px, transparent 6px),
    rgba(5, 20, 12, 0.58);
  color: var(--muted-strong);
  margin-top: 14px;
  padding: 12px 14px;
}

.release-legal-note strong {
  display: block;
  color: var(--green);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.78rem;
  text-transform: uppercase;
}

.release-legal-note p {
  margin: 6px 0 0;
  line-height: 1.45;
}

.button-disabled,
.button-disabled:hover {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(216, 210, 195, 0.62);
  cursor: not-allowed;
}

.release-facts {
  position: relative;
  margin: 22px 0 2px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  background:
    linear-gradient(135deg, rgba(239, 189, 79, .09), transparent 54%),
    var(--panel);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .14);
  overflow: hidden;
}

.release-facts-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px 20px 16px;
  border-bottom: 1px solid var(--line);
}

.release-detail-copy .release-facts-head .mini-label {
  margin-top: 0;
  color: var(--gold-soft);
}

.release-facts-bulb {
  display: grid;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(239, 189, 79, .5);
  border-radius: 50%;
  color: var(--gold);
  background: rgba(239, 189, 79, .08);
  box-shadow: 0 0 24px rgba(239, 189, 79, .12);
}

.release-facts-bulb svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.release-facts-head h2 {
  margin: 4px 0 5px;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
}

.release-facts-head p {
  margin: 0;
  color: var(--muted-strong);
  font-size: .88rem;
  line-height: 1.5;
}

.release-facts-grid {
  margin: 0;
  padding: 0;
  list-style: none;
}

.release-fact-card {
  padding: 17px 20px 18px;
}

.release-fact-card p {
  margin: 0;
  font-size: .97rem;
  line-height: 1.62;
}

@media (max-width: 720px) {
  .release-facts-head { padding: 16px; }
  .release-facts-bulb { flex-basis: 40px; width: 40px; height: 40px; }
  .release-fact-card { padding: 15px 16px 16px; }
}

.release-info-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 28px 0 72px;
}

.release-info-panel {
  border: 1px solid var(--line);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.035) 0, rgba(100, 208, 135, 0.035) 1px, transparent 1px, transparent 6px),
    var(--panel);
  padding: 18px;
}

.release-info-panel strong,
.release-info-panel a {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 1.18rem;
  font-weight: 900;
  text-decoration: none;
}

.release-info-panel a:hover {
  color: var(--gold-soft);
}

.release-preview-banner {
  border: 1px solid rgba(239, 189, 79, 0.48);
  background: rgba(40, 30, 10, 0.78);
  color: var(--gold-soft);
  font-weight: 900;
  margin: 28px 0 0;
  padding: 12px 14px;
}

.release-missing {
  min-height: 48vh;
}

.about-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.metric + .metric {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px dashed rgba(100, 208, 135, 0.32);
}

.metric-value {
  display: block;
  color: #f6fff4;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(2rem, 5.5vw, 3.05rem);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  line-height: 1;
  text-shadow:
    0 0 6px rgba(100, 208, 135, 0.34),
    0 0 18px rgba(100, 208, 135, 0.12);
  white-space: nowrap;
}

.metric-label {
  display: block;
  margin-top: 8px;
  color: rgba(156, 241, 180, 0.78);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.metric-label::before {
  content: "[ ";
  color: rgba(100, 208, 135, 0.6);
}

.metric-label::after {
  content: " ]";
  color: rgba(100, 208, 135, 0.6);
}

.sync-line {
  margin-top: 18px;
  border: 1px solid rgba(100, 208, 135, 0.32);
  background: rgba(0, 0, 0, 0.3);
  padding: 10px 12px;
  color: var(--green);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.78rem;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 0 8px rgba(100, 208, 135, 0.32);
  white-space: nowrap;
}

.sync-line::before {
  content: "> ";
}

.sync-line::after {
  animation: terminal-caret 1s steps(1, end) infinite;
  content: "_";
  margin-left: 4px;
}

@keyframes terminal-caret {
  50% {
    opacity: 0;
  }
}

.intro-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 28px 0;
}

.intro-band h2,
.section-heading h2 {
  margin: 0;
  font-size: clamp(1.7rem, 4vw, 3rem);
  line-height: 1;
}

.intro-band p {
  max-width: 820px;
  margin: 10px 0 0;
  color: var(--muted-strong);
}

.youtube-shell {
  padding: 58px 0 28px;
}

.youtube-feature {
  display: grid;
  grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
  gap: 16px;
  margin-top: 24px;
}

.youtube-copy {
  border: 1px solid var(--line);
  background:
    linear-gradient(160deg, rgba(239, 189, 79, 0.12), rgba(121, 184, 255, 0.08)),
    var(--panel);
  padding: 22px;
}

.youtube-copy h3 {
  margin: 0;
  font-size: clamp(1.4rem, 3vw, 2.15rem);
  line-height: 1.06;
}

.youtube-copy p {
  margin: 12px 0 0;
  color: var(--muted-strong);
}

.video-stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 22px 0;
}

.video-stats div {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.mini-label {
  display: block;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.74rem;
  font-weight: 800;
  text-transform: uppercase;
}

.video-stats strong {
  display: block;
  margin-top: 5px;
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 1.1rem;
}

.video-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.video-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--text);
  text-decoration: none;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
  width: 100%;
  padding: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

body.video-player-open{overflow:hidden}.video-player-modal{position:fixed;inset:0;z-index:1000000;display:grid;place-items:center;background:rgba(0,0,0,.86);padding:12px;backdrop-filter:blur(6px)}.video-player-panel{width:min(920px,calc(100vw - 24px),calc((100vh - 128px) * 1.77778));max-height:calc(100vh - 24px);border:1px solid rgba(239,189,79,.42);background:#08090a;box-shadow:0 30px 90px rgba(0,0,0,.7)}.video-player-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.12)}.video-player-header h2{margin:0;color:#f5f1e8;font-size:clamp(.95rem,2vw,1.25rem);line-height:1.25}.video-player-close{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border:1px solid rgba(239,189,79,.45);background:#151618;color:#fff;font-size:1.8rem;line-height:1;cursor:pointer}.video-player-close:hover,.video-player-close:focus-visible{border-color:var(--gold);color:var(--gold-soft)}.video-player-frame{aspect-ratio:16/9;background:#000}.video-player-frame iframe{display:block;width:100%;height:100%;border:0}.video-player-privacy{margin:0;padding:9px 14px;color:#aaa;font-size:.76rem}

.video-card:hover {
  transform: translateY(-3px);
  border-color: rgba(121, 184, 255, 0.78);
  background: var(--panel-strong);
}

.video-thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #0c0d10;
}

.video-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.play-mark {
  position: absolute;
  right: 12px;
  bottom: 12px;
  display: grid;
  width: 42px;
  height: 30px;
  place-items: center;
  background: rgba(7, 7, 8, 0.86);
  color: var(--gold-soft);
  font-size: 0.9rem;
  line-height: 1;
}

.video-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 14px;
}

.video-card h3 {
  margin: 0 0 16px;
  font-size: 1rem;
  line-height: 1.25;
}

.archive-shell {
  padding: 58px 0 72px;
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
}

.result-count {
  margin: 0 0 4px;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 240px);
  gap: 10px;
  margin: 24px 0 28px;
}

.search-field,
.select-field {
  display: block;
}

input:not([type="checkbox"]),
select,
textarea {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 0;
  background: var(--bg-soft);
  color: var(--text);
  font: inherit;
  font-weight: 650;
  padding: 11px 13px;
  outline: none;
}

textarea {
  min-height: 170px;
  resize: vertical;
}

input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-width: 18px;
  margin: 3px 0 0;
  accent-color: var(--gold);
}

input:not([type="checkbox"]):focus,
select:focus,
textarea:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(239, 189, 79, 0.18);
}

::placeholder {
  color: #8f8a80;
  opacity: 1;
}

.status-message,
.empty-state {
  border: 1px solid var(--line);
  background: var(--bg-soft);
  color: var(--muted-strong);
  padding: 18px;
}

.status-message[hidden] {
  display: none;
}

.article-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}

.article-card {
  content-visibility: auto;
  contain-intrinsic-size: auto 440px;
  position: relative;
  display: flex;
  min-height: 100%;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--text);
  text-decoration: none;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

.article-card:hover {
  transform: translateY(-3px);
  border-color: rgba(239, 189, 79, 0.7);
  background: var(--panel-strong);
}

.thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(239, 189, 79, 0.24), rgba(121, 184, 255, 0.14)),
    #0c0d10;
}

.thumb::after {
  content: "DOSGAME.AT";
  position: absolute;
  inset: auto 14px 12px;
  color: rgba(242, 241, 235, 0.72);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.76rem;
  font-weight: 800;
}

.thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  image-rendering: auto;
  filter: saturate(1.08) contrast(1.04);
}

.thumb.is-empty img {
  display: none;
}

.article-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 16px;
}

.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--gold-soft);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.article-card h3 {
  margin: 0;
  font-size: 1.08rem;
  line-height: 1.25;
}

.article-card p {
  display: -webkit-box;
  overflow: hidden;
  min-height: 4.5em;
  margin: 12px 0 16px;
  color: var(--muted-strong);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.release-type-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.article-type-tags {
  margin: auto 0 12px;
}

.release-type-tag {
  border: 1px solid rgba(239, 189, 79, 0.5);
  background: rgba(239, 189, 79, 0.1);
  color: var(--gold-soft);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.68rem;
  font-weight: 850;
  line-height: 1;
  padding: 6px 8px;
  text-transform: uppercase;
}

.release-type-tag-link {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  text-decoration: none;
  transition: border-color .16s ease, background-color .16s ease, color .16s ease, transform .16s ease;
}

.release-type-tag-link:hover,
.release-type-tag-link:focus-visible {
  border-color: var(--gold);
  background: rgba(239, 189, 79, 0.2);
  color: var(--gold-soft);
  outline: none;
  transform: translateY(-1px);
}

.release-detail-type-tags {
  margin: 0 0 14px;
}

.article-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 750;
}

.article-type-tags + .article-footer {
  margin-top: 0;
}

.archive-link {
  color: var(--blue);
}

.site-footer {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid var(--line);
  padding: 26px 0 34px;
  color: var(--muted);
  font-size: 0.9rem;
}

.site-footer p {
  margin: 0;
}

.site-footer a {
  color: var(--gold-soft);
  font-weight: 800;
  text-decoration: none;
}

.site-footer a:hover {
  color: var(--blue);
}

.site-footer p:last-child {
  text-align: right;
  white-space: nowrap;
}

.team-page {
  padding: 36px 0 78px;
}

.team-hero {
  border-bottom: 1px solid rgba(239, 189, 79, 0.28);
  padding: 28px 0 30px;
}

.team-hero h1 {
  margin: 0;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(3.1rem, 10vw, 7.2rem);
  line-height: 0.9;
  text-transform: uppercase;
}

.team-hero .lede {
  max-width: 900px;
}

.team-command {
  max-width: 760px;
  border: 1px solid rgba(100, 208, 135, 0.42);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.045) 0, rgba(100, 208, 135, 0.045) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, rgba(5, 24, 13, 0.92), rgba(3, 7, 5, 0.95));
  color: var(--green);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(0.86rem, 2vw, 1.08rem);
  font-weight: 800;
  margin-top: 24px;
  padding: 13px 15px;
  text-shadow: 0 0 10px rgba(100, 208, 135, 0.32);
}

.team-command::after {
  animation: terminal-caret 1s steps(1, end) infinite;
  content: "_";
  margin-left: 5px;
}

.team-art {
  position: relative;
  display: block;
  width: min(100%, 760px);
  margin-top: 24px;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(239, 189, 79, 0.32);
  background:
    repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.035) 0, rgba(239, 189, 79, 0.035) 1px, transparent 1px, transparent 7px),
    #08090a;
  box-shadow: var(--shadow), inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

.team-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.035) 0, rgba(255, 255, 255, 0.035) 1px, transparent 1px, transparent 7px),
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.36));
  pointer-events: none;
}

.team-art-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.team-art-image-light {
  display: none;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 28px 0;
}

.team-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(239, 189, 79, 0.36);
  background:
    repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.025) 0, rgba(255, 255, 255, 0.025) 1px, transparent 1px, transparent 7px),
    linear-gradient(135deg, rgba(239, 189, 79, 0.08), rgba(121, 184, 255, 0.055) 45%, rgba(19, 20, 23, 0.96)),
    var(--panel);
  box-shadow: inset 0 0 28px rgba(239, 189, 79, 0.035);
  padding: 20px;
}

.team-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-top: 2px solid rgba(100, 208, 135, 0.46);
  pointer-events: none;
}

.team-card-header {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
}

.team-avatar {
  display: grid;
  width: 92px;
  height: 92px;
  place-items: center;
  border: 1px solid rgba(239, 189, 79, 0.72);
  background:
    radial-gradient(circle at 35% 28%, rgba(239, 189, 79, 0.24), transparent 42%),
    rgba(6, 7, 9, 0.92);
  color: var(--gold-soft);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 1.65rem;
  font-weight: 900;
  text-shadow: 0 0 16px rgba(239, 189, 79, 0.3);
}

.team-card h2 {
  margin: 4px 0 6px;
  color: var(--text);
  font-size: clamp(1.35rem, 3vw, 2.1rem);
  line-height: 1.05;
}

.team-card-header p {
  margin: 0;
  color: var(--gold-soft);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.9rem;
  font-weight: 800;
  text-transform: uppercase;
}

.team-specs {
  display: grid;
  gap: 12px;
  margin: 20px 0 0;
}

.team-specs div {
  border-top: 1px solid rgba(255, 255, 255, 0.09);
  padding-top: 12px;
}

.team-specs dt {
  color: var(--muted);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.74rem;
  font-weight: 900;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.team-specs dd {
  margin: 0;
  color: var(--muted-strong);
  line-height: 1.48;
}

.team-note {
  max-width: 920px;
  border: 1px solid rgba(100, 208, 135, 0.34);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.035) 0, rgba(100, 208, 135, 0.035) 1px, transparent 1px, transparent 6px),
    rgba(5, 20, 12, 0.5);
  padding: 20px;
}

.team-note h2 {
  margin: 7px 0 9px;
  font-size: clamp(1.35rem, 3vw, 2.1rem);
}

.team-note p {
  margin: 0;
  color: var(--muted-strong);
  line-height: 1.55;
}

.team-note .about-actions {
  margin-top: 16px;
}

.faq-page {
  padding: 34px 0 78px;
}

.faq-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(520px, 1.18fr);
  align-items: center;
  gap: 32px;
  border-bottom: 1px solid rgba(239, 189, 79, 0.3);
  padding: 24px 0 34px;
}

.faq-hero h1 {
  max-width: 760px;
  margin: 0;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(3rem, 7vw, 6.7rem);
  line-height: 0.92;
  text-transform: uppercase;
}

.faq-hero .lede {
  max-width: 720px;
  font-size: clamp(1rem, 1.55vw, 1.22rem);
  line-height: 1.62;
}

.faq-terminal-line {
  width: min(100%, 640px);
  margin-top: 22px;
  border: 1px solid rgba(100, 208, 135, 0.38);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.045) 0, rgba(100, 208, 135, 0.045) 1px, transparent 1px, transparent 6px),
    rgba(3, 12, 7, 0.88);
  color: var(--green);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.88rem;
  font-weight: 800;
  padding: 12px 14px;
  text-shadow: 0 0 12px rgba(100, 208, 135, 0.28);
}

.faq-hero-art {
  position: relative;
  min-height: 410px;
  overflow: hidden;
  border: 1px solid rgba(239, 189, 79, 0.42);
  background: #08090a;
  box-shadow: var(--shadow), inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.faq-hero-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.025) 0, rgba(255, 255, 255, 0.025) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, transparent 68%, rgba(0, 0, 0, 0.28));
  pointer-events: none;
}

.faq-art {
  position: absolute;
  inset: 0;
  display: block;
}

.faq-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 53%;
}

.faq-art-light {
  display: none;
}

.faq-tools {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) auto;
  align-items: end;
  gap: 18px;
  border-bottom: 1px solid var(--line);
  padding: 26px 0 20px;
}

.faq-search-wrap label {
  display: block;
  margin-bottom: 8px;
  color: var(--gold-soft);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.77rem;
  font-weight: 900;
  text-transform: uppercase;
}

.faq-search-control {
  position: relative;
}

.faq-search-control input {
  width: 100%;
  min-height: 52px;
  padding: 12px 52px 12px 15px;
  border: 1px solid rgba(239, 189, 79, 0.5);
  font-size: 1rem;
}

.faq-search-control input:focus {
  border-color: var(--gold-soft);
  box-shadow: 0 0 0 3px rgba(239, 189, 79, 0.12);
  outline: 0;
}

.faq-search-clear {
  position: absolute;
  top: 50%;
  right: 8px;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  transform: translateY(-50%);
  border: 0;
  background: transparent;
  color: var(--muted-strong);
  cursor: pointer;
  font-size: 1.7rem;
  line-height: 1;
}

.faq-search-clear:hover {
  color: var(--gold-soft);
}

.faq-tool-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
}

.faq-tool-actions .button {
  min-height: 46px;
  white-space: nowrap;
}

.faq-tool-actions .button span {
  color: var(--green);
  font-family: ui-monospace, monospace;
  font-size: 1.15rem;
}

.faq-result-count {
  margin: 0 8px 0 0;
  color: var(--muted);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
}

.faq-index {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 22px 0 52px;
  border: 1px solid var(--line);
  background: var(--line);
}

.faq-index a {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 54px;
  padding: 10px 12px;
  background: var(--panel);
  color: var(--text);
  text-decoration: none;
}

.faq-index a:hover {
  background: rgba(239, 189, 79, 0.1);
}

.faq-index span,
.faq-section-code {
  color: var(--gold-soft);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.75rem;
  font-weight: 900;
}

.faq-index strong {
  overflow-wrap: anywhere;
  font-size: 0.86rem;
  line-height: 1.16;
}

.faq-sections {
  display: grid;
  gap: 58px;
}

.faq-section {
  scroll-margin-top: 24px;
}

.faq-section-heading {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  margin-bottom: 16px;
}

.faq-section-code {
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  border: 1px solid rgba(239, 189, 79, 0.52);
  background: rgba(239, 189, 79, 0.07);
  font-size: 0.9rem;
}

.faq-section-heading h2 {
  margin: 0 0 5px;
  font-size: clamp(1.45rem, 3vw, 2.35rem);
  line-height: 1;
}

.faq-section-heading p {
  margin: 0;
  color: var(--muted);
}

.faq-list {
  border-top: 1px solid var(--line);
}

.faq-item {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background:
    repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.018) 0, rgba(255, 255, 255, 0.018) 1px, transparent 1px, transparent 7px),
    rgba(17, 18, 20, 0.82);
}

.faq-item[open] {
  border-color: rgba(100, 208, 135, 0.42);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.026) 0, rgba(100, 208, 135, 0.026) 1px, transparent 1px, transparent 7px),
    rgba(9, 19, 13, 0.74);
}

.faq-item summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36px;
  align-items: center;
  gap: 18px;
  min-height: 64px;
  padding: 14px 16px 14px 18px;
  color: var(--text);
  cursor: pointer;
  font-size: clamp(1rem, 1.7vw, 1.15rem);
  font-weight: 850;
  list-style: none;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary:hover {
  color: var(--gold-soft);
}

.faq-item-toggle {
  position: relative;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(239, 189, 79, 0.38);
}

.faq-item-toggle::before,
.faq-item-toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 13px;
  height: 2px;
  transform: translate(-50%, -50%);
  background: var(--gold-soft);
}

.faq-item-toggle::after {
  transform: translate(-50%, -50%) rotate(90deg);
  transition: transform 160ms ease, opacity 160ms ease;
}

.faq-item[open] .faq-item-toggle::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(0deg);
}

.faq-answer {
  max-width: 96ch;
  margin: 0 18px 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 16px 0 2px;
  color: var(--muted-strong);
  font-size: clamp(0.98rem, 1.5vw, 1.08rem);
  line-height: 1.68;
}

.faq-answer p {
  margin: 0 0 12px;
}

.faq-answer p:last-of-type {
  margin-bottom: 0;
}

.faq-answer-link {
  display: inline-flex;
  margin-top: 16px;
  color: var(--blue);
  font-weight: 850;
  text-decoration: none;
}

.faq-answer-link::after {
  content: "→";
  margin-left: 7px;
}

.faq-answer-link:hover {
  color: var(--gold-soft);
}

.faq-no-results {
  max-width: 760px;
  margin: 48px auto 0;
  border: 1px solid rgba(239, 189, 79, 0.4);
  background: var(--panel);
  padding: 24px;
  text-align: center;
}

.faq-no-results h2 {
  margin: 7px 0 8px;
}

.faq-no-results p {
  margin: 0 0 18px;
  color: var(--muted);
}

:root[data-theme="light"] .faq-art-light {
  display: block;
}

:root[data-theme="light"] .faq-art-dark {
  display: none;
}

:root[data-theme="light"] .faq-hero-art {
  border-color: rgba(200, 135, 19, 0.34);
  background: #f2f3f0;
  box-shadow:
    0 22px 55px rgba(26, 31, 32, 0.14),
    inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

:root[data-theme="light"] .faq-hero-art::after {
  background:
    repeating-linear-gradient(0deg, rgba(17, 20, 19, 0.035) 0, rgba(17, 20, 19, 0.035) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, transparent 70%, rgba(244, 246, 242, 0.22));
  mix-blend-mode: multiply;
}

:root[data-theme="light"] .faq-terminal-line {
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.055) 0, rgba(21, 120, 71, 0.055) 1px, transparent 1px, transparent 6px),
    rgba(235, 249, 239, 0.92);
  color: #0d7148;
  text-shadow: none;
}

:root[data-theme="light"] .faq-index a {
  background: rgba(255, 255, 255, 0.92);
}

:root[data-theme="light"] .faq-index a:hover {
  background: rgba(255, 243, 210, 0.95);
}

:root[data-theme="light"] .faq-item {
  background:
    repeating-linear-gradient(180deg, rgba(17, 20, 19, 0.025) 0, rgba(17, 20, 19, 0.025) 1px, transparent 1px, transparent 7px),
    rgba(255, 255, 255, 0.9);
}

:root[data-theme="light"] .faq-item[open] {
  border-color: rgba(21, 120, 71, 0.34);
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.032) 0, rgba(21, 120, 71, 0.032) 1px, transparent 1px, transparent 7px),
    rgba(240, 250, 243, 0.96);
}

:root[data-theme="light"] .faq-answer {
  border-top-color: rgba(17, 20, 19, 0.1);
}

@media (max-width: 1080px) {
  .faq-hero {
    grid-template-columns: 1fr;
  }

  .faq-hero-art {
    min-height: 390px;
  }

  .faq-tools {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .faq-tool-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .faq-page {
    padding: 24px 0 48px;
  }

  .faq-hero {
    gap: 22px;
    padding: 12px 0 26px;
  }

  .faq-hero h1 {
    font-size: clamp(2.55rem, 14vw, 4rem);
  }

  .faq-hero-art {
    min-height: 260px;
  }

  .faq-art img {
    object-position: 58% 50%;
  }

  .faq-tool-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .faq-result-count {
    grid-column: 1 / -1;
    margin: 0 0 3px;
  }

  .faq-tool-actions .button {
    width: 100%;
    padding-inline: 10px;
  }

  .faq-index {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 40px;
  }

  .faq-sections {
    gap: 42px;
  }

  .faq-section-heading {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 11px;
  }

  .faq-section-code {
    width: 44px;
    height: 44px;
  }

  .faq-item summary {
    grid-template-columns: minmax(0, 1fr) 32px;
    min-height: 60px;
    padding: 13px 12px 13px 14px;
  }

  .faq-answer {
    margin: 0 14px 15px;
  }
}

@media (max-width: 430px) {
  .faq-hero-art {
    min-height: 220px;
  }

  .faq-index a {
    grid-template-columns: 24px minmax(0, 1fr);
    padding-inline: 9px;
  }
}

.legal-page {
  padding: 52px 0 70px;
}

.legal-hero {
  max-width: 980px;
  margin-bottom: 28px;
}

.legal-hero h1 {
  font-size: clamp(2.7rem, 7vw, 5.8rem);
  line-height: 0.94;
}

.legal-hero .lede {
  max-width: 860px;
}

.legal-updated {
  margin: 18px 0 0;
  color: var(--green);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.86rem;
  font-weight: 800;
}

.legal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.legal-panel {
  border: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    rgba(17, 18, 20, 0.92);
  padding: 22px;
}

.legal-panel.is-wide {
  grid-column: 1 / -1;
}

.legal-panel h2 {
  margin: 0 0 12px;
  color: var(--gold-soft);
  font-size: clamp(1.2rem, 2.2vw, 1.7rem);
  line-height: 1.1;
}

.legal-panel p {
  margin: 0;
  color: var(--muted-strong);
}

.legal-panel p + p {
  margin-top: 12px;
}

.legal-panel a {
  color: var(--blue);
  font-weight: 800;
  text-decoration: none;
}

.legal-panel a:hover {
  text-decoration: underline;
}

.contact-page {
  padding: 52px 0 70px;
}

.contact-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.75fr);
  gap: 18px;
  align-items: start;
}

.contact-form,
.contact-side > * {
  border: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    rgba(17, 18, 20, 0.94);
  padding: 22px;
}

.contact-form {
  display: grid;
  gap: 16px;
}

.form-row {
  display: grid;
  gap: 7px;
}

.form-row label,
.check-row {
  color: var(--gold-soft);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.check-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--muted-strong);
  line-height: 1.4;
  text-transform: none;
}

.check-row a {
  color: var(--blue);
  text-decoration: none;
}

.check-row a:hover {
  text-decoration: underline;
}

.trap-field {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.form-message {
  border: 1px solid var(--line);
  padding: 13px 14px;
  font-weight: 800;
}

.form-message.is-success {
  border-color: rgba(100, 208, 135, 0.65);
  background: rgba(100, 208, 135, 0.1);
  color: var(--green);
}

.form-message.is-error {
  border-color: rgba(255, 125, 115, 0.65);
  background: rgba(255, 125, 115, 0.1);
  color: var(--danger);
}

.contact-side {
  display: grid;
  gap: 16px;
}

.terminal-panel {
  border-color: rgba(100, 208, 135, 0.52);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.045) 0, rgba(100, 208, 135, 0.045) 1px, transparent 1px, transparent 5px),
    linear-gradient(180deg, rgba(5, 22, 12, 0.96), rgba(7, 7, 8, 0.96));
  box-shadow:
    inset 0 0 0 1px rgba(100, 208, 135, 0.13),
    inset 0 0 42px rgba(100, 208, 135, 0.08);
}

.terminal-path {
  margin: 0 0 14px;
  color: var(--green);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.82rem;
  font-weight: 800;
}

.terminal-panel h2 {
  margin: 0 0 12px;
  color: var(--text);
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  line-height: 1.05;
}

.terminal-panel p,
.terminal-panel li {
  color: var(--muted-strong);
}

.terminal-panel p {
  margin: 0 0 14px;
}

.terminal-panel ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 18px;
}

.contact-dosi-card {
  overflow: hidden;
  border-color: rgba(239, 189, 79, 0.42);
  background:
    linear-gradient(180deg, rgba(239, 189, 79, 0.06), transparent 44%),
    rgba(10, 11, 13, 0.96);
  padding: 0;
}

.contact-dosi-art {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #060708;
}

.contact-dosi-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, transparent 58%, rgba(0, 0, 0, 0.34));
  pointer-events: none;
}

.contact-dosi-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.04) contrast(1.03);
}

.contact-dosi-image-light {
  display: none;
}

.contact-dosi-bubble {
  position: relative;
  margin: 18px;
  border: 1px solid rgba(100, 208, 135, 0.42);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.035) 0, rgba(100, 208, 135, 0.035) 1px, transparent 1px, transparent 5px),
    rgba(5, 18, 11, 0.92);
  color: var(--muted-strong);
  padding: 16px;
  box-shadow: inset 0 0 24px rgba(100, 208, 135, 0.07);
}

.contact-dosi-bubble::before {
  content: "";
  position: absolute;
  top: -8px;
  right: 48px;
  width: 14px;
  height: 14px;
  border-top: 1px solid rgba(100, 208, 135, 0.42);
  border-left: 1px solid rgba(100, 208, 135, 0.42);
  background: rgba(5, 18, 11, 0.96);
  transform: rotate(45deg);
}

.contact-dosi-bubble p {
  position: relative;
  margin: 8px 0 0;
  font-size: 0.94rem;
  line-height: 1.55;
}

.guestbook-page {
  padding: 52px 0 70px;
}

.guestbook-hero {
  margin-bottom: 28px;
}

.guestbook-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.78fr);
  gap: 18px;
  align-items: start;
}

.guestbook-main {
  display: grid;
  gap: 22px;
}

.guestbook-form textarea {
  min-height: 220px;
}

.guestbook-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.guestbook-section-head h2 {
  margin: 0;
  font-size: clamp(1.7rem, 3vw, 2.7rem);
  line-height: 1;
}

.guestbook-section-head span {
  color: var(--green);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 1.3rem;
  font-weight: 900;
}

.guestbook-entry-list {
  display: grid;
  gap: 14px;
}

.guestbook-entry {
  position: relative;
  border: 1px solid rgba(100, 208, 135, 0.32);
  background:
    repeating-linear-gradient(180deg, rgba(100, 208, 135, 0.035) 0, rgba(100, 208, 135, 0.035) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, rgba(9, 24, 15, 0.95), rgba(17, 18, 20, 0.96));
  box-shadow:
    inset 0 0 0 1px rgba(100, 208, 135, 0.08),
    var(--shadow);
  padding: 18px;
}

.guestbook-entry::before {
  content: ">";
  position: absolute;
  top: 18px;
  right: 18px;
  color: var(--green);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-weight: 900;
}

.guestbook-entry h3 {
  margin: 5px 0 0;
  font-size: clamp(1.2rem, 2.2vw, 1.7rem);
  line-height: 1.1;
}

.guestbook-entry p {
  margin: 14px 0 0;
  color: var(--muted-strong);
  font-size: 1rem;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.guestbook-entry .guestbook-reply {
  border-left: 3px solid var(--green);
  background: rgba(100, 208, 135, 0.07);
  margin-top: 18px;
  padding: 12px 14px;
}

.guestbook-reply strong {
  color: var(--green);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.guestbook-entry .guestbook-reply p {
  margin-top: 7px;
}

.guestbook-dosi-card .contact-dosi-art img {
  object-position: center;
}

.links-page{width:min(1120px,calc(100% - 40px));margin:0 auto;padding:40px 0 64px}.links-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,420px);gap:40px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:34px}.links-hero h1{font-size:clamp(3rem,7vw,6rem);margin:.15em 0}.links-hero>div>p:last-child{color:var(--muted-strong);font-size:1.06rem;line-height:1.7;max-width:600px}.links-hero-art{position:relative;width:100%;max-width:420px;aspect-ratio:16/9;justify-self:end;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);overflow:hidden}.links-hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.links-hero-image-light{display:none}.links-hero-image-dark{display:block}:root[data-theme="light"] .links-hero-image-dark{display:none}:root[data-theme="light"] .links-hero-image-light{display:block}.links-list{display:grid;gap:14px;margin-top:30px}.links-card{display:flex;justify-content:space-between;align-items:center;gap:24px;border:1px solid var(--line);background:var(--panel);padding:22px;box-shadow:var(--shadow)}.links-card h2{margin:4px 0 8px;font-size:clamp(1.35rem,3vw,2rem)}.links-card p{margin:0;color:var(--muted-strong);line-height:1.6}.links-card .mini-label{color:var(--green);font-size:.76rem}.links-card .button{flex:0 0 auto}@media(max-width:800px){.links-hero{grid-template-columns:1fr}.links-hero-art{justify-self:start;max-width:380px}.links-card{align-items:flex-start;flex-direction:column}.links-card .button{width:100%}}

.imprint-shell {
  display: grid;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  gap: 24px;
  border-top: 1px solid var(--line);
  padding: 34px 0 46px;
}

.imprint-shell h2 {
  margin: 0;
  font-size: clamp(1.7rem, 4vw, 3rem);
  line-height: 1;
}

.imprint-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.imprint-grid div {
  border: 1px solid var(--line);
  background: var(--panel);
  padding: 16px;
}

.imprint-grid span {
  display: block;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.74rem;
  font-weight: 800;
  text-transform: uppercase;
}

.imprint-grid strong {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 1rem;
}

.imprint-grid a {
  color: var(--blue);
}

.noscript {
  position: fixed;
  right: 16px;
  bottom: 16px;
  left: 16px;
  border: 1px solid var(--danger);
  background: #1a1010;
  color: var(--text);
  padding: 16px;
  z-index: 10;
}

:root[data-theme="light"] .hero-panel,
:root[data-theme="light"] .terminal-card,
:root[data-theme="light"] .stats-panel,
:root[data-theme="light"] .metric-card,
:root[data-theme="light"] .youtube-copy,
:root[data-theme="light"] .video-card,
:root[data-theme="light"] .article-card,
:root[data-theme="light"] .release-card,
:root[data-theme="light"] .release-info-panel,
:root[data-theme="light"] .legal-panel,
:root[data-theme="light"] .about-panel,
:root[data-theme="light"] .team-card,
:root[data-theme="light"] .contact-form,
:root[data-theme="light"] .contact-side-panel,
:root[data-theme="light"] .guestbook-entry,
:root[data-theme="light"] .guestbook-form,
:root[data-theme="light"] .dosi-card,
:root[data-theme="light"] .dosi-bubble {
  background:
    repeating-linear-gradient(180deg, rgba(17, 20, 19, 0.025) 0, rgba(17, 20, 19, 0.025) 1px, transparent 1px, transparent 7px),
    var(--panel);
  box-shadow: var(--shadow);
}

:root[data-theme="light"] .release-feature-box {
  background:
    repeating-linear-gradient(180deg, rgba(200, 135, 19, 0.055) 0, rgba(200, 135, 19, 0.055) 1px, transparent 1px, transparent 6px),
    linear-gradient(135deg, rgba(200, 135, 19, 0.12), rgba(21, 120, 71, 0.08) 58%, rgba(255, 255, 255, 0.92)),
    var(--panel);
}

:root[data-theme="light"] .release-rating {
  border-color: rgba(200, 135, 19, 0.35);
  background: linear-gradient(105deg, rgba(200, 135, 19, 0.1), rgba(255, 255, 255, 0.74));
}

:root[data-theme="light"] .release-detail-image {
  border-color: rgba(200, 135, 19, 0.34);
  background:
    radial-gradient(circle at calc(100% - 34px) calc(100% - 19px), rgba(21, 120, 71, 0.9) 0 3px, rgba(21, 120, 71, 0.22) 4px 6px, transparent 7px),
    repeating-linear-gradient(90deg, rgba(99, 105, 98, 0.42) 0 2px, transparent 2px 7px) 18px calc(100% - 22px) / 88px 10px no-repeat,
    linear-gradient(180deg, transparent calc(100% - var(--monitor-bottom)), rgba(200, 135, 19, 0.08) calc(100% - var(--monitor-bottom)), rgba(124, 132, 124, 0.16) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(228, 232, 225, 0.88) 18%, rgba(207, 214, 208, 0.96)),
    linear-gradient(145deg, #ffffff, #d8ddd7);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    inset 0 0 0 5px rgba(255, 255, 255, 0.45),
    inset 0 -22px 26px rgba(124, 132, 124, 0.16),
    0 8px 0 rgba(190, 197, 189, 0.9),
    0 20px 52px rgba(26, 31, 32, 0.18);
}

:root[data-theme="light"] .release-detail-image::before {
  border-color: rgba(21, 120, 71, 0.22);
  background:
    radial-gradient(circle at 50% 44%, transparent 48%, rgba(17, 20, 19, 0.1) 100%),
    linear-gradient(115deg, rgba(255, 255, 255, 0.22), transparent 23%, transparent 75%, rgba(31, 98, 180, 0.08));
  box-shadow:
    inset 0 0 18px rgba(17, 20, 19, 0.2),
    inset 0 0 0 1px rgba(255, 255, 255, 0.62);
}

:root[data-theme="light"] .release-detail-image::after {
  background:
    repeating-linear-gradient(180deg, rgba(17, 20, 19, 0.035) 0, rgba(17, 20, 19, 0.035) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, rgba(21, 120, 71, 0.035), transparent 50%, rgba(200, 135, 19, 0.035));
  mix-blend-mode: multiply;
  opacity: 0.42;
}

:root[data-theme="light"] .release-detail-image img {
  background: #eef2ee;
  filter: saturate(1.04) contrast(1.02);
  box-shadow: 0 0 0 1px rgba(99, 105, 98, 0.24);
}

:root[data-theme="light"] .release-legal-note,
:root[data-theme="light"] .team-note {
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.055) 0, rgba(21, 120, 71, 0.055) 1px, transparent 1px, transparent 6px),
    rgba(229, 245, 234, 0.82);
}

:root[data-theme="light"] .release-keyfile-card {
  border-color: rgba(200, 135, 19, 0.34);
  background:
    radial-gradient(circle at 108px 54%, rgba(255, 116, 105, 0.14), transparent 31%),
    repeating-linear-gradient(180deg, rgba(200, 135, 19, 0.055) 0, rgba(200, 135, 19, 0.055) 1px, transparent 1px, transparent 6px),
    linear-gradient(105deg, rgba(255, 244, 218, 0.86), rgba(255, 255, 255, 0.78));
}

:root[data-theme="light"] .release-keyfile-visual {
  filter:
    drop-shadow(0 11px 17px rgba(26, 31, 32, 0.16))
    drop-shadow(0 0 11px rgba(255, 116, 105, 0.08));
}

:root[data-theme="light"] .release-keyfile-content .release-keyfile-optional {
  color: #6a6251;
}

:root[data-theme="light"] .team-command,
:root[data-theme="light"] .sync-line {
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.055) 0, rgba(21, 120, 71, 0.055) 1px, transparent 1px, transparent 6px),
    rgba(235, 249, 239, 0.92);
}

:root[data-theme="light"] .share-button {
  background:
    repeating-linear-gradient(180deg, rgba(200, 135, 19, 0.06) 0, rgba(200, 135, 19, 0.06) 1px, transparent 1px, transparent 5px),
    rgba(255, 255, 255, 0.92);
}

:root[data-theme="light"] .nav-links a:hover,
:root[data-theme="light"] .text-link:hover {
  background: rgba(17, 20, 19, 0.06);
}

:root[data-theme="light"] .site-footer {
  border-top-color: rgba(17, 20, 19, 0.1);
  color: #56605a;
}

:root[data-theme="light"] .site-footer a {
  color: #7b5812;
  text-shadow: none;
}

:root[data-theme="light"] .site-footer a:hover {
  color: #0d7148;
}

:root[data-theme="light"] input:not([type="checkbox"]),
:root[data-theme="light"] select,
:root[data-theme="light"] textarea {
  background: rgba(255, 255, 255, 0.95);
}

:root[data-theme="light"] .button-primary {
  border-color: rgba(200, 135, 19, 0.4);
  background: linear-gradient(180deg, #fff5d4, #ecc45d);
  color: #111413;
  box-shadow:
    0 10px 24px rgba(200, 135, 19, 0.13),
    inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

:root[data-theme="light"] .button-primary:hover {
  background: linear-gradient(180deg, #ffefbd, #dfae34);
}

:root[data-theme="light"] .button-ghost {
  background: rgba(255, 255, 255, 0.54);
}

:root[data-theme="light"] .social-logo {
  border-color: rgba(21, 35, 49, 0.22);
  background: rgba(255, 255, 255, 0.68);
  box-shadow: 0 7px 18px rgba(26, 31, 32, 0.08);
}

:root[data-theme="light"] .social-logo-x svg {
  fill: #15191d;
}

:root[data-theme="light"] .release-entry-button {
  border-color: rgba(183, 119, 15, 0.42);
  background: rgba(255, 249, 231, 0.78);
  box-shadow: inset 3px 0 0 #c88713;
  color: #6c4a0d;
}

:root[data-theme="light"] .release-entry-button:hover,
:root[data-theme="light"] .release-entry-button:focus-visible {
  border-color: rgba(183, 119, 15, 0.72);
  background: #fffaf0;
  box-shadow: 0 9px 22px rgba(90, 62, 13, 0.12), inset 3px 0 0 #c88713;
  color: #4f3508;
}

:root[data-theme="light"] .social-logo:hover,
:root[data-theme="light"] .social-logo:focus-visible {
  border-color: rgba(183, 119, 15, 0.52);
  background: #ffffff;
  box-shadow: 0 9px 22px rgba(26, 31, 32, 0.12), inset 0 -2px 0 rgba(200, 135, 19, 0.38);
}

:root[data-theme="light"] .hero-art {
  border-color: rgba(200, 135, 19, 0.34);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.1) 48%, rgba(244, 246, 242, 0.78) 78%),
    var(--hero-light, url("hero-reversing-anime-white-v1.jpg")) center / cover no-repeat;
  box-shadow:
    0 22px 60px rgba(26, 31, 32, 0.16),
    inset 0 0 0 1px rgba(255, 255, 255, 0.48);
}

:root[data-theme="light"] .hero-art::before {
  background:
    repeating-linear-gradient(0deg, rgba(17, 20, 19, 0.045) 0, rgba(17, 20, 19, 0.045) 1px, transparent 1px, transparent 7px),
    radial-gradient(circle at 72% 44%, rgba(31, 98, 180, 0.08), transparent 30%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(244, 246, 242, 0.32));
  mix-blend-mode: multiply;
  opacity: 0.46;
}

:root[data-theme="light"] .hero-art::after {
  border-color: rgba(200, 135, 19, 0.18);
}

:root[data-theme="light"] .hero-brand-card {
  border-color: rgba(200, 135, 19, 0.34);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(244, 246, 242, 0.72));
  box-shadow:
    0 18px 42px rgba(26, 31, 32, 0.18),
    inset 0 0 0 1px rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(8px);
}

:root[data-theme="light"] .hero-brand-title {
  color: #111413;
  text-shadow: none;
}

:root[data-theme="light"] .hero-brand-subtitle {
  color: var(--gold);
  text-shadow: none;
}

:root[data-theme="light"] .hero-brand-line {
  color: rgba(46, 51, 47, 0.8);
}

:root[data-theme="light"] .hub-dosi-image {
  filter:
    drop-shadow(0 14px 19px rgba(26, 31, 32, 0.16))
    drop-shadow(0 0 12px rgba(21, 120, 71, 0.08));
}

:root[data-theme="light"] .hero-side .hub-dosi-card .hub-dosi-quote {
  color: #315247;
}

:root[data-theme="light"] .bmc-widget-dock {
  border-color: rgba(200, 135, 19, 0.32);
  background: rgba(255, 255, 255, 0.82);
  box-shadow:
    0 16px 34px rgba(26, 31, 32, 0.16),
    inset 0 0 0 1px rgba(255, 255, 255, 0.64);
  backdrop-filter: blur(6px);
}

:root[data-theme="light"] .bmc-widget-dock::before {
  color: var(--gold-soft);
  text-shadow: none;
}

:root[data-theme="light"] .bmc-support-button {
  border-color: rgba(151, 102, 14, .42);
  background:
    repeating-linear-gradient(180deg, rgba(151, 102, 14, .035) 0, rgba(151, 102, 14, .035) 1px, transparent 1px, transparent 6px),
    linear-gradient(145deg, #fffdf8, #f3efe5);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72), 0 9px 20px rgba(26, 31, 32, .14);
  color: #80580d;
}

:root[data-theme="light"] .bmc-support-button:hover,
:root[data-theme="light"] .bmc-support-button:focus-visible {
  border-color: var(--green);
  color: var(--green);
}

:root[data-theme="light"] .about-art {
  border-color: rgba(200, 135, 19, 0.28);
  background:
    repeating-linear-gradient(180deg, rgba(200, 135, 19, 0.04) 0, rgba(200, 135, 19, 0.04) 1px, transparent 1px, transparent 7px),
    #fffaf0;
  box-shadow:
    0 18px 42px rgba(26, 31, 32, 0.14),
    inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

:root[data-theme="light"] .about-art::before {
  background:
    repeating-linear-gradient(0deg, rgba(17, 20, 19, 0.032) 0, rgba(17, 20, 19, 0.032) 1px, transparent 1px, transparent 7px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.14) 62%, rgba(255, 255, 255, 0.36));
}

:root[data-theme="light"] .about-art::after {
  border-color: rgba(200, 135, 19, 0.18);
}

:root[data-theme="light"] .about-art-label {
  border-color: rgba(200, 135, 19, 0.34);
  background: rgba(255, 255, 255, 0.82);
  color: #8a5b08;
}

:root[data-theme="light"] .about-art-image-dark {
  display: none;
}

:root[data-theme="light"] .about-art-image-light {
  display: block;
}

:root[data-theme="light"] .release-card-image::after,
:root[data-theme="light"] .contact-dosi-art::after {
  background:
    repeating-linear-gradient(0deg, rgba(17, 20, 19, 0.035) 0, rgba(17, 20, 19, 0.035) 1px, transparent 1px, transparent 7px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(244, 246, 242, 0.12));
}

:root[data-theme="light"] .terminal-panel {
  border-color: rgba(21, 120, 71, 0.34);
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.048) 0, rgba(21, 120, 71, 0.048) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, rgba(245, 252, 247, 0.96), rgba(255, 255, 255, 0.98));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    var(--shadow);
}

:root[data-theme="light"] .hero-panel {
  border-color: rgba(21, 120, 71, 0.28);
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.035) 0, rgba(21, 120, 71, 0.035) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 248, 244, 0.94));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    0 22px 56px rgba(26, 31, 32, 0.13);
}

:root[data-theme="light"] .hero-panel::before {
  color: rgba(21, 120, 71, 0.82);
  text-shadow: none;
}

:root[data-theme="light"] .hero-panel::after {
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.04) 0, rgba(21, 120, 71, 0.04) 1px, transparent 1px, transparent 5px),
    radial-gradient(circle at 20% 15%, rgba(21, 120, 71, 0.08), transparent 30%);
  opacity: 0.58;
}

:root[data-theme="light"] .metric + .metric {
  border-top-color: rgba(21, 120, 71, 0.22);
}

:root[data-theme="light"] .metric-value {
  color: #173323;
  font-weight: 800;
  text-shadow: none;
}

:root[data-theme="light"] .metric-label {
  color: rgba(21, 120, 71, 0.82);
}

:root[data-theme="light"] .metric-label::before,
:root[data-theme="light"] .metric-label::after {
  color: rgba(21, 120, 71, 0.58);
}

:root[data-theme="light"] .sync-line {
  border-color: rgba(21, 120, 71, 0.28);
  color: #0d6a3c;
  text-shadow: none;
}

:root[data-theme="light"] .team-hero {
  border: 1px solid rgba(200, 135, 19, 0.22);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(244, 246, 242, 0.72)),
    repeating-linear-gradient(180deg, rgba(17, 20, 19, 0.025) 0, rgba(17, 20, 19, 0.025) 1px, transparent 1px, transparent 7px);
  box-shadow: var(--shadow);
  padding: 28px;
}

:root[data-theme="light"] .team-art {
  width: min(100%, 720px);
  border: 1px solid rgba(200, 135, 19, 0.28);
  background: #fff;
  box-shadow:
    0 18px 42px rgba(26, 31, 32, 0.13),
    inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

:root[data-theme="light"] .team-art::after {
  background:
    repeating-linear-gradient(0deg, rgba(17, 20, 19, 0.035) 0, rgba(17, 20, 19, 0.035) 1px, transparent 1px, transparent 7px),
    linear-gradient(180deg, transparent 62%, rgba(244, 246, 242, 0.34));
}

:root[data-theme="light"] .team-art-image-dark {
  display: none;
}

:root[data-theme="light"] .team-art-image-light {
  display: block;
}

:root[data-theme="light"] .team-card {
  border-color: rgba(200, 135, 19, 0.24);
  background:
    repeating-linear-gradient(180deg, rgba(17, 20, 19, 0.022) 0, rgba(17, 20, 19, 0.022) 1px, transparent 1px, transparent 7px),
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(243, 247, 244, 0.94));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    var(--shadow);
}

:root[data-theme="light"] .team-card::before {
  border-top-color: rgba(21, 120, 71, 0.32);
}

:root[data-theme="light"] .team-avatar {
  border-color: rgba(200, 135, 19, 0.38);
  background:
    radial-gradient(circle at 35% 28%, rgba(200, 135, 19, 0.18), transparent 46%),
    linear-gradient(180deg, #ffffff, #eef2ee);
  color: var(--gold-soft);
  text-shadow: 0 0 12px rgba(200, 135, 19, 0.18);
}

:root[data-theme="light"] .team-specs div {
  border-top-color: rgba(17, 20, 19, 0.12);
}

:root[data-theme="light"] .dosi-card {
  border-color: rgba(200, 135, 19, 0.26);
  background:
    radial-gradient(circle at 16% 22%, rgba(31, 98, 180, 0.1), transparent 28%),
    repeating-linear-gradient(180deg, rgba(17, 20, 19, 0.024) 0, rgba(17, 20, 19, 0.024) 1px, transparent 1px, transparent 7px),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(238, 245, 241, 0.96));
}

:root[data-theme="light"] .dosi-card::before {
  border-color: rgba(21, 120, 71, 0.24);
  background:
    radial-gradient(circle at 50% 18%, rgba(21, 120, 71, 0.11), transparent 36%),
    rgba(255, 255, 255, 0.32);
}

:root[data-theme="light"] .dosi-card::after {
  color: rgba(200, 135, 19, 0.1);
}

:root[data-theme="light"] .dosi-mascot {
  filter:
    drop-shadow(0 14px 22px rgba(26, 31, 32, 0.16))
    drop-shadow(0 0 12px rgba(21, 120, 71, 0.08));
}

:root[data-theme="light"] .dosi-bubble {
  border-color: rgba(21, 120, 71, 0.34);
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.045) 0, rgba(21, 120, 71, 0.045) 1px, transparent 1px, transparent 6px),
    rgba(255, 255, 255, 0.95);
  box-shadow: inset 0 0 24px rgba(21, 120, 71, 0.045);
}

:root[data-theme="light"] .dosi-bubble::before {
  border-left-color: rgba(21, 120, 71, 0.34);
  border-bottom-color: rgba(21, 120, 71, 0.34);
  background: rgba(255, 255, 255, 0.96);
}

:root[data-theme="light"] .dosi-subtitle {
  color: rgba(131, 87, 8, 0.72);
}

:root[data-theme="light"] .contact-dosi-card {
  border-color: rgba(200, 135, 19, 0.26);
  background:
    linear-gradient(180deg, rgba(200, 135, 19, 0.07), rgba(255, 255, 255, 0) 46%),
    rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow);
}

:root[data-theme="light"] .contact-dosi-art {
  background: #fff;
}

:root[data-theme="light"] .contact-dosi-image-dark {
  display: none;
}

:root[data-theme="light"] .contact-dosi-image-light {
  display: block;
  filter: saturate(0.98) contrast(1.01);
}

:root[data-theme="light"] .contact-dosi-bubble {
  border-color: rgba(21, 120, 71, 0.34);
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.045) 0, rgba(21, 120, 71, 0.045) 1px, transparent 1px, transparent 6px),
    rgba(255, 255, 255, 0.96);
  box-shadow: inset 0 0 20px rgba(21, 120, 71, 0.045);
}

:root[data-theme="light"] .contact-dosi-bubble::before {
  border-top-color: rgba(21, 120, 71, 0.34);
  border-left-color: rgba(21, 120, 71, 0.34);
  background: rgba(255, 255, 255, 0.96);
}

:root[data-theme="light"] .guestbook-entry {
  border-color: rgba(21, 120, 71, 0.28);
  background:
    repeating-linear-gradient(180deg, rgba(21, 120, 71, 0.045) 0, rgba(21, 120, 71, 0.045) 1px, transparent 1px, transparent 6px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(241, 247, 243, 0.96));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    var(--shadow);
}

:root[data-theme="light"] .guestbook-entry::before {
  color: var(--green);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  clip-path: inset(50%);
}

@media (max-width: 820px) {
  .topbar,
  .intro-band,
  .section-heading,
  .imprint-shell,
  .site-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .site-footer p:last-child {
    text-align: left;
    white-space: normal;
  }

  .topbar {
    gap: 14px;
  }

  .nav-links {
    justify-content: flex-start;
  }

  .nav-tools {
    align-items: flex-start;
    flex-direction: column;
    min-height: 88px;
    padding-right: 60px;
    width: 100%;
  }

  .language-select {
    width: 54px;
    min-width: 54px;
    height: 96px;
    margin-top: -16px;
  }

  .language-select select {
    width: 1px;
  }

  .language-flag-cord {
    height: 42px;
  }

  .language-flag-pin {
    top: 36px;
  }

  .language-flag-crossbar {
    width: 42px;
    top: 46px;
  }

  .language-flag-cloth {
    top: 49px;
    width: 40px;
    height: 50px;
  }

  .theme-toggle {
    top: -16px;
    width: 48px;
    height: 96px;
  }

  .theme-lamp-cord {
    height: 46px;
  }

  .theme-lamp-shade {
    top: 40px;
    width: 40px;
    height: 26px;
  }

  .theme-lamp-bulb {
    top: 62px;
    width: 15px;
    height: 15px;
  }

  .theme-lamp-glow {
    top: 59px;
    width: 64px;
    height: 56px;
  }

  .theme-lamp-pull {
    top: 68px;
    left: calc(50% + 18px);
    height: 20px;
  }

  .hero {
    grid-template-columns: 1fr;
    min-height: auto;
    padding: 38px 0 42px;
  }

  .hero-side {
    align-self: stretch;
  }

  .hero-panel {
    width: 100%;
  }

  .toolbar {
    grid-template-columns: 1fr;
  }

  .youtube-feature {
    grid-template-columns: 1fr;
  }

  .imprint-shell {
    grid-template-columns: 1fr;
  }

  .imprint-grid {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .legal-grid {
    grid-template-columns: 1fr;
  }

  .team-grid {
    grid-template-columns: 1fr;
  }

  .contact-grid,
  .guestbook-grid {
    grid-template-columns: 1fr;
  }

  .legal-panel.is-wide {
    grid-column: auto;
  }

  .about-grid {
    grid-template-columns: 1fr;
  }

  .release-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .release-type-filter {
    align-items: flex-start;
    flex-direction: column;
  }

  .release-type-filter > p {
    align-self: flex-end;
  }

  .release-detail-hero,
  .release-info-grid {
    grid-template-columns: 1fr;
  }

  .release-detail h1 {
    max-width: 100%;
    font-size: clamp(1.65rem, 7vw, 2.6rem);
  }

  .about-hero {
    grid-template-columns: 1fr;
    grid-template-areas:
      "eyebrow"
      "art"
      "lede";
    gap: 14px;
    align-items: start;
  }

  .about-art {
    justify-self: start;
    width: min(100%, 560px);
    height: 315px;
  }

  .about-panel-wide {
    grid-column: auto;
  }
}

@media (max-width: 480px) {
  .site-header,
  main,
  .site-footer {
    width: min(var(--max), calc(100% - 22px));
  }

  .topbar {
    padding-top: 14px;
  }

  .brand img {
    width: 44px;
    height: 44px;
  }

  .nav-links a {
    padding: 8px 9px;
  }

  .language-select:not(.language-flag-select) {
    width: 100%;
  }

  .youtube-shell {
    padding-top: 34px;
  }

  .video-grid {
    grid-template-columns: 1fr;
  }

  .hero {
    gap: 10px;
    padding: 14px 0 14px;
  }

  .about-hero {
    padding: 38px 0 24px;
  }

  .about-hero h1 {
    font-size: clamp(2.55rem, 14vw, 3.2rem);
    line-height: 0.94;
  }

  .about-art {
    aspect-ratio: auto;
    width: 100%;
    height: 210px;
    min-height: 210px;
  }

  .about-art::before,
  .about-art::after {
    inset: 7px;
  }

  .about-art-image {
    inset: 7px;
    width: calc(100% - 14px);
    height: calc(100% - 14px);
  }

  .about-art-label {
    right: 13px;
    bottom: 13px;
    font-size: 0.55rem;
    padding: 7px 8px;
  }

  .about-lede {
    margin-top: 0;
    font-size: 0.96rem;
  }

  .about-grid {
    gap: 12px;
    padding-bottom: 44px;
  }

  .team-page {
    padding: 28px 0 46px;
  }

  .team-hero h1 {
    font-size: clamp(2.7rem, 16vw, 4.2rem);
  }

  .team-card {
    padding: 16px;
  }

  .team-card-header {
    grid-template-columns: 1fr;
  }

  .team-avatar {
    width: 76px;
    height: 76px;
    font-size: 1.35rem;
  }

  .release-index-hero,
  .release-detail {
    padding: 34px 0 22px;
  }

  .release-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    padding-bottom: 44px;
  }

  .release-type-filter-links,
  .release-type-filter-link {
    width: 100%;
  }

  .release-type-filter-link {
    justify-content: space-between;
  }

  .release-card-body,
  .release-info-panel {
    padding: 15px;
  }

  .release-detail-image {
    --monitor-pad: 7px;
    --monitor-bottom: 24px;
    --monitor-screen-radius: 5px;
    aspect-ratio: 16 / 9.8;
    border-radius: 10px 10px 18px 18px;
  }

  .dosi-card {
    /* The transparent mascot canvas is taller than it is wide. Keep the
       complete figure inside the mobile header field rather than letting its
       feet intrude into the speech-bubble notch. */
    --dosi-size: 66px;
    --dosi-lane: 0px;
    min-height: 0;
    padding: 108px 12px 38px;
  }

  .dosi-card::before {
    top: 12px;
    right: 12px;
    bottom: auto;
    left: 12px;
    width: auto;
    height: 82px;
  }

  .dosi-mascot {
    position: absolute;
    top: 15px;
    left: 22px;
    z-index: 2;
    width: var(--dosi-size);
  }

  .dosi-bubble {
    min-height: 0;
    padding: 11px 12px;
  }

  .dosi-bubble::before {
    top: -9px;
    bottom: auto;
    left: 34px;
    transform: rotate(135deg);
  }

  .dosi-bubble p {
    font-size: 0.9rem;
  }

  .release-detail h1 {
    font-size: clamp(1.45rem, 8vw, 2.05rem);
    line-height: 1.08;
  }

  .release-actions,
  .release-actions .button {
    width: 100%;
  }

  .release-keyfile-card {
    grid-template-columns: 1fr;
    gap: 3px;
    min-height: 0;
    padding: 8px 12px 13px;
    background:
      radial-gradient(circle at 50% 54px, rgba(255, 116, 105, 0.13), transparent 30%),
      repeating-linear-gradient(180deg, rgba(239, 189, 79, 0.035) 0, rgba(239, 189, 79, 0.035) 1px, transparent 1px, transparent 6px),
      linear-gradient(105deg, rgba(239, 189, 79, 0.075), rgba(10, 11, 13, 0.42));
  }

  .release-keyfile-visual {
    width: min(210px, 72vw);
    aspect-ratio: 9 / 5;
    align-self: auto;
    justify-self: center;
    margin: -2px 0 1px;
  }

  .release-keyfile-content h2 {
    margin-bottom: 5px;
    font-size: 0.96rem;
  }

  .release-keyfile-content p {
    font-size: 0.8rem;
    line-height: 1.4;
  }

  .release-keyfile-content .release-keyfile-optional {
    margin-top: 6px;
    font-size: 0.59rem;
  }

  .release-keyfile-button {
    width: 100%;
    margin-top: 10px;
  }

  :root[data-theme="light"] .release-keyfile-card {
    background:
      radial-gradient(circle at 50% 54px, rgba(255, 116, 105, 0.14), transparent 30%),
      repeating-linear-gradient(180deg, rgba(200, 135, 19, 0.055) 0, rgba(200, 135, 19, 0.055) 1px, transparent 1px, transparent 6px),
      linear-gradient(105deg, rgba(255, 244, 218, 0.86), rgba(255, 255, 255, 0.78));
  }

  .about-panel {
    padding: 16px;
  }

  .about-actions,
  .about-actions .button {
    width: 100%;
  }

  .eyebrow {
    margin-bottom: 8px;
    font-size: 0.7rem;
  }

  h1 {
    font-size: clamp(2.55rem, 14vw, 3.2rem);
    line-height: 0.94;
  }

  .lede {
    margin-top: 10px;
    font-size: 0.94rem;
  }

  .hero-art {
    min-height: 208px;
    background-position: 37% center;
  }

  .hero-brand-card {
    grid-template-columns: 50px minmax(0, 1fr);
    width: calc(100% - 22px);
    margin: 11px;
    padding: 10px;
  }

  .hero-brand-card img {
    width: 50px;
    height: 50px;
  }

  .hero-brand-title {
    font-size: 1.58rem;
  }

  .hero-brand-subtitle {
    font-size: 1.06rem;
  }

  .hero-brand-line {
    margin-top: 6px;
    font-size: 0.5rem;
  }

  .bmc-widget-dock {
    top: 10px;
    right: 10px;
    gap: 7px;
    min-height: 68px;
    padding: 6px 7px;
  }

  .bmc-widget-dock::before {
    font-size: 0.54rem;
  }

  .bmc-support-button {
    width: 52px;
    height: 52px;
  }

  .bmc-support-button svg {
    width: 28px;
    height: 28px;
  }

  .hero-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
  }

  .hero-actions {
    width: 100%;
  }

  .button {
    min-width: 0;
    min-height: 40px;
    padding: 9px 8px;
    font-size: 0.82rem;
    white-space: nowrap;
  }

  .hub-dosi-card {
    gap: 7px;
    min-height: 0;
    padding: 0;
  }

  .hero-side .hub-dosi-card .hub-dosi-quote {
    width: min(100%, 330px);
    font-size: 0.66rem;
    line-height: 1.42;
    padding: 0 4px;
  }

  .hub-dosi-source {
    width: min(100%, 330px);
    font-size: 0.53rem;
  }

  .hub-dosi-stage {
    width: 150px;
    min-height: 136px;
  }

  .hub-dosi-image {
    width: 138px;
  }

  .hub-dosi-dark-hole {
    bottom: 22px;
    width: 164px;
  }

  .hero-panel {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 32px 12px 12px;
  }

  .hero-panel::before {
    top: 10px;
    right: 12px;
    left: 12px;
    font-size: 0.58rem;
  }

  .metric + .metric {
    margin-top: 0;
    border-top: 0;
    border-left: 1px dashed rgba(100, 208, 135, 0.32);
    padding-top: 0;
    padding-left: 12px;
  }

  .metric-value {
    font-size: 1.32rem;
  }

  .metric-label {
    font-size: 0.68rem;
  }

  .sync-line {
    grid-column: 1 / -1;
    margin-top: 0;
    padding: 8px 10px;
    font-size: 0.62rem;
  }

  .article-grid {
    grid-template-columns: 1fr;
  }
}
/* Integrated DOSGAME blog */
.home-blog-shell,.blog-hero,.blog-grid,.blog-post{width:min(1220px,calc(100% - 32px));margin-inline:auto}.home-blog-shell{padding:56px 0 12px}.blog-hero{padding:72px 0 32px}.blog-hero h1,.blog-post h1{font-size:clamp(2.4rem,7vw,5.8rem);max-width:1000px}.blog-hero>p:last-child{max-width:760px;color:var(--muted-strong);font-size:1.08rem}.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:18px 0 72px}.blog-grid-home{width:100%;padding-bottom:42px}.blog-card{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);min-width:0}.blog-card>a{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}.blog-card-image{aspect-ratio:1200/430;overflow:hidden;background:#08090a}.blog-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .25s ease}.blog-card:hover img{transform:scale(1.025)}.blog-card-body{display:flex;flex-direction:column;gap:12px;padding:20px;height:100%}.blog-card h2,.blog-card h3{font-size:clamp(1.35rem,2.4vw,2rem);margin:0}.blog-card-body>p{color:var(--muted-strong);margin:0}.blog-author{display:flex;align-items:center;gap:9px;color:var(--muted)}.blog-author img,.blog-author>span{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid rgba(100,208,135,.45)}.blog-author>span{display:grid;place-items:center;background:rgba(100,208,135,.13);color:var(--green);font-weight:900}.blog-author strong{color:var(--text);font-size:.86rem}.blog-author time{font-size:.78rem;margin-left:auto}.blog-post{max-width:920px;padding:68px 0 88px}.blog-post-header{margin-bottom:32px}.blog-post-excerpt{font-size:1.2rem;color:var(--muted-strong);max-width:780px}.blog-author-large{margin-top:24px}.blog-author-large img,.blog-author-large>span{width:52px;height:52px}.blog-author-large div{display:grid}.blog-author-large small{color:var(--muted)}.blog-author-large time{margin:2px 0 0}.blog-cover{display:block;width:100%;height:100%;max-height:none;aspect-ratio:1200/630;object-fit:cover;border:0;margin:0;box-shadow:none}.blog-content{font-size:1.08rem;line-height:1.78;color:var(--text)}.blog-content h2,.blog-content h3,.blog-content h4{margin:2em 0 .65em}.blog-content p,.blog-content ul,.blog-content ol,.blog-content blockquote,.blog-content pre{margin:0 0 1.35em}.blog-content img{display:block;max-width:100%;height:auto;margin:24px auto}.blog-content blockquote{border-left:4px solid var(--gold);background:rgba(239,189,79,.07);padding:14px 20px}.blog-content pre{overflow:auto;background:#08090a;color:var(--green);padding:18px}.blog-post-footer{border-top:1px solid var(--line);margin-top:48px;padding-top:24px}
@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.blog-grid{grid-template-columns:1fr}.home-blog-shell,.blog-hero,.blog-grid,.blog-post{width:min(100% - 22px,1220px)}.home-blog-shell{padding-top:38px}.blog-post{padding-top:42px}.blog-author time{margin-left:0}.blog-card-body{padding:17px}}

/* Framed long-form blog article */
.blog-post{max-width:1050px}.blog-post-panel{position:relative;border:1px solid var(--line);background:linear-gradient(145deg,rgba(239,189,79,.045),transparent 34%),var(--panel);box-shadow:var(--shadow);padding:clamp(26px,5vw,64px);overflow:hidden}.blog-post-panel::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,var(--gold),var(--green),transparent 86%)}.blog-post-panel::after{content:"DOSGAME.AT // ARTICLE";position:absolute;top:14px;right:18px;color:var(--muted);font-family:"Lucida Console","Cascadia Mono","Courier New",ui-monospace,monospace;font-size:.62rem;letter-spacing:.12em}.blog-post-header{position:relative;isolation:isolate;max-width:820px;margin:0 auto 38px;padding:10px 0 30px;border-bottom:1px solid var(--line)}.blog-post-header::before{position:absolute;z-index:-1;top:20px;right:0;width:116px;height:116px;background:url("/assets/journal-feather.svg") center/contain no-repeat;content:"";opacity:.12;pointer-events:none}.blog-post-header>.eyebrow{display:inline-flex;align-items:center;gap:10px;margin-bottom:18px;color:var(--green)}.blog-post-header>.eyebrow::after{display:block;width:54px;height:1px;background:linear-gradient(90deg,var(--green),transparent);content:""}.blog-post-header .blog-entry-title{position:relative;max-width:780px;margin:0;padding:0 0 24px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:clamp(3.4rem,7vw,5.25rem);font-weight:900;line-height:.96;letter-spacing:-.048em;text-transform:none;text-shadow:none;text-wrap:balance;overflow-wrap:normal;word-break:normal;hyphens:auto}.blog-post-header .blog-entry-title::after{position:absolute;bottom:0;left:0;width:clamp(92px,16vw,150px);height:3px;background:linear-gradient(90deg,var(--gold),var(--green));content:""}.blog-post-header .blog-entry-title.blog-title-medium{font-size:clamp(3rem,6vw,4.5rem)}.blog-post-header .blog-entry-title.blog-title-long{font-size:clamp(2.65rem,5.2vw,3.85rem)}.blog-content{max-width:780px;margin:0 auto}.blog-post-footer{max-width:780px;margin:48px auto 0}
.blog-cover-frame{position:relative;width:min(100%,720px);margin:28px auto 44px;padding:12px 12px 0;border:1px solid rgba(239,189,79,.42);background:linear-gradient(135deg,rgba(239,189,79,.08),transparent 36%),linear-gradient(315deg,rgba(100,208,135,.06),transparent 38%),var(--panel);box-shadow:0 22px 46px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.025)}.blog-cover-frame::before{position:absolute;z-index:2;top:-1px;left:12px;width:clamp(90px,24%,170px);height:3px;background:linear-gradient(90deg,var(--gold),var(--green));content:""}.blog-cover-frame::after{position:absolute;inset:7px;z-index:2;border:1px solid rgba(239,189,79,.12);content:"";pointer-events:none}.blog-cover-viewport{position:relative;overflow:hidden;border:1px solid rgba(239,189,79,.32);background:#070908;box-shadow:inset 0 0 0 4px rgba(7,9,8,.82)}.blog-cover-viewport::after{position:absolute;inset:0;background:repeating-linear-gradient(180deg,transparent 0,transparent 3px,rgba(255,255,255,.018) 4px);content:"";pointer-events:none}.blog-cover-frame figcaption{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0;padding:10px 4px 11px;color:var(--muted);font-family:"Lucida Console","Cascadia Mono","Courier New",ui-monospace,monospace;font-size:.62rem;font-weight:700;letter-spacing:.11em;line-height:1.2}.blog-cover-frame figcaption span:first-child{color:var(--gold)}.blog-cover-frame figcaption span:last-child{color:var(--green)}
:root[data-theme="light"] .blog-cover-frame{background:linear-gradient(135deg,rgba(184,122,17,.08),transparent 36%),linear-gradient(315deg,rgba(24,126,75,.055),transparent 38%),#f6f4ed;box-shadow:0 20px 42px rgba(32,38,35,.14),inset 0 0 0 1px rgba(255,255,255,.7)}
.blog-content figure{margin:2rem 0}.blog-content figure img{margin:0 auto}.blog-content figcaption{color:var(--muted);font-size:.88rem;line-height:1.5;margin-top:.65rem;text-align:center}.blog-related-releases{max-width:780px;margin:52px auto 0;padding-top:30px;border-top:1px solid var(--line)}.blog-related-releases h2{font-size:clamp(1.5rem,3vw,2.25rem);margin:.25rem 0 20px}.blog-related-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.blog-related-card{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;align-items:center;border:1px solid var(--line);background:var(--panel);color:inherit;text-decoration:none;padding:12px;transition:border-color .2s ease,transform .2s ease}.blog-related-card:hover{border-color:var(--green);transform:translateY(-2px)}.blog-related-card img{width:92px;height:64px;object-fit:cover;background:#08090a}.blog-related-card span{min-width:0}.blog-related-card strong,.blog-related-card small{display:block}.blog-related-card strong{overflow-wrap:anywhere}.blog-related-card small{color:var(--muted);margin-top:4px}.blog-related-card b{grid-column:2;color:var(--green);font-size:.78rem}@media(max-width:680px){.blog-related-grid{grid-template-columns:1fr}}

/* Compact, responsive long-form content created by the CMS editor. */
.blog-content{line-height:1.66}
.blog-content h2,.blog-content h3,.blog-content h4{margin:1.55em 0 .55em}
.blog-content p,.blog-content ul,.blog-content ol,.blog-content blockquote,.blog-content pre{margin-bottom:.9em}
.blog-content img{margin-top:18px;margin-bottom:18px}
.blog-content .blog-layout{display:grid;gap:clamp(12px,2.5vw,24px);margin:1.1em 0}
.blog-content .blog-layout-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.blog-content .blog-layout-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.blog-content .blog-cell{min-width:0}
.blog-content .blog-cell>:last-child{margin-bottom:0}
.blog-content table{width:100%;margin:1.2em 0;border-collapse:collapse;border:1px solid var(--line);font-size:.96em}
.blog-content caption{padding:0 0 .55em;color:var(--muted);font-size:.9em;text-align:left}
.blog-content th,.blog-content td{border:1px solid var(--line);padding:.65em .75em;text-align:left;vertical-align:top}
.blog-content th{background:rgba(239,189,79,.1);color:var(--text);font-weight:900}
.blog-content tbody tr:nth-child(even){background:rgba(100,208,135,.035)}
.blog-content .blog-table-compact th,.blog-content .blog-table-compact td{padding:.4em .55em}
.blog-content figure{max-width:100%;margin:1.2rem auto}
.blog-content figure img{width:100%;margin:0 auto}
.blog-content .blog-image-size-25{width:25%}
.blog-content .blog-image-size-33{width:33%}
.blog-content .blog-image-size-50{width:50%}
.blog-content .blog-image-size-66{width:66%}
.blog-content .blog-image-size-75{width:75%}
.blog-content .blog-image-size-100{width:100%}
.blog-content .blog-image-align-left{margin-left:0;margin-right:auto}
.blog-content .blog-image-align-center{margin-left:auto;margin-right:auto}
.blog-content .blog-image-align-right{margin-left:auto;margin-right:0}
.blog-content::after{display:table;clear:both;content:""}
.blog-content .blog-image-wrap-left,.blog-content .blog-image-wrap-right{max-width:55%;margin-top:.35em;margin-bottom:.8em}
.blog-content .blog-image-wrap-left{float:left;margin-right:1.5em;margin-left:0}
.blog-content .blog-image-wrap-right{float:right;margin-right:0;margin-left:1.5em}
.blog-content .blog-clear{clear:both;height:0}
.blog-content figure,.blog-content>img{border:1px solid var(--line);background:var(--panel);box-shadow:0 12px 28px rgba(9,16,13,.09)}
.blog-content figure img{border:0;box-shadow:none}
.blog-card-image-default{background:linear-gradient(135deg,rgba(239,189,79,.08),rgba(100,208,135,.06)),var(--panel)}
.blog-card-image-default img{object-position:center 45%}

/* The shared journal artwork is composed at 1200×630: never crop it into the banner ratio. */
.blog-card-image-default{aspect-ratio:1200/630}
.blog-card-image-default img{object-fit:contain;object-position:center}
.blog-search-shell{width:min(1220px,calc(100% - 32px));margin:0 auto;padding:12px 0 0}
.blog-search-shell h2{margin:.2rem 0 0;font-size:clamp(1.55rem,3vw,2.35rem)}
.blog-search-toolbar{grid-template-columns:minmax(0,1fr);margin:18px 0 22px}
.blog-search-shell+.blog-grid{padding-top:0}
.blog-search-empty{width:min(1220px,calc(100% - 32px));margin:-48px auto 72px}
.blog-card[hidden]{display:none}
@media(max-width:680px){
  .blog-content{font-size:1rem;line-height:1.62}
  .blog-content .blog-layout-2,.blog-content .blog-layout-3{grid-template-columns:1fr}
  .blog-content .blog-image-size-25,.blog-content .blog-image-size-33,.blog-content .blog-image-size-50,.blog-content .blog-image-size-66,.blog-content .blog-image-size-75{width:100%}
  .blog-content .blog-image-wrap-left,.blog-content .blog-image-wrap-right{float:none;width:100%;max-width:100%;margin:1.1rem auto}
  .blog-content table{display:block;max-width:100%;overflow-x:auto;white-space:normal}
  .blog-cover-frame{margin:18px auto 30px;padding:7px 7px 0}
  .blog-cover-frame::before{left:7px}
  .blog-cover-frame::after{inset:4px}
  .blog-cover-frame figcaption{padding:8px 2px 9px;font-size:.55rem;letter-spacing:.07em}
  .blog-search-shell,.blog-search-empty{width:min(100% - 22px,1220px)}
  .blog-search-shell .section-heading{align-items:flex-start}
}

.release-related {
  position: relative;
  margin: 34px 0 78px;
  padding-top: 34px;
  border-top: 1px solid var(--line);
}

.release-related::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  width: 112px;
  height: 2px;
  background: linear-gradient(90deg, var(--gold), var(--green), transparent);
}

.release-related-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 20px;
}

.release-related-header .eyebrow {
  margin: 0 0 8px;
}

.release-related-header h2 {
  margin: 0;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(1.65rem, 3vw, 2.55rem);
  line-height: 1.05;
  text-transform: uppercase;
}

.release-related-header p:last-child {
  max-width: 700px;
  margin: 10px 0 0;
  color: var(--muted-strong);
}

.release-related-controls {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

.release-related-controls button {
  display: grid;
  width: 46px;
  height: 46px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--text);
  cursor: pointer;
  font: 800 1.2rem/1 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  place-items: center;
  transition: border-color .18s ease, color .18s ease, background-color .18s ease;
}

.release-related-controls button:hover:not(:disabled),
.release-related-controls button:focus-visible {
  border-color: var(--gold-soft);
  color: var(--green);
}

.release-related-controls button:disabled {
  cursor: default;
  opacity: .32;
}

.release-related-viewport {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.release-related-viewport::-webkit-scrollbar {
  display: none;
}

.release-related-viewport:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 5px;
}

.release-related-track {
  display: grid;
  grid-auto-columns: clamp(260px, 28vw, 350px);
  grid-auto-flow: column;
  gap: 14px;
}

.release-related-card {
  display: flex;
  min-width: 0;
  min-height: 100%;
  flex-direction: column;
  border: 1px solid var(--line);
  background: var(--panel);
  color: inherit;
  overflow: hidden;
  scroll-snap-align: start;
  text-decoration: none;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.release-related-card:hover,
.release-related-card:focus-visible {
  border-color: rgba(239, 189, 79, .62);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .16);
  transform: translateY(-3px);
}

.release-related-card:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: -3px;
}

.release-related-image {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  background: #08090a;
  overflow: hidden;
}

.release-related-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg, rgba(255, 255, 255, .035) 0, rgba(255, 255, 255, .035) 1px, transparent 1px, transparent 6px);
  pointer-events: none;
}

.release-related-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.release-related-card:hover .release-related-image img {
  transform: scale(1.025);
}

.release-related-body {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  padding: 17px 18px 18px;
}

.release-related-kicker {
  color: var(--gold-soft);
  font: 800 .72rem/1.2 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.release-related-body > strong {
  display: -webkit-box;
  min-height: 2.25em;
  margin-top: 10px;
  overflow: hidden;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(1.08rem, 1.8vw, 1.4rem);
  line-height: 1.12;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.release-related-body small {
  display: block;
  margin-top: 9px;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  text-transform: uppercase;
}

.release-related-body b {
  margin-top: auto;
  padding-top: 18px;
  color: var(--green);
  font-size: .84rem;
}

:root[data-theme="light"] .release-related-card:hover,
:root[data-theme="light"] .release-related-card:focus-visible {
  box-shadow: 0 12px 28px rgba(34, 46, 39, .11);
}

@media (max-width: 720px) {
  .release-related {
    margin: 24px 0 58px;
    padding-top: 28px;
  }

  .release-related-header {
    display: block;
    margin-bottom: 16px;
  }

  .release-related-controls {
    display: none;
  }

  .release-related-track {
    grid-auto-columns: min(82vw, 318px);
    gap: 11px;
  }

  .release-related-body {
    padding: 15px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .release-related-viewport {
    scroll-behavior: auto;
  }

  .release-related-card,
  .release-related-image img {
    transition: none;
  }
}
@media(max-width:620px){.blog-post{padding-top:30px}.blog-post-panel{padding:30px 20px 24px}.blog-post-panel::after{display:none}.blog-post-header{padding-bottom:24px}}

.blog-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}.blog-tags span{display:inline-flex;align-items:center;border:1px solid rgba(100,208,135,.38);background:rgba(100,208,135,.08);color:var(--green);font-family:"Lucida Console","Cascadia Mono","Courier New",ui-monospace,monospace;font-size:.68rem;font-weight:800;line-height:1;padding:7px 9px;text-transform:uppercase}.blog-post-tags{margin-top:22px}.blog-card .blog-tags{margin-top:auto}.site-footer a{color:inherit;text-decoration-color:rgba(239,189,79,.55);text-underline-offset:3px}.site-footer a:hover{color:var(--gold-soft)}

.release-blog-callout{max-width:720px;border:1px solid rgba(100,208,135,.34);background:linear-gradient(110deg,rgba(100,208,135,.09),rgba(239,189,79,.045));box-shadow:inset 3px 0 0 rgba(100,208,135,.7);margin:26px 0 6px;padding:15px 17px}.release-blog-callout>.mini-label{display:block;color:var(--green);margin-bottom:8px}.release-blog-callout a{display:flex;align-items:center;justify-content:space-between;gap:18px;color:var(--text);text-decoration:none}.release-blog-callout a strong{font-size:clamp(1rem,2vw,1.2rem)}.release-blog-callout a span{color:var(--gold);font-size:1.35rem;transition:transform .18s ease}.release-blog-callout a:hover strong{color:var(--green)}.release-blog-callout a:hover span{transform:translateX(4px)}

.release-video-callout{max-width:720px;border:1px solid rgba(121,184,255,.38);background:linear-gradient(110deg,rgba(121,184,255,.10),rgba(239,189,79,.045));box-shadow:inset 3px 0 0 rgba(121,184,255,.78);margin:20px 0 6px;padding:15px 17px}.release-video-callout>.mini-label{display:block;color:var(--blue);margin-bottom:8px}.release-video-button{display:flex;align-items:center;width:100%;gap:12px;border:0;background:transparent;color:var(--text);padding:0;text-align:left;cursor:pointer}.release-video-button>span:nth-child(2){display:grid;gap:2px;min-width:0}.release-video-button strong{font-size:clamp(1rem,2vw,1.2rem)}.release-video-button small{color:var(--muted);font-size:.78rem}.release-video-play{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid rgba(121,184,255,.55);background:rgba(121,184,255,.12);color:var(--blue);font-size:.92rem;padding-left:2px}.release-video-arrow{margin-left:auto;color:var(--gold);font-size:1.35rem;transition:transform .18s ease}.release-video-button:hover strong,.release-video-button:focus-visible strong{color:var(--blue)}.release-video-button:hover .release-video-arrow,.release-video-button:focus-visible .release-video-arrow{transform:translateX(4px)}

/* Homepage journal cards */
.blog-grid-home .blog-card {
  position: relative;
  overflow: hidden;
}

.blog-grid-home .blog-card::before {
  position: absolute;
  top: 12px;
  right: 14px;
  z-index: 0;
  width: 54px;
  height: 54px;
  background: url("/assets/journal-feather.svg") center / contain no-repeat;
  content: "";
  opacity: 0.72;
  pointer-events: none;
}

.blog-grid-home .blog-card::after {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--gold), var(--green), transparent 76%);
  content: "";
  pointer-events: none;
}

.blog-grid-home .blog-card-body {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "category category"
    "title author"
    "excerpt excerpt"
    "link link";
  column-gap: 18px;
  row-gap: 13px;
}

.blog-grid-home .blog-card-body > .mini-label {
  grid-area: category;
  margin: 0;
  padding-right: 48px;
}

.blog-grid-home .blog-card-body h3 {
  grid-area: title;
  align-self: start;
  font-size: clamp(1.45rem, 2.6vw, 2.12rem);
  line-height: 1.08;
}

.blog-grid-home .blog-author {
  grid-area: author;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-areas:
    "avatar name"
    "avatar date";
  column-gap: 9px;
  row-gap: 1px;
  min-width: 130px;
  margin-top: 0;
  padding-left: 10px;
  border-left: 1px solid rgba(239, 189, 79, 0.32);
}

.blog-grid-home .blog-author img,
.blog-grid-home .blog-author > span {
  grid-area: avatar;
  width: 38px;
  height: 38px;
}

.blog-grid-home .blog-author strong {
  grid-area: name;
  align-self: end;
  font-size: 0.86rem;
}

.blog-grid-home .blog-author time {
  grid-area: date;
  align-self: start;
  margin: 0;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.66rem;
}

.blog-grid-home .blog-card-body > p[data-blog-text] {
  grid-area: excerpt;
  margin-top: 2px;
}

.blog-grid-home .blog-card-body > .archive-link {
  grid-area: link;
  margin-top: 2px;
}

:root[data-theme="light"] .blog-grid-home .blog-card::before { opacity: 0.56; }

@media (max-width: 620px) {
  .blog-grid-home .blog-card-body {
    grid-template-columns: 1fr;
    grid-template-areas:
      "category"
      "title"
      "author"
      "excerpt"
      "link";
  }

  .blog-grid-home .blog-card-body > .mini-label { padding-right: 54px; }

  .blog-grid-home .blog-author {
    margin-top: 0;
    padding-left: 0;
    border-left: 0;
  }
}

/* Keep journal-card text baselines aligned across home and blog index. */
.blog-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.blog-grid .blog-card {
  position: relative;
  overflow: hidden;
}

.blog-grid .blog-card::before {
  position: absolute;
  top: 12px;
  right: 14px;
  z-index: 0;
  width: 54px;
  height: 54px;
  background: url("/assets/journal-feather.svg") center / contain no-repeat;
  content: "";
  opacity: 0.72;
  pointer-events: none;
}

.blog-grid .blog-card::after {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--gold), var(--green), transparent 76%);
  content: "";
  pointer-events: none;
}

.blog-grid .blog-card-body {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 24px 8rem 44px 7.5rem 32px 32px;
  grid-template-areas:
    "category"
    "title"
    "author"
    "excerpt"
    "tags"
    "link";
  column-gap: 18px;
  row-gap: 13px;
}

.blog-grid .blog-card-body > .mini-label {
  grid-area: category;
  margin: 0;
  padding-right: 48px;
}

.blog-grid .blog-card-body h2,
.blog-grid .blog-card-body h3 {
  grid-area: title;
  align-self: start;
  height: 100%;
  margin: 0;
  overflow: hidden;
  display: block;
  font-size: clamp(1.5rem, 2.15vw, 1.84rem);
  line-height: 1.08;
  letter-spacing: -0.025em;
  text-wrap: balance;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: auto;
}

.blog-grid .blog-author {
  grid-area: author;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-areas:
    "avatar name"
    "avatar date";
  column-gap: 9px;
  row-gap: 1px;
  min-width: 0;
  height: max-content;
  align-self: start;
  margin-top: 0;
  padding-left: 0;
  border-left: 0;
}

.blog-grid .blog-author img,
.blog-grid .blog-author > span {
  grid-area: avatar;
  width: 38px;
  height: 38px;
}

.blog-grid .blog-author strong {
  grid-area: name;
  align-self: end;
  font-size: 0.86rem;
}

.blog-grid .blog-author time {
  grid-area: date;
  align-self: start;
  margin: 0;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: 0.66rem;
  white-space: nowrap;
}

.blog-reading-time {
  color: var(--green);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: .92em;
  font-weight: 800;
  letter-spacing: .01em;
  text-transform: uppercase;
}

.blog-author-large .blog-reading-time {
  color: var(--gold);
}

.blog-grid .blog-card-body > p:not(.mini-label) {
  grid-area: excerpt;
  align-self: start;
  height: 7.5rem;
  margin: 0;
  overflow: hidden;
}
.blog-grid .blog-tags {
  grid-area: tags;
  align-items: center;
  height: 32px;
  flex-wrap: nowrap;
  gap: 5px;
  margin: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}

.blog-grid .blog-tags::-webkit-scrollbar { display: none; }

.blog-grid .blog-tags span {
  flex: 0 0 auto;
  font-size: 0.61rem;
  padding: 6px 7px;
}
.blog-grid .blog-card-body > .archive-link {
  grid-area: link;
  display: flex;
  align-items: center;
  height: 32px;
  margin: 0;
}

.blog-grid-home .blog-card-body {
  grid-template-rows: 24px 8rem 44px 7.5rem 32px;
  grid-template-areas:
    "category"
    "title"
    "author"
    "excerpt"
    "link";
}

:root[data-theme="light"] .blog-grid .blog-card::before { opacity: 0.56; }

@media (max-width: 900px) {
  .blog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .blog-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .blog-grid .blog-card-body {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-template-areas:
      "category"
      "title"
      "author"
      "excerpt"
      "tags"
      "link";
  }

  .blog-grid .blog-card-body > .mini-label { padding-right: 54px; }
  .blog-grid .blog-card-body h2,
  .blog-grid .blog-card-body h3 {
    display: block;
    height: auto;
    overflow: visible;
  }

  .blog-grid .blog-card-body > p:not(.mini-label),
  .blog-grid .blog-tags,
  .blog-grid .blog-card-body > .archive-link {
    height: auto;
  }
  .blog-grid .blog-author { margin-top: 0; padding-left: 0; border-left: 0; }

  .blog-post-header::before { width: 78px; height: 78px; opacity: .09; }
  .blog-post-header .blog-entry-title,
  .blog-post-header .blog-entry-title.blog-title-medium,
  .blog-post-header .blog-entry-title.blog-title-long {
    padding-right: 0;
    font-size: clamp(2.25rem, 11vw, 3.35rem);
    line-height: 1;
  }
}

/* Homepage release cards: shared tracks keep every reading line aligned. */
.article-grid {
  align-items: stretch;
}

.article-card {
  height: 100%;
}

.article-body {
  display: grid;
  grid-template-rows: 24px 54px 72px 32px 24px;
  grid-template-areas:
    "meta"
    "title"
    "excerpt"
    "tags"
    "footer";
  gap: 10px;
}

.article-meta {
  grid-area: meta;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  white-space: nowrap;
}

.article-card h3 {
  grid-area: title;
  height: 54px;
  margin: 0;
  overflow: hidden;
}

.article-card p {
  grid-area: excerpt;
  height: 72px;
  min-height: 0;
  max-height: 72px;
  margin: 0;
}

.article-card .article-type-tags {
  grid-area: tags;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  height: 32px;
  margin: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}

.article-card .article-type-tags::-webkit-scrollbar {
  display: none;
}

.article-card .article-footer {
  grid-area: footer;
  height: 24px;
  margin: 0;
}

@media (max-width: 620px) {
  .article-body {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .article-meta {
    margin-bottom: 10px;
    overflow: visible;
    white-space: normal;
  }

  .article-card h3 {
    height: auto;
  }

  .article-card p {
    height: auto;
    min-height: 4.5em;
    max-height: none;
    margin: 12px 0 16px;
  }

  .article-card .article-type-tags {
    flex-wrap: wrap;
    height: auto;
    margin: auto 0 12px;
    overflow: visible;
  }

  .article-card .article-footer {
    height: auto;
    margin-top: auto;
  }
}

/* Branded HTTP error pages */
.error-main {
  display: grid;
  align-items: center;
  padding: clamp(32px, 7vh, 86px) 0 clamp(58px, 9vh, 110px);
}

.error-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(420px, 1.12fr);
  gap: clamp(26px, 5vw, 70px);
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  background: linear-gradient(135deg, rgba(239, 189, 79, .07), transparent 44%), var(--panel);
  box-shadow: var(--shadow);
  padding: clamp(28px, 5vw, 64px);
}

.error-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(180deg, transparent 0 7px, rgba(239, 189, 79, .025) 7px 8px);
}

.error-copy,
.error-art {
  position: relative;
  z-index: 1;
}

.error-code {
  margin: -4px 0 10px;
  color: var(--gold-soft);
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: clamp(4.8rem, 11vw, 9.5rem);
  font-weight: 900;
  letter-spacing: -.08em;
  line-height: .82;
  text-shadow: 0 0 38px rgba(239, 189, 79, .18);
}

.error-copy h1 {
  max-width: 650px;
  font-size: clamp(2rem, 4.4vw, 4.4rem);
  line-height: .98;
}

.error-lede {
  max-width: 650px;
  margin: 22px 0 0;
  color: var(--muted-strong);
  font-size: clamp(1rem, 1.5vw, 1.18rem);
}

.error-terminal {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 5px 12px;
  max-width: 650px;
  margin-top: 28px;
  border: 1px solid rgba(100, 208, 135, .34);
  background: rgba(5, 12, 9, .88);
  color: #8ce4a8;
  font-family: "Lucida Console", "Cascadia Mono", "Courier New", ui-monospace, monospace;
  font-size: .78rem;
  padding: 15px 17px;
}

.error-terminal b {
  color: #f4d37a;
}

.error-terminal small {
  grid-column: 1 / -1;
  overflow: hidden;
  color: rgba(211, 235, 217, .68);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.error-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 28px;
}

.error-actions .text-link {
  margin-left: 4px;
}

.error-art {
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(239, 189, 79, .3);
  background: #08100f;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

.error-art img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

:root[data-theme="light"] .error-panel {
  background: linear-gradient(135deg, rgba(200, 135, 19, .12), transparent 44%), rgba(255, 255, 255, .84);
}

:root[data-theme="light"] .error-art {
  box-shadow: 0 22px 55px rgba(24, 31, 28, .2);
}

@media (max-width: 900px) {
  .error-panel {
    grid-template-columns: 1fr;
  }

  .error-art {
    order: -1;
    width: min(100%, 650px);
    margin-inline: auto;
  }
}

@media (max-width: 560px) {
  .error-main {
    padding-top: 18px;
  }

  .error-panel {
    width: calc(100% + 16px);
    margin-left: -8px;
    padding: 16px 16px 30px;
  }

  .error-terminal {
    grid-template-columns: 1fr;
  }

  .error-actions {
    align-items: stretch;
  }

  .error-actions .button,
  .error-actions .text-link {
    width: 100%;
    margin: 0;
    text-align: center;
  }
}
.release-detail-copy .release-hosted-badge,.release-card .release-hosted-badge{width:max-content;max-width:100%;align-self:flex-start}
.release-detail-copy>.release-keyfile-card{width:100%;max-width:none;display:block;min-height:0;overflow:visible;margin:-12px 0 34px;padding:0;border:0;background:transparent;box-shadow:none}.release-keyfile-toggle{position:absolute;z-index:5;top:-39px;left:50%;display:grid;place-items:center;width:38px;height:38px;margin:0;padding:0;border:1px solid rgba(200,135,19,.72);border-radius:50%;background:linear-gradient(145deg,#fff8df,#f0c655);color:#5e3b00;cursor:pointer;box-shadow:0 4px 12px rgba(25,36,28,.22);transform:translateX(-50%);transform-origin:50% -28px;animation:release-keyfile-swing 5.8s ease-in-out infinite;list-style:none;font-size:1.16rem;line-height:1;transition:box-shadow .2s ease}.release-keyfile-toggle::-webkit-details-marker{display:none}.release-keyfile-toggle::before{content:"";position:absolute;bottom:100%;left:50%;height:28px;border-left:2px dashed rgba(200,135,19,.76);transform:translateX(-50%)}.release-keyfile-toggle:hover,.release-keyfile-toggle:focus-visible{animation-play-state:paused;transform:translateX(-50%) rotate(-8deg) scale(1.08);box-shadow:0 7px 16px rgba(25,36,28,.28)}.release-keyfile-card[open]>.release-keyfile-toggle{animation-delay:-1.4s}.release-keyfile-card:not([open]){height:0}.release-keyfile-panel{display:grid;grid-template-columns:210px minmax(0,1fr);gap:14px;align-items:center;min-height:156px;overflow:hidden;padding:10px 16px 10px 8px;border:1px solid rgba(239,189,79,.3);background:radial-gradient(circle at 108px 54%,rgba(255,116,105,.13),transparent 31%),repeating-linear-gradient(180deg,rgba(239,189,79,.035) 0,rgba(239,189,79,.035) 1px,transparent 1px,transparent 6px),linear-gradient(105deg,rgba(239,189,79,.075),rgba(10,11,13,.42));box-shadow:0 18px 44px rgba(25,36,28,.07)}:root[data-theme="light"] .release-keyfile-panel{border-color:rgba(200,135,19,.34);background:radial-gradient(circle at 108px 54%,rgba(255,116,105,.14),transparent 31%),repeating-linear-gradient(180deg,rgba(200,135,19,.055) 0,rgba(200,135,19,.055) 1px,transparent 1px,transparent 6px),linear-gradient(105deg,rgba(255,244,218,.86),rgba(255,255,255,.78))}[data-theme="dark"] .release-keyfile-toggle{background:linear-gradient(145deg,#3e2b0b,#d5a727);color:#fff4cb}@keyframes release-keyfile-swing{0%,100%{transform:translateX(-50%) rotate(-4.2deg)}50%{transform:translateX(-50%) rotate(4.2deg)}}@media(prefers-reduced-motion:reduce){.release-keyfile-toggle{animation:none}}@media(max-width:700px){.release-detail-copy>.release-keyfile-card{margin:-4px 0 28px}.release-keyfile-panel{grid-template-columns:1fr;gap:3px;min-height:0;padding:8px 12px 13px;background:radial-gradient(circle at 50% 54px,rgba(255,116,105,.13),transparent 30%),repeating-linear-gradient(180deg,rgba(239,189,79,.035) 0,rgba(239,189,79,.035) 1px,transparent 1px,transparent 6px),linear-gradient(105deg,rgba(239,189,79,.075),rgba(10,11,13,.42))}:root[data-theme="light"] .release-keyfile-panel{background:radial-gradient(circle at 50% 54px,rgba(255,116,105,.14),transparent 30%),repeating-linear-gradient(180deg,rgba(200,135,19,.055) 0,rgba(200,135,19,.055) 1px,transparent 1px,transparent 6px),linear-gradient(105deg,rgba(255,244,218,.86),rgba(255,255,255,.78))}}
.release-hosted-badge{display:inline-flex;align-items:center;margin:0 0 18px;padding:7px 10px;border:1px solid rgba(0,118,71,.35);background:rgba(0,118,71,.07);color:#087744;font:700 12px/1.2 var(--mono,monospace);letter-spacing:.06em;text-transform:uppercase}.release-hosted-badge::before{content:"";width:7px;height:7px;margin-right:8px;border-radius:50%;background:#0a9a58;box-shadow:0 0 0 4px rgba(10,154,88,.12)}.release-downloads{margin:34px 0;padding:24px;border:1px solid rgba(123,91,19,.28);background:linear-gradient(135deg,rgba(255,249,229,.76),rgba(241,247,241,.86));box-shadow:0 18px 44px rgba(25,36,28,.07)}.release-downloads-head{max-width:760px;margin-bottom:18px}.release-downloads-head h2{margin:5px 0 7px}.release-downloads-head p{margin:0}.release-download-grid{display:grid;gap:12px}.release-download-card{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:17px 18px;border:1px solid rgba(123,91,19,.22);background:rgba(255,255,255,.72)}.release-download-card h3{margin:0 0 5px;font-size:clamp(19px,2vw,25px)}.release-download-meta{margin:0;color:var(--muted);font:600 12px/1.5 var(--mono,monospace);text-transform:uppercase;letter-spacing:.04em}.release-download-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;flex:0 0 auto}[data-theme="dark"] .release-hosted-badge{border-color:rgba(89,210,143,.4);background:rgba(46,142,92,.12);color:#7ee0a8}[data-theme="dark"] .release-downloads{border-color:rgba(239,189,79,.28);background:linear-gradient(135deg,rgba(35,29,17,.9),rgba(13,24,19,.92))}[data-theme="dark"] .release-download-card{border-color:rgba(239,189,79,.22);background:rgba(5,8,7,.5)}@media(max-width:700px){.release-downloads{padding:17px}.release-download-card{align-items:stretch;flex-direction:column}.release-download-actions{justify-content:stretch}.release-download-actions .button{width:100%;text-align:center}}
/* The key belongs to the outer download panel, not to either action button. */
.release-keyfile-toggle{left:34px}
@media(max-width:700px){.release-keyfile-toggle{left:24px}}
/* Release index search: mirrors the calm single-field search on the homepage. */
.release-search-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:end;width:min(1360px,calc(100% - 48px));margin:0 auto 18px}.release-search-toolbar .search-field{margin:0}.release-search-toolbar input{width:100%;min-height:52px;padding:12px 15px;border:1px solid var(--line);background:var(--panel);color:var(--text);font:inherit}.release-search-toolbar input:focus{border-color:var(--gold-soft);box-shadow:0 0 0 3px rgba(239,189,79,.12);outline:0}.release-search-result{margin:0 0 3px;white-space:nowrap;color:var(--muted);font:700 .77rem/1.2 var(--mono,monospace);letter-spacing:.05em;text-transform:uppercase}.release-search-empty{margin-top:0}.release-card[hidden]{display:none}@media(max-width:700px){.release-search-toolbar{grid-template-columns:1fr;width:min(100% - 28px,1360px);gap:8px;margin-bottom:14px}.release-search-result{margin:0}.release-search-toolbar input{min-height:48px}}
/* Long release types are complete pills, never fragmented word by word. */
.release-type-tag{flex:0 0 auto;white-space:nowrap}.article-card .article-body{grid-template-rows:24px 54px 72px minmax(32px,auto) 24px}.article-card .article-type-tags{align-content:start;flex-wrap:wrap;height:auto;max-height:none;overflow:visible}
/* Preserve every part of the release artwork; unused frame area stays intentionally dark. */
.release-card-image{position:relative!important;display:grid!important;place-items:center!important;aspect-ratio:16/9!important;overflow:hidden!important;background:#050506!important}.release-card-image>img{position:absolute!important;inset:0!important;display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:center!important}.release-detail-image img{object-fit:contain!important}
/* Homepage archive cards use their own .thumb container. Keep the artwork complete here too. */
.thumb{position:relative;display:grid;place-items:center;aspect-ratio:16/9;overflow:hidden;background:#050506}.thumb::after{display:none}.thumb img{position:absolute;inset:0;display:block;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center}