:root{
    --bg:#0f0f16;
    --grid:#1d1d28;
    --ink:#ffffff;
    --dim:#8f8f9c;
    --faint:#55555f;
    --pink:#ff1496;
    --pink-deep:#ff5cb8;
    --pink-soft:#1a0c16;
    --pink-line:#2e1626;
    --panel:#171720;
    --glow-top:rgba(255,20,150,.13);
  }
  html.light{
    --bg:#f5f5f8;
    --grid:#dddde8;
    --ink:#16161e;
    --dim:#6b6b80;
    --faint:#737387;
    --pink:#cc0066;
    --pink-deep:#990050;
    --pink-soft:#fef0f7;
    --pink-line:#f0c8e0;
    --panel:#ffffff;
    --glow-top:rgba(204,0,102,.07);
  }
  html.grey{
    --bg:#191108;
    --grid:#2e2208;
    --ink:#f0e0c0;
    --dim:#a08060;
    --faint:#7a6044;
    --pink:#ff1496;
    --pink-deep:#ff5cb8;
    --pink-soft:#261608;
    --pink-line:#3e2808;
    --panel:#231908;
    --glow:0 0 0 4px rgba(255,20,150,.24);
    --glow-top:rgba(255,20,150,.09);
    --on-pink:#000000;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html,body{height:100%}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:"JetBrains Mono",monospace;
    min-height:100vh;
    padding:clamp(16px,4vw,48px);
    background-image:
      linear-gradient(var(--grid) 1px,transparent 1px),
      linear-gradient(90deg,var(--grid) 1px,transparent 1px);
    background-size:46px 46px;background-position:center;
    position:relative;
    transition:background-color .25s,color .25s;
  }
  body::before{content:"";position:fixed;inset:0;pointer-events:none;
    background:radial-gradient(ellipse 80% 55% at 50% -8%,var(--glow-top),transparent 60%);}
  .wrap{max-width:760px;margin:0 auto;position:relative}
  header{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:8px}
  h1{font-family:"Archivo",sans-serif;font-weight:900;letter-spacing:.18em;font-size:clamp(26px,5vw,40px)}
  .back{font-size:12px;letter-spacing:.08em;color:var(--pink-deep);text-decoration:none;border-bottom:1px solid var(--pink-line)}
  .back:hover{color:var(--pink)}
  .sub{color:var(--dim);font-size:12px;letter-spacing:.06em;margin-bottom:28px;border-bottom:1.5px solid var(--pink-line);padding-bottom:16px}
  .rel{margin-bottom:30px}
  .rel-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
  .rel-ver{font-family:"Archivo",sans-serif;font-weight:700;font-size:20px;letter-spacing:.04em}
  .rel-date{color:var(--faint);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
  .badge{display:inline-block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:2px 8px;border-radius:3px;background:var(--pink);color:#000;font-weight:700}
  html.light .badge{color:#fff}
  ul{list-style:none;padding:0}
  li{position:relative;padding-left:20px;margin:8px 0;line-height:1.7;font-size:13px;color:var(--dim)}
  li::before{content:"›";position:absolute;left:2px;color:var(--pink-deep);font-weight:700}
  li b{color:var(--ink)}
  .tag-add{color:var(--pink-deep);font-weight:700;letter-spacing:.05em}
  footer{margin-top:40px;font-size:11px;color:var(--faint);letter-spacing:.06em;line-height:1.7;border-top:1.5px solid var(--pink-line);padding-top:16px}

/* status colors (externalized from inline styles) */
.s-good{color:#35c46a}
.s-warn{color:#e6a700}
.s-bad{color:#ff4d4f}

  .rel-group-name{display:flex;align-items:center;gap:14px;margin:34px 0 18px;font-family:"Archivo",sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--pink-deep);font-weight:700}
  .rel-group-name::before,.rel-group-name::after{content:"";flex:1;height:1px;background:var(--pink-line)}
  .tag-fixed{color:#35c46a;font-weight:700;letter-spacing:.05em}
  .tag-changed{color:#8888aa;font-weight:700;letter-spacing:.05em}
  .tag-docs{color:var(--pink-deep);font-weight:700;letter-spacing:.05em}
  .tag-new{color:var(--pink-deep);font-weight:700;letter-spacing:.05em}
  .archive-link{margin-top:32px;padding-top:16px;border-top:1.5px solid var(--pink-line);font-size:12px;letter-spacing:.06em;color:var(--dim)}
  .archive-link a{color:var(--pink-deep);text-decoration:none;border-bottom:1px solid var(--pink-line)}
  .archive-link a:hover{color:var(--pink)}
  code{font-family:"JetBrains Mono",monospace;font-size:11px;background:var(--panel);padding:1px 4px;border-radius:2px}
  kbd{font-family:"JetBrains Mono",monospace;font-size:11px;background:var(--panel);border:1px solid var(--grid);padding:1px 5px;border-radius:3px}
  li a{color:var(--pink-deep);text-decoration:none;border-bottom:1px solid var(--pink-line)}
  li a:hover{color:var(--pink)}

  /* Light-mode overrides: dark-background colours above fail on #f5f5f8 */
  html.light .tag-fixed{color:#1a7a3c}
  html.light .tag-changed{color:#5a5a82}
  html.light .s-good{color:#1a7a3c}
  html.light .s-warn{color:#a05c00}
  html.light .s-bad{color:#b91c1c}