*{box-sizing:border-box;margin:0;padding:0}
    :root{--bg:#0F172A;--surface:#1E293B;--surface2:#162032;--emerald:#10B981;--emerald-glow:rgba(16,185,129,0.15);--emerald-glow2:rgba(16,185,129,0.07);--white:#F8FAFC;--muted:#94A3B8;--border:rgba(16,185,129,0.18)}
    body{background:var(--bg);color:var(--white);font-family:'DM Sans',sans-serif;line-height:1.8}
    nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:1.25rem 5%;background:rgba(15,23,42,0.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}
    .nav-logo{font-family:'Syne',sans-serif;font-weight:800;font-size:1.1rem;color:var(--white);text-decoration:none;display:flex;align-items:center;gap:.5rem}
    .nav-logo span{color:var(--emerald)}
    .nav-back{font-family:'DM Mono',monospace;font-size:.75rem;color:var(--muted);text-decoration:none;text-transform:uppercase;letter-spacing:.08em;transition:color .2s}
    .nav-back:hover{color:var(--emerald)}
    .wrap{max-width:780px;margin:0 auto;padding:9rem 5% 6rem}
    .page-label{font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--emerald);display:block;margin-bottom:1rem}
    h1{font-family:'Syne',sans-serif;font-weight:800;font-size:clamp(2rem,5vw,3rem);margin-bottom:1rem}
    .meta{font-family:'DM Mono',monospace;font-size:.78rem;color:var(--muted);display:flex;gap:2rem;flex-wrap:wrap;padding-bottom:2.5rem;border-bottom:1px solid var(--border);margin-bottom:3rem}
    .intro{background:var(--emerald-glow2);border:1px solid var(--border);border-left:3px solid var(--emerald);border-radius:8px;padding:1.5rem 1.8rem;margin-bottom:3rem}
    .intro p{font-size:.95rem;color:var(--muted)}
    .intro strong{color:var(--emerald)}
    .section{margin-bottom:3rem}
    .section h2{font-family:'Syne',sans-serif;font-size:1.2rem;font-weight:700;display:flex;align-items:center;gap:.6rem;padding-bottom:.6rem;border-bottom:1px solid var(--border);margin-bottom:1rem}
    .num{font-family:'DM Mono',monospace;font-size:.75rem;color:var(--emerald);background:var(--emerald-glow);padding:.2rem .5rem;border-radius:4px}
    .section p{color:var(--muted);font-size:.95rem;margin-bottom:1rem}
    .section ul{list-style:none;display:flex;flex-direction:column;gap:.5rem;margin:.8rem 0 1rem}
    .section ul li{color:var(--muted);font-size:.95rem;padding-left:1.4rem;position:relative}
    .section ul li::before{content:'▸';color:var(--emerald);position:absolute;left:0;font-size:.8rem;top:.15rem}
    .card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:1.5rem;margin:1.2rem 0}
    .card-title{font-family:'Syne',sans-serif;font-size:.9rem;font-weight:700;color:var(--emerald);margin-bottom:.5rem}
    .card p{color:var(--muted);font-size:.88rem;margin:0}
    .contact-box{background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:2rem;text-align:center;margin-top:3rem}
    .contact-box p{color:var(--muted);font-size:.95rem;margin-bottom:1rem}
    .contact-box a{font-family:'DM Mono',monospace;color:var(--emerald);text-decoration:none;font-size:.95rem}
    .em{color:var(--emerald);text-decoration:none}
    footer{border-top:1px solid var(--border);padding:2rem 5%;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
    .fl{font-family:'Syne',sans-serif;font-weight:800;color:var(--white);text-decoration:none;display:flex;align-items:center;gap:6px}
    .fl span{color:var(--emerald)}
    .flinks{display:flex;gap:1.5rem;flex-wrap:wrap}
    .flinks a{font-family:'DM Mono',monospace;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);text-decoration:none;transition:color .2s}
    .flinks a:hover{color:var(--emerald)}
    .fc{font-family:'DM Mono',monospace;font-size:.72rem;color:var(--muted);opacity:.5}
    @media(max-width:768px){footer{flex-direction:column;text-align:center}.flinks{justify-content:center}}

/* Utility classes replacing inline styles */
.nav-logo img { width: 28px; height: 28px; border-radius: 7px; }
.fl img { width: 24px; height: 24px; border-radius: 6px; }
.footer-email-link { text-transform: none; letter-spacing: 0; color: var(--emerald); }
.contact-note { margin-top: 1rem; font-size: .8rem; color: var(--muted); }
.card-danger { border-color: rgba(239,68,68,0.5); background: rgba(239,68,68,0.07); }
.card-title-danger { color: #f87171; }
.card-warning-p { color: #fca5a5; font-weight: 500; margin-bottom: .8rem; }
.text-red { color: #ef4444; }
.card-meta-p { color: var(--muted); font-size: .85rem; margin: 0; }
.text-white { color: var(--white); }
.card-success { border-color: rgba(16,185,129,0.4); }

/* Skip-to-content — WCAG 2.4.1 Level A */
.skip-link {
  position: absolute;
  top: -48px;
  left: 1rem;
  background: #10B981;
  color: #0F172A;
  padding: 0.5rem 1.1rem;
  border-radius: 0 0 6px 6px;
  z-index: 9999;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  transition: top 0.15s ease;
}
.skip-link:focus { top: 0; outline: 2px solid #0F172A; outline-offset: 2px; }