.release-page { min-height: 100vh; background: var(--color-bg); }
.release-page nav#nav { color: var(--color-text); }
.release-page nav#nav .nav-cta {
    color: var(--color-on-cta) !important; background: var(--color-cta); border-color: var(--color-cta);
}
.release-page nav#nav .theme-toggle {
    color: var(--color-text); background: var(--color-surface-2); border-color: var(--color-border);
}
.release-page .nav-links a.active { color: var(--color-text); }

.release-hero {
    padding: 150px 32px 76px;
    border-bottom: 1px solid var(--color-border-strong);
    background: var(--color-bg-elevated);
}
.release-wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; }
.release-hero .section-label { margin-bottom: 24px; }
.release-hero h1 {
    max-width: 900px; font-family: var(--font-display); font-size: clamp(52px, 7.2vw, 92px);
    font-weight: 400; line-height: 0.94; letter-spacing: 0;
}
.release-hero .intro {
    max-width: 610px; margin-top: 28px; color: var(--color-text-muted);
    font-size: 17px; line-height: 1.55;
}

.release-index { padding: 76px 32px 128px; }
.release-month { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 64px; }
.month-rail { align-self: start; position: sticky; top: 88px; }
.month-rail span {
    display: block; margin-bottom: 8px; color: var(--color-accent); font-family: var(--font-mono);
    font-size: 10.5px; letter-spacing: 0.12em;
}
.month-rail h2 { font-family: var(--font-display); font-size: 38px; font-weight: 400; line-height: 1; }

.release-list { border-top: 1px solid var(--color-border-strong); }
.release {
    display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 34px;
    padding: 34px 0 40px; border-bottom: 1px solid var(--color-border-strong);
}
.release-meta { display: grid; align-content: start; gap: 13px; }
.release time { color: var(--color-text-faint); font-family: var(--font-mono); font-size: 11.5px; }
.release-tag {
    display: inline-flex; width: max-content; align-items: center; gap: 7px;
    color: var(--color-text-muted); font-size: 10.5px; font-weight: 650;
    letter-spacing: 0.08em; text-transform: uppercase;
}
.release-tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--tag-color, var(--color-accent)); }
.release-tag.new { --tag-color: var(--color-positive); }
.release-tag.fixed { --tag-color: var(--color-warning); }
.release-tag.improved { --tag-color: var(--color-accent); }
.release-copy h3 {
    max-width: 720px; font-family: var(--font-display); font-size: clamp(27px, 3vw, 36px);
    font-weight: 400; line-height: 1.08;
}
.release-copy > p { max-width: 760px; margin-top: 13px; color: var(--color-text-muted); font-size: 15px; line-height: 1.65; }
.release-copy ul {
    display: grid; gap: 8px; max-width: 780px; margin: 20px 0 0; padding: 18px 0 0;
    border-top: 1px solid var(--color-border); list-style: none;
}
.release-copy li {
    position: relative; padding-left: 18px; color: var(--color-text-muted); font-size: 14px; line-height: 1.55;
}
.release-copy li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 7px; height: 1px; background: var(--color-accent); }
.release-copy code { font-family: var(--font-mono); font-size: 0.88em; color: var(--color-text); }
.release.featured .release-copy { position: relative; }
.release.featured .release-copy::before { content: ""; position: absolute; left: -18px; top: 3px; bottom: 3px; width: 2px; background: var(--color-accent); }

.release-page footer { border-top: 1px solid var(--color-border-strong); }

@media (max-width: 780px) {
    .release-hero { padding: 112px 18px 58px; }
    .release-hero h1 { font-size: 54px; }
    .release-index { padding: 56px 18px 90px; }
    .release-month { grid-template-columns: minmax(0, 1fr); gap: 30px; }
    .month-rail { position: static; display: flex; align-items: baseline; gap: 10px; }
    .month-rail span { margin: 0; }
    .month-rail h2 { font-size: 30px; }
    .release { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 28px 0 32px; }
    .release-meta { display: flex; align-items: center; gap: 12px; }
    .release.featured .release-copy::before { left: -10px; }
}

@media (max-width: 480px) {
    .release-hero h1 { font-size: 46px; }
    .release-copy h3 { font-size: 28px; }
}