.changelog-page{background:#f4ecdf}.change-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.55fr);gap:clamp(38px,8vw,130px);align-items:end;padding:clamp(76px,9vw,132px) clamp(22px,7vw,100px);background:linear-gradient(120deg,#07172a,#0b2949);color:#fff}.change-hero h1{max-width:930px}.change-purpose{max-width:810px;color:rgba(255,255,255,.75);font-size:clamp(1.08rem,1.5vw,1.32rem)}.change-hero aside{display:grid;gap:8px;padding:28px;border-top:4px solid var(--gold,#e4b85d);background:rgba(255,255,255,.07)}.change-hero aside>span,.release-entry header span{color:var(--gold,#e4b85d);font:800 .64rem/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.09em;text-transform:uppercase}.change-hero aside strong{font:500 1.65rem/1.15 Georgia,"Times New Roman",serif}.change-hero aside time{color:rgba(255,255,255,.65)}.change-hero aside p{margin:14px 0 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.58);font-size:.82rem}.change-method{background:#fff}.change-method>div:first-child{display:grid;grid-template-columns:auto 1fr;gap:25px;align-items:end}.change-method h2{margin:0}.method-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:42px;border:1px solid var(--line,#d9cfbf);background:var(--line,#d9cfbf)}.method-grid article{padding:25px;background:var(--paper,#fffdf8)}.method-grid span{color:var(--accent-text,#87401d);font:800 .65rem/1 ui-monospace,SFMono-Regular,Consolas,monospace}.method-grid h3{margin:24px 0 8px;font:500 1.55rem/1 Georgia,"Times New Roman",serif}.method-grid p{margin:0;color:var(--muted,#5b656f);font-size:.87rem}.status-key{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr;gap:12px 20px;align-items:center;margin-top:22px;padding:20px;background:#f4ede2}.status-key p{margin:0;color:var(--muted,#5b656f);font-size:.8rem}.status{display:inline-flex;align-items:center;justify-content:center;width:max-content;padding:7px 9px;font:850 .6rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.06em;text-transform:uppercase}.status.live{background:#dcefe3;color:#135536}.status.pending{background:#fff0c8;color:#76520b}.status.planned{background:#dfe9f5;color:#244b72}.change-log{background:#f4ecdf}.log-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);gap:30px 80px;align-items:end}.log-heading h2{margin:0}.log-heading>p{margin:0;color:var(--muted,#5b656f);font-size:1.02rem}.release-list{display:grid;gap:18px;margin-top:44px}.release-entry{border:1px solid var(--line,#d9cfbf);background:#fff;box-shadow:0 10px 28px rgba(7,23,42,.045)}.release-entry.featured{border-top:5px solid var(--copper,#87401d)}.release-entry>header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px;border-bottom:1px solid var(--line,#d9cfbf);background:#f8f2e8}.release-entry>header>div{display:flex;align-items:center;gap:16px}.release-entry header span{color:var(--accent-text,#87401d)}.release-entry header time{color:var(--muted,#5b656f);font-size:.78rem}.release-entry>h3{margin:0;padding:26px 24px 20px;font:500 clamp(1.65rem,2.5vw,2.45rem)/1.08 Georgia,"Times New Roman",serif;color:var(--navy,#0b2544)}.change-grid{display:grid;grid-template-columns:.75fr .75fr 1.5fr;gap:1px;margin:0 24px 24px;background:var(--line,#d9cfbf);border:1px solid var(--line,#d9cfbf)}.change-grid>div{padding:22px;background:#fff}.change-grid b{display:block;margin-bottom:11px;color:var(--accent-text,#87401d);font:850 .64rem/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.07em;text-transform:uppercase}.change-grid p,.change-grid li{color:#586572;font-size:.86rem}.change-grid p{margin:0}.change-grid ul{margin:0;padding-left:18px}.change-grid li+li{margin-top:6px}.release-entry>footer{display:flex;gap:18px;flex-wrap:wrap;padding:0 24px 24px;background:transparent;color:var(--accent-text,#87401d);font-size:.76rem;font-weight:850}.release-entry>footer a{text-decoration:none}.release-entry>footer a:hover{text-decoration:underline}.pending-register{background:#08182b;color:#fff}.pending-register .eyebrow{color:var(--gold,#e4b85d)}.pending-register .log-heading>p{color:rgba(255,255,255,.65)}.pending-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:40px}.pending-grid article{padding:23px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13)}.pending-grid h3{margin:24px 0 9px;font:500 1.35rem/1.1 Georgia,"Times New Roman",serif}.pending-grid p{margin:0;color:rgba(255,255,255,.66);font-size:.85rem}.change-close{display:grid;justify-items:start;padding:clamp(76px,9vw,125px) clamp(22px,7vw,100px);background:var(--copper,#87401d);color:#fff}.change-close .eyebrow{color:#ffe0b0}.change-close blockquote{max-width:1200px;margin:0 0 35px;font:500 clamp(2.3rem,5vw,5rem)/1.02 Georgia,"Times New Roman",serif;letter-spacing:-.04em}.change-close .button{background:var(--night,#07172a);border-color:var(--night,#07172a)}
@media(max-width:1000px){.change-hero,.log-heading{grid-template-columns:1fr}.method-grid,.pending-grid{grid-template-columns:repeat(2,1fr)}.change-grid{grid-template-columns:1fr 1fr}.change-grid>div:last-child{grid-column:1/-1}.status-key{grid-template-columns:auto 1fr}}
@media(max-width:640px){.change-hero{grid-template-columns:1fr;padding:58px 20px}.change-hero h1{font-size:clamp(3rem,15vw,4.4rem)}.method-grid,.pending-grid,.change-grid{grid-template-columns:1fr}.change-grid>div:last-child{grid-column:auto}.change-grid{margin:0 15px 18px}.release-entry>h3{padding:22px 17px 17px}.release-entry>header{align-items:flex-start;padding:16px}.release-entry>header>div{align-items:flex-start;flex-direction:column;gap:4px}.release-entry>footer{padding:0 17px 20px}.status-key{grid-template-columns:auto 1fr;padding:16px}.change-method>div:first-child{grid-template-columns:1fr;gap:0}}

/* Contrast: inside a dark panel the accent takes its lighter variant.
   A dark panel is a rule that sets both a dark background and light text;
   anything less is a card or a border, and its accent stays as it is. */
.change-hero,
.pending-register{--accent-text:var(--copper-on-dark,#d4834a)}

/* Contrast: a release entry is a light card, whatever its header does. */
.release-entry,.release-entry>footer{--accent-text:var(--copper,#87401d)}
