/* Zeno Turtle changelog integration for the approved Pixel Journey theme. */
@font-face {
  font-family: 'Zeno Pixel';
  src: url('../fonts/pixel/fusion-pixel-12px-proportional-zh_hans.otf.woff2') format('woff2');
  font-display: swap;
  font-weight: 400 900;
}
@font-face {
  font-family: 'Zeno Pixel TC';
  src: url('../fonts/pixel/fusion-pixel-12px-proportional-zh_hant.otf.woff2') format('woff2');
  font-display: swap;
  font-weight: 400 900;
}
@font-face {
  font-family: 'Zeno Pixel JP';
  src: url('../fonts/pixel/fusion-pixel-12px-proportional-ja.otf.woff2') format('woff2');
  font-display: swap;
  font-weight: 400 900;
}
@font-face {
  font-family: 'Zeno Pixel KR';
  src: url('../fonts/pixel/fusion-pixel-12px-proportional-ko.otf.woff2') format('woff2');
  font-display: swap;
  font-weight: 400 900;
}
:root {
  color-scheme: dark;
  --brand: #8fc96b;
  --brand-dim: #16372f;
  --brand-glow: #486c51;
  --bg-base: #061326;
  --bg-card: #0a1d34;
  --bg-card-hover: #102b45;
  --bg-subtle: #0b2038;
  --text-primary: #f6f2df;
  --text-secondary: #c6d3e1;
  --text-muted: #9caec3;
  --border: #263f59;
  --border-hover: #718095;
  --tag-new-bg: #16372f;
  --tag-new-text: #b8e598;
  --tag-new-border: #486c51;
  --tag-improve-bg: #102b45;
  --tag-improve-text: #a5c8ef;
  --tag-improve-border: #526880;
  --tag-fix-bg: #28291e;
  --tag-fix-text: #ffd45b;
  --tag-fix-border: #b79239;
  --review-bg: #28291e;
  --review-text: #ffd45b;
  --review-border: #b79239;
  --review-glow: transparent;
  --pixel-font: 'Zeno Pixel', 'Microsoft YaHei', sans-serif;
  --body-font: var(--pixel-font);
  --pixel-cut: polygon(0 8px,4px 8px,4px 4px,8px 4px,8px 0,calc(100% - 8px) 0,calc(100% - 8px) 4px,calc(100% - 4px) 4px,calc(100% - 4px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 4px) calc(100% - 8px),calc(100% - 4px) calc(100% - 4px),calc(100% - 8px) calc(100% - 4px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 4px),4px calc(100% - 4px),4px calc(100% - 8px),0 calc(100% - 8px));
}
html:lang(zh-TW) { --pixel-font: 'Zeno Pixel TC', sans-serif; }
html:lang(ja-JP) { --pixel-font: 'Zeno Pixel JP', sans-serif; }
html:lang(ko-KR) { --pixel-font: 'Zeno Pixel KR', sans-serif; }
body {
  font-family: var(--body-font);
  background: #061326 url('../images/pixel/night-valley.webp') center top / 100% auto no-repeat fixed;
}
body.zeno-changelog-page,
body.zeno-changelog-page * {
  font-family: var(--pixel-font) !important;
}
body.zeno-pixel :where(h1, h2, h3, h4, h5, h6, p, a, span, strong, em, small,
  li, dt, dd, blockquote, figcaption, label, button, input, textarea, select,
  option, table, th, td, code, pre, kbd, samp) {
  font-family: var(--pixel-font) !important;
}
::selection { background: #ffd45b; color: #14202b; }
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #061326; }
::-webkit-scrollbar-thumb { background: #526880; border-radius: 0; }
:focus-visible { outline: 3px solid #ffd45b; outline-offset: 4px; }
.bg-decoration::after {
  content: ''; position: absolute; inset: 0;
  background: rgba(3,14,30,.8);
}
.bg-grid, .bg-orb { display: none; }
.navbar {
  background: #061326; border-bottom: 2px solid #526880;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.nav-logo-icon, .footer-logo-icon { border-radius: 0; object-fit: contain; }
.nav-logo-text, .footer-logo-text, .lang-selector-trigger, .lang-option,
.version-nav-label, .hero-badge, .hero-title, .hero-stat-num,
.timeline-version, .card-title, .card-badge, .group-label,
.download-btn, .subscribe-title, .subscribe-btn {
  font-family: var(--pixel-font);
  font-weight: 400;
  letter-spacing: 0;
}
.nav-logo-text, .footer-logo-text { display: none; color: #8fc96b; }
.lang-selector-trigger, .lang-selector-dropdown, .version-nav-item,
.hero-badge, .version-card, .group-label, .download-btn,
.subscribe-section, .subscribe-input, .subscribe-btn {
  border-radius: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.lang-selector-trigger, .lang-selector-dropdown {
  background: #0b2038; border: 2px solid #526880;
  box-shadow: 3px 3px 0 #020b16;
}
.lang-option:hover, .lang-option.active { background: #16372f; color: #b8e598; }
.lang-code { color: #ffd45b; }
.version-nav-item { background: #0b2038; border-color: #526880; }
.version-nav-dot { border-radius: 0; background: #526880; }
.version-nav-item.active .version-nav-dot,
.version-nav-item:hover .version-nav-dot { background: #ffd45b; box-shadow: none; }
.hero-title-gradient { background: none; color: #f6f2df; -webkit-text-fill-color: currentColor; }
.hero-title, .card-title { text-shadow: 2px 2px 0 #020b16; }
.hero-badge { color: #b8e598; background: #0b2038; border: 1px solid #526880; box-shadow: 2px 2px 0 #020b16; }
.hero-badge-dot { border-radius: 0; background: #8fc96b; animation: none; }
.hero-stat-num { color: #ffd45b; }
.timeline-line { background: #526880; }
.timeline-node { border-radius: 0; background: #8fc96b; border-color: #061326; box-shadow: none; }
.version-card {
  background: #0a1d34; border: 2px solid #526880;
  box-shadow: 4px 4px 0 #020b16;
}
.version-card::before { display: none; }
.version-card:hover { border-color: #ffd45b; box-shadow: 4px 4px 0 #020b16; transform: translateY(-2px); }
.card-badge, .group-label { border-width: 1px; }
.change-item-icon { shape-rendering: crispEdges; }
.download-btn, .subscribe-btn {
  clip-path: var(--pixel-cut); border: 2px solid #ffe9a0;
  background: #ffd45b; color: #14202b;
  box-shadow: inset 0 -4px 0 #d5a432;
  text-shadow: none;
}
.download-btn:hover, .subscribe-btn:hover {
  background: #ffe58d; color: #14202b; box-shadow: inset 0 -4px 0 #d5a432;
}
.download-btn-review { background: #28291e; color: #ffd45b; border-color: #b79239; }
.subscribe-section { background: #0a1d34; border: 2px solid #526880; box-shadow: 4px 4px 0 #020b16; }
.subscribe-section::before { display: none; }
.subscribe-input { background: #061326; border: 2px solid #526880; color: #f6f2df; }
.subscribe-input:focus { border-color: #ffd45b; box-shadow: 0 0 0 2px #061326,0 0 0 4px #ffd45b; }
.footer { background: #041020; border-top: 2px solid #263f59; }
.footer, .footer a, .footer p, .footer span { font-family: var(--pixel-font); }

/* Match the public site's stronger pixel framing and vertical rhythm. */
.wrapper { max-width: 1040px; }
.navbar-inner { height: 80px; max-width: 1260px; }
.nav-logo-icon { width: auto; height: 42px; }
.nav-logo-text { font-size: 18px; }
.nav-links { gap: 2px; margin-inline: auto 18px; }
.nav-link {
  padding: 9px 10px; border-radius: 0;
  color: #d6e0e9; font-family: var(--pixel-font); font-size: 13px;
  white-space: nowrap;
}
.nav-link:hover { background: #10253d; color: #fff4cf; }
.nav-link.active {
  color: #14202b; background: #ffd45b;
  clip-path: var(--pixel-cut); box-shadow: inset 0 -3px 0 #d5a432;
}
.lang-selector-trigger { min-height: 44px; padding-inline: 16px; }
.mobile-menu-toggle, .mobile-menu-overlay { display: none; }
.hero {
  position: relative;
  padding: 112px 32px 84px;
  margin: 32px auto 80px;
  background: rgba(6,19,38,.78);
  border: 3px solid #718095;
  clip-path: var(--pixel-cut);
  box-shadow: inset 0 0 0 3px #192d43, 6px 6px 0 #020b16;
}
.hero::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: url('../images/pixel/hero-turtle.webp') right center / 390px auto no-repeat;
  opacity: .18; image-rendering: pixelated;
}
.hero-desc { max-width: 650px; color: #d6e0e9; text-shadow: 1px 2px 1px #020b16; }
.hero-stats {
  width: fit-content; max-width: 100%; margin: 0 auto;
  padding: 18px 28px; background: #061326;
  border: 2px solid #526880; box-shadow: 3px 3px 0 #020b16;
}
.hero-stat-num { font-size: 28px; }
.hero-stat-label { color: #a5b8cf; }
.timeline { padding-bottom: 120px; }
.timeline-line {
  width: 4px;
  background: repeating-linear-gradient(to bottom,#526880 0 8px,transparent 8px 16px);
}
.timeline-entry { grid-template-columns: 150px 1fr; gap: 38px; }
.timeline-node {
  right: -21px; width: 14px; height: 14px;
  border: 3px solid #061326; outline: 2px solid #8fc96b;
}
.timeline-version { font-size: 17px; color: #ffd45b; }
.timeline-date { color: #a5b8cf; font-variant-numeric: tabular-nums; }
.version-card {
  clip-path: var(--pixel-cut);
  box-shadow: inset 0 0 0 2px #192d43, 5px 5px 0 #020b16;
}
.version-card:hover { box-shadow: inset 0 0 0 2px #192d43, 5px 5px 0 #020b16; }
.card-header { padding-bottom: 18px; border-bottom: 2px solid #263f59; }
.card-title { font-size: 25px; line-height: 1.3; }
.card-badge, .group-label, .lang-code, .download-btn-review-badge {
  border-radius: 0; clip-path: var(--pixel-cut);
}
.badge-latest { color: #14202b; background: #ffd45b; border-color: #ffe9a0; }
.badge-stable { color: #c6d3e1; background: #0b2038; border-color: #526880; }
.group-label { padding: 6px 12px; font-size: 12px; }
.group-label-dot, .download-btn-review-dot { border-radius: 0; }
.change-list { gap: 10px; }
.change-item {
  padding: 8px 10px; color: #c6d3e1;
  border-inline-start: 2px solid #263f59;
}
.change-item:hover { background: #102b45; border-inline-start-color: #8fc96b; }
.change-item-icon { opacity: 1; shape-rendering: crispEdges; }
.group-divider { height: 2px; background: #263f59; }
.download-section { border-top-width: 2px; gap: 12px; }
.download-btn { min-height: 46px; justify-content: center; flex: 1 1 0; }
.download-btn-icon svg { shape-rendering: crispEdges; }
.download-btn-review,
.download-btn-review:hover { background: #28291e !important; color: #ffd45b; box-shadow: none; }
.download-btn-review::after { display: none; }
.subscribe-section { clip-path: var(--pixel-cut); }
.subscribe-input { min-height: 48px; font-size: 16px; }
.subscribe-btn { min-height: 48px; }
.footer-logo-icon { width: auto; height: 30px; }
.version-nav { right: 24px; gap: 6px; }
.version-nav-item {
  min-height: 34px; padding: 5px 8px;
  border: 1px solid transparent;
}
.version-nav-item:hover, .version-nav-item.active { border-color: #526880; }
.version-nav-label { opacity: 1; transform: none; color: #a5b8cf; }
.version-nav-item.active .version-nav-label { color: #ffd45b; }
@media (max-width: 640px) {
  body { background-size: auto 760px; }
  .navbar-inner { height: 64px; padding-inline: 16px; }
  .nav-logo-icon { height: 34px; }
  .nav-logo-text { display: none; }
  .wrapper { padding-inline: 16px; }
  .hero { margin: 16px 0 56px; padding: 64px 16px 48px; }
  .hero::before { background-size: 300px auto; background-position: 80% 50%; opacity: .14; }
  .hero-title { font-size: 40px; line-height: 1.2; }
  .hero-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; gap: 0; padding: 0; }
  .hero-stat { padding: 14px 8px; }
  .hero-stat:nth-child(5) { border-top: 1px solid #526880; }
  .hero-stat:nth-child(7) { border-top: 1px solid #526880; }
  .hero-stat-divider { display: none; }
  .timeline-entry { grid-template-columns: minmax(0,1fr); gap: 12px; margin-bottom: 44px; }
  .timeline-meta { padding-inline: 4px; }
  .timeline-node { outline: none; border-color: #8fc96b; }
  .version-card { padding: 22px 18px 24px; box-shadow: inset 0 0 0 2px #192d43,3px 3px 0 #020b16; }
  .card-header { flex-direction: column; gap: 10px; }
  .card-title { font-size: 21px; }
  .change-item { padding-inline: 8px 4px; }
  .download-btn { width: 100%; }
  .subscribe-section { padding: 32px 18px; }
  .subscribe-form { flex-direction: column; }
}
@media (max-width: 1199px) {
  .nav-links, .navbar .lang-selector { display: none; }
  .mobile-menu-toggle {
    display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 5px; width: 44px; height: 44px; margin-inline-start: auto;
    background: #0b2038; color: #f6f2df; border: 2px solid #718095;
    cursor: pointer; box-shadow: 2px 2px 0 #020b16;
  }
  .mobile-menu-toggle span { width: 22px; height: 2px; background: currentColor; transition: transform .12s, opacity .12s; }
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .mobile-menu-overlay {
    display: block; position: fixed; inset: 80px 0 0; z-index: 90;
    background: rgba(2,9,20,.94); opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .12s, visibility .12s;
  }
  .mobile-menu-overlay.open { opacity: 1; visibility: visible; pointer-events: auto; }
  .mobile-menu-panel {
    width: min(100%,460px); height: 100%; margin-inline-start: auto; padding: 28px 24px 40px;
    overflow-y: auto; background: #061326; border-inline-start: 2px solid #526880;
    box-shadow: -5px 0 0 #020b16;
  }
  .mobile-nav-link {
    display: block; min-height: 44px; padding: 11px 14px; margin-bottom: 6px;
    color: #d6e0e9; border: 1px solid #263f59; text-decoration: none;
    font-family: var(--pixel-font); font-size: 17px;
  }
  .mobile-nav-link:hover { color: #fff4cf; border-color: #718095; background: #10253d; }
  .mobile-nav-link.active { color: #14202b; background: #ffd45b; border-color: #ffe9a0; clip-path: var(--pixel-cut); }
  .mobile-language-title {
    margin: 28px 0 12px; color: #8fc96b; font-family: var(--pixel-font); font-size: 15px;
  }
  .mobile-language-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .mobile-language-grid .lang-option {
    display: block; width: 100%; min-height: 44px; padding: 9px 8px;
    color: #c6d3e1; background: #0b2038; border: 1px solid #526880;
    text-align: center; cursor: pointer;
  }
  .mobile-language-grid .lang-option.active { color: #14202b; background: #ffd45b; border-color: #ffe9a0; }
  body.menu-open { overflow: hidden; }
}
@media (max-width: 640px) {
  .mobile-menu-overlay { inset-block-start: 64px; }
  .mobile-menu-panel { width: 100%; border-inline-start: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (hover: hover) and (pointer: fine) {
    html,
    body,
    body * {
        cursor: url('../images/pixel/cursor-turtle.svg') 3 5, auto !important;
    }
    a,
    button,
    [role='button'],
    input[type='button'],
    input[type='submit'],
    input[type='reset'],
    label[for],
    select,
    summary,
    .clickable,
    a *,
    button * {
        cursor: url('../images/pixel/cursor-turtle-active.svg') 3 5, pointer !important;
    }
}
.download-btn[aria-disabled='true'],
.download-btn[aria-disabled='true'] * {
  cursor: not-allowed !important;
}