/* ===== Theme (high contrast) ===== */
  :root{
    --bg:#081312;        /* black-ish */
    --panel:#0f1b19;
    --panel-2:#111;
    --text:#f5f8f7;
    --muted:#c9d3d0;
    --yellow:#ffd700;    /* headings */
    --green:#3bd783;     /* section titles, links, buttons */
    --line:#2b3a37;
    --focus:#fff;
  }
  html,body{margin:0}
  body{
    background:var(--bg); color:var(--text);
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    line-height:1.65;
  }
  *{box-sizing:border-box}
  img,svg{max-width:100%;height:auto;display:block}

  .container{max-width:1200px;margin-inline:auto;padding-inline:24px}
  a{color:var(--green)}
  a:hover{color:#a8ffd0}
  code{background:#303030;color:#fff;padding:.15rem .35rem;border-radius:.35rem}
  pre{background:#111;padding:1rem;border-radius:.6rem;overflow:auto}

  /* ===== Layout elements ===== */
  .skip-link{
    position:absolute;left:-9999px;top:auto
  }
  .skip-link:focus{
    left:12px;top:12px;background:#000;color:#fff;padding:.5rem .75rem;border-radius:.5rem;z-index:9999
  }

  header.site-header{padding:24px 0;border-bottom:1px solid var(--line)}
  .heading-xl{color:var(--yellow);font-size:2.8rem;line-height:1.15;margin:.5rem 0 1rem}
  .lede{color:var(--muted);font-size:1.1rem;max-width:75ch}
  .logo{width:120px;height:auto;border-radius:50%}

  .section{padding:2rem 0;border-bottom:1px solid var(--line)}
  .section:last-of-type{border-bottom:0}
  .section h2{
    color:var(--green);
    font-size:2rem;margin:0 0 .6rem
  }
  .section h3{
    color:var(--yellow);margin:1.2rem 0 .4rem;font-size:1.4rem
  }
  .grid{
    display:grid;gap:1.25rem;
    grid-template-columns: repeat(12, 1fr);
  }
  .col-7{grid-column: span 7}
  .col-5{grid-column: span 5}
  @media (max-width: 900px){
    .grid{grid-template-columns: 1fr}
    .col-7,.col-5{grid-column: auto}
  }

  /* ===== Callouts & Tables ===== */
  .callout{
    background:var(--panel);
    border:1px solid var(--line);
    border-left:6px solid var(--green);
    padding:1rem 1rem 1rem 1.2rem;border-radius:.75rem;color:var(--text)
  }
  .callout-yellow{border-left-color:var(--yellow)}
  .callout-red{border-left-color:#ff5a5a}
  .stack > * + *{margin-top:.75rem}

  table{
    border-collapse:separate;border-spacing:0;width:100%;
    background:#0f1514;border:1px solid var(--line);border-radius:.75rem;overflow:hidden
  }
  th,td{padding:.8rem 1rem;text-align:left}
  th{background:#0a1110;color:#cfe8df;font-weight:700}
  tr + tr td{border-top:1px solid var(--line)}
  .tag{display:inline-block;background:#133b31;border:1px solid #1f5a49;color:#caffea;
       padding:.15rem .45rem;border-radius:.45rem;font-size:.85rem}

  /* ===== Footer ===== */
  footer{padding:2.2rem 0;border-top:1px solid var(--line);text-align:center;color:#aebbb7}