:root{
  --ink:#171816;
  --paper:#f4f2ec;
  --accent:#667469;
  --accent-soft:#dce3dd;
  --coral:#9a745b;
  --sand:#e5dfd4;
  --acid:var(--accent);
  --orange:var(--coral);
  --blue:var(--accent);
  --soft:#e9e5dc;
  --line:#d4d0c7;
  --muted:#6b6d67;
}
.site-nav{background:rgba(244,242,236,.94)}
.language:hover,.start,.quick,.tabs button.active,.tabs button:hover{background:var(--accent);border-color:var(--accent)}
.start:hover{background:#4e6154}
.hero h1 em,.resource-side strong,.next span:hover{color:var(--accent)}
.browser-demo{box-shadow:24px 28px var(--sand)}
.request-line i{background:linear-gradient(90deg,transparent,#8ca091,transparent)}
.endpoint-dns{border-color:#94a69a;box-shadow:0 0 0 5px rgba(102,116,105,.14)}
.browser-demo>p span,.stage-card>span,.layer-stack span{color:#9daf9f}
.steps button:hover,.steps button.active{background:var(--accent-soft)}
.steps button.active{box-shadow:inset 3px 0 var(--accent)}
.dev-head span{color:#9bb0a0;border-color:#9bb0a0}
.waterfall i{background:linear-gradient(90deg,#83998a 0 18%,#a7b9aa 18% 62%,#c7aa84 62% 100%)}
.watch-section{background:#dde3dc}
.section-head.light>p{color:#59635b}
.why{border-left-color:var(--accent)}
.resource-meta .advanced{background:#626a65}
@media(max-width:800px){.steps button:hover,.steps button.active{box-shadow:inset 0 -3px var(--accent)}}