:root{
    --base:#F2EFF0; --surface-hero:#F2EFF0; --surface-dark:#0F172A; --surface-white:#FFFFFF; --sec-pad:clamp(72px,10vw,128px);
    --surface:#FFFFFF;
    --sub:#F3F6FA;
    --line:#D3DBE5;
    --line2:#BFCAD9;
    --ink:#0F172A;
    --mute:#58687F;
    --faint:#8494A9;
    --cyan:#2FB7DA;
    --steel:#2C4F7C;
    --display:'Montserrat',system-ui,sans-serif;
    --body:'IBM Plex Sans',system-ui,sans-serif;
    --mono:'IBM Plex Mono',ui-monospace,monospace;
    --pad:clamp(20px,5vw,72px);
    --r:14px;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;background:var(--surface-hero);color:var(--ink);font-family:var(--body);font-size:17px;
    line-height:1.62;-webkit-font-smoothing:antialiased}
  .wrap{max-width:1240px;margin:0 auto;padding:0 var(--pad)}
  h1,h2{font-family:var(--display);font-weight:600;letter-spacing:-.024em;line-height:1.15;margin:0}
  p{margin:0}
  a{color:var(--steel)}
  a:hover{color:var(--ink)}

  /* Header — identical to the five main pages (sticky, blurred, 82px bar, 1440px
     measure, full nav + CTA). The page body keeps its own narrower 1240px wrap. */
  header{position:sticky;top:0;z-index:60;background:rgba(242,239,240,.86);backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);transition:background .3s}
  header.stuck{background:rgba(242,239,240,.97)}
  .bar{display:flex;align-items:center;gap:34px;height:82px;max-width:1440px;margin:0 auto;padding:0 var(--pad)}
  .mark{display:flex;align-items:center;gap:11px;text-decoration:none;font-family:var(--display);
    font-weight:600;letter-spacing:.11em;font-size:15px}
  .nav{display:flex;gap:26px;margin-left:auto;font-size:15px}
  .nav a{text-decoration:none;color:var(--mute);position:relative}
  .nav a:hover{color:var(--ink)}
  .btn{display:inline-flex;align-items:center;font-family:var(--body);font-weight:500;font-size:15px;
    padding:12px 24px;border-radius:0;text-decoration:none;border:1px solid transparent;cursor:pointer;
    transition:transform .18s,background .18s,border-color .18s,color .18s}
  .btn-primary{background:var(--ink);color:#fff}
  .btn-primary:hover{background:var(--steel)}
  @media (max-width:900px){ .nav{display:none} }

  main{padding:clamp(48px,7vw,88px) 0}
  .eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
    color:var(--faint);margin:0 0 16px}
  h1{font-size:clamp(28px,4vw,40px)}
  .updated{font-family:var(--mono);font-size:12.5px;color:var(--faint);margin-top:14px}
  .intro{margin-top:24px;color:var(--mute);font-size:16.5px}

  section{margin-top:clamp(36px,5vw,52px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line)}
  section h2{font-size:19px;margin-bottom:14px}
  section p,section li{color:var(--mute);font-size:15.5px}
  section p+p,section ul+p,section p+ul{margin-top:12px}
  section ul{padding-left:20px;margin:12px 0 0}
  section li+li{margin-top:6px}
  .flag{display:inline-block;margin-top:2px;font-family:var(--mono);font-size:12px;color:#C89B3C;
    background:rgba(200,155,60,.1);border:1px solid rgba(200,155,60,.3);border-radius:6px;padding:2px 8px}
  .scope-label{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
    color:var(--cyan);margin-bottom:8px;display:block}

  footer{border-top:1px solid var(--line);padding:32px 0;margin-top:40px}
  footer p{font-family:var(--mono);font-size:12px;color:var(--faint);max-width:1240px;margin:0 auto;padding:0 var(--pad)}
  :focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:4px}