*{box-sizing:border-box;margin:0;padding:0}
body{background:radial-gradient(70% 50% at 10% 0%,rgba(28,107,79,.55),transparent 70%),radial-gradient(50% 40% at 100% 0%,rgba(225,110,86,.2),transparent 70%),var(--night);background-repeat:no-repeat;color:var(--text);font-family:Inter,system-ui,sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:var(--mint-glow)}
.wrap{width:min(820px,100% - 32px);margin-inline:auto}
nav{padding:22px 0;display:flex;justify-content:space-between;align-items:center}
.brand{display:flex;align-items:center;gap:10px;font-family:Sora,sans-serif;font-weight:700;font-size:20px;color:var(--text);text-decoration:none}
.brand img{width:34px;height:34px;border-radius:10px}
.switch{display:flex;gap:6px;padding:4px;border-radius:99px;border:1px solid var(--edge);background:rgba(255,255,255,.04)}
.switch a{padding:7px 14px;border-radius:99px;font-size:14px;color:var(--muted);text-decoration:none}
.switch a.on{background:rgba(127,227,180,.14);color:var(--text)}
header{padding:50px 0 36px}
h1{font-family:Sora,sans-serif;font-size:clamp(36px,6vw,54px);letter-spacing:-.02em;line-height:1.1;background:linear-gradient(180deg,#fff 20%,var(--mint-glow));-webkit-background-clip:text;background-clip:text;color:transparent}
.updated{display:inline-block;margin:18px 0 14px;font-size:13px;color:var(--mint-glow);padding:5px 12px;border:1px solid var(--edge);border-radius:99px}
.intro{color:var(--muted);font-size:18px}
.toc{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.toc a{font-size:13px;padding:6px 12px;border-radius:99px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:var(--muted);text-decoration:none}
.toc a:hover{color:var(--text);border-color:var(--mint-glow)}
section{position:relative;margin-bottom:18px;padding:28px 30px;border-radius:22px;background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);scroll-margin-top:20px}
section::before{content:"";position:absolute;inset:0 24px auto;height:1px;background:linear-gradient(90deg,transparent,var(--mint-glow),transparent);opacity:.45}
section h2{font-family:Sora,sans-serif;font-size:21px;margin-bottom:10px;display:flex;gap:12px;align-items:baseline}
section h2 span{font-size:13px;color:var(--mint-glow);opacity:.8}
section p,section li{color:#C9DAD2;font-size:16px}
section p+p,section ul,section ul+p{margin-top:10px}
section ul{padding-left:20px}
section li{margin:4px 0}
section.highlight{border-color:rgba(238,135,111,.35)}
section.highlight::before{background:linear-gradient(90deg,transparent,var(--coral-light),transparent)}
footer{padding:40px 0 50px;color:var(--muted);font-size:14px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px}
footer a{color:var(--muted)}
@media (max-width:560px){section{padding:22px 20px}nav{flex-wrap:wrap;gap:14px}}
@media print{body{background:#fff;color:#000}h1{color:#000;background:none;-webkit-text-fill-color:#000}section{border:1px solid #ccc;background:none}section p,section li,.intro{color:#222}nav,.toc,footer{display:none}}
.progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);z-index:10;background:linear-gradient(90deg,var(--mint-glow),var(--coral-light));box-shadow:0 0 10px var(--mint-glow)}
h1{background-size:100% 200%;animation:glow 6s ease-in-out infinite}
@keyframes glow{50%{background-position:0 100%}}
header>*{animation:up .9s cubic-bezier(.2,.8,.2,1) both}header>*:nth-child(2){animation-delay:.1s}header>*:nth-child(3){animation-delay:.2s}header>*:nth-child(4){animation-delay:.3s}
@keyframes up{from{opacity:0;transform:translateY(24px)}}
section{opacity:0;transform:translateY(30px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1),border-color .3s}
section.in{opacity:1;transform:none}
section:hover{border-color:rgba(127,227,180,.35)}
section:target{border-color:var(--mint-glow);box-shadow:0 0 40px -10px rgba(127,227,180,.5)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}section{opacity:1;transform:none}}
@media print{section{opacity:1;transform:none}.progress{display:none}}
