/* PAGE HEADER */
.page-header { padding-block:var(--sp-xl) var(--sp-lg);border-bottom:1px solid var(--stone);background:linear-gradient(150deg,var(--teal-pale) 0%,var(--cream) 60%);position:relative;overflow:hidden; }
.page-header::before { content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='30' cy='30' r='1.5' fill='%232A8B84' fill-opacity='.1'/%3E%3C/svg%3E");pointer-events:none;opacity:.65; }
.page-header-inner { position:relative; }
.breadcrumb { display:flex;align-items:center;gap:.4rem;margin-bottom:var(--sp-md);font-size:var(--t-xs);font-weight:500;color:var(--ink-faint); }
.breadcrumb a { color:var(--ink-soft);text-decoration:none;transition:color .15s; }
.breadcrumb a:hover { color:var(--teal); }
.breadcrumb-sep { color:var(--stone-mid);font-size:.75em;user-select:none; }
.breadcrumb [aria-current="page"] { color:var(--teal-dark); }
.page-kicker { display:inline-flex;align-items:center;gap:.5rem;font-size:var(--t-xs);font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--orange-dark);background:var(--orange-light);padding:.3rem .85rem;border-radius:var(--r-pill);width:fit-content;margin-bottom:var(--sp-sm); }
.page-title { font-family:'DM Serif Display',serif;font-size:var(--t-2xl);font-weight:400;line-height:1.1;letter-spacing:-.02em;color:var(--ink); }
.page-title em { font-style:italic;color:var(--teal); }
.page-subtitle { margin-top:var(--sp-sm);font-size:var(--t-md);color:var(--ink-soft);max-width:54ch;line-height:1.65; }

/* LAYOUT */
.page-body { padding-block:var(--sp-xl); }
.page-layout { display:grid;grid-template-columns:1fr;gap:var(--sp-xl);align-items:start; }
@media (min-width:900px) { .page-layout { grid-template-columns:210px 1fr;gap:clamp(2rem,5vw,4rem); } }

/* TOC */
.toc { position:sticky;top:calc(64px + var(--sp-md)); }
.toc-heading { font-size:var(--t-xs);font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:.75rem; }
.toc-list { display:flex;flex-direction:column;border-left:2px solid var(--stone); }
.toc-list a { display:block;font-size:var(--t-sm);color:var(--ink-soft);text-decoration:none;padding:.28rem 0 .28rem 1rem;border-left:2px solid transparent;margin-left:-2px;transition:color .15s,border-color .15s;line-height:1.4; }
.toc-list a:hover { color:var(--teal);border-left-color:var(--teal-mid); }
.toc-era { font-size:var(--t-xs);font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:.65rem 0 .2rem 1rem;line-height:1; }
.toc-era--edu  { color:var(--teal-dark); }
.toc-era--pysi { color:var(--orange-dark); }
@media (max-width:899px) { .toc { display:none; } }

/* CHANGELOG */
.changelog { max-width:72ch; }

.era { margin-bottom:var(--sp-2xl); }

.era-divider { display:flex;align-items:center;gap:var(--sp-md);margin-bottom:var(--sp-lg);padding-bottom:var(--sp-md);border-bottom:2px solid var(--stone); }
.era-pill { font-family:var(--f-body);font-size:var(--t-xs);font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#fff;padding:.3rem .85rem;border-radius:var(--r-pill);white-space:nowrap;flex-shrink:0; }
.era-pill--edu  { background:var(--teal-dark); }
.era-pill--pysi { background:var(--orange-dark); }
.era-pill--old  { background:var(--stone-darker); }
.era-heading { font-family:'DM Serif Display',serif;font-size:var(--t-lg);font-weight:400;letter-spacing:-.01em;color:var(--ink);line-height:1.2; }
.era-note { font-size:var(--t-sm);color:var(--ink-faint);margin-top:.2rem; }

/* Release row */
.release { display:grid;grid-template-columns:130px 1fr;gap:0 var(--sp-md);margin-bottom:var(--sp-lg);position:relative; }
@media (max-width:540px) { .release { grid-template-columns:1fr;gap:var(--sp-xs) 0; } }

.release:not(:last-child) .rmeta::after { content:'';position:absolute;
    left:125px;
    /* left:119px; */
    top:18px;
    bottom:calc(-7px - var(--sp-lg)); 
    
    width:2px;background:var(--stone); }
@media (max-width:540px) { .release:not(:last-child) .rmeta::after { display:none; } }

.rmeta { position:relative;padding-top:.15rem; }

.vbadge { font-family:var(--f-mono);font-size:var(--t-xs);font-weight:500;padding:.2rem .55rem;border-radius:var(--r-md);display:inline-block;margin-bottom:.3rem;white-space:nowrap; }
.vbadge--edu  { color:var(--teal-dark);background:var(--teal-light); }
.vbadge--pysi { color:var(--orange-dark);background:var(--orange-light); }
.vbadge--old  { color:var(--ink-soft);background:var(--cream-dark);border:1px solid var(--stone); }

.rdot { position:absolute;right:-1px;top:8px;width:9px;height:9px;border-radius:50%;border:2px solid var(--cream);z-index:1; }
.rdot--edu  { background:var(--teal); }
.rdot--pysi { background:var(--orange); }
.rdot--old  { background:var(--stone-dark); }
@media (max-width:540px) { .rdot { display:none; } }

.rdate { font-size:var(--t-xs);color:var(--ink-faint);font-weight:500;display:block;line-height:1.4; }

.rtitle { font-weight:600;font-size:var(--t-base);color:var(--ink);line-height:1.3;margin-bottom:.4rem; }

.tags { margin-bottom:.5rem;display:flex;flex-wrap:wrap;gap:.3rem; }
.tag { font-size:var(--t-xs);font-weight:600;padding:.1rem .5rem;border-radius:var(--r-pill); }
.tag-new   { background:var(--teal-light);color:var(--teal-dark); }
.tag-fix   { background:var(--orange-light);color:var(--orange-dark); }
.tag-maint { background:var(--cream-dark);color:var(--ink-soft);border:1px solid var(--stone); }
.tag-first { background:var(--ink);color:#fff; }

.latest-tag { display:inline-flex;align-items:center;font-size:var(--t-xs);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--teal-dark);background:var(--teal-light);border:1px solid rgba(42,139,132,.3);padding:.15rem .55rem;border-radius:var(--r-pill);margin-left:.5rem;vertical-align:middle; }

.changes { display:flex;flex-direction:column;gap:.4rem; }
.change { display:flex;align-items:flex-start;gap:.65rem;font-size:var(--t-sm);color:var(--ink-mid);line-height:1.6; }
.change::before { content:'';display:block;width:6px;height:6px;border-radius:50%;background:var(--stone-dark);flex-shrink:0;margin-top:.52em; }

/* bottom links */
.cl-footer { border-top:1px solid var(--stone);padding-top:var(--sp-lg);margin-top:var(--sp-sm);display:flex;gap:.75rem;flex-wrap:wrap; }