:root{
  --bg:#EDEEEC;
  --bg-raised:#E2E4E0;
  --ink:#15161A;
  --ink-muted:#5B5F5A;
  --accent:#B96A16;
  --accent-ink:#3C2200;
  --blueprint:#3D5A6C;
  --rule:#C7C9C3;
  --ok:#4C7A4C;
  --async:#7A4C8A;
  --mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --sans: 'IBM Plex Sans', -apple-system, sans-serif;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#131412;
    --bg-raised:#1B1D19;
    --ink:#EDEAE2;
    --ink-muted:#9B9C93;
    --accent:#E8A93A;
    --accent-ink:#241400;
    --blueprint:#8FB2C6;
    --rule:#33352F;
    --ok:#7FBB7F;
    --async:#C79BD6;
  }
}
*{box-sizing:border-box; margin:0; padding:0;}
html{background:var(--bg);}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--accent); color:var(--accent-ink);}
a{color:var(--blueprint); text-decoration-thickness:1px; text-underline-offset:3px;}
a:hover{color:var(--accent);}
a:focus-visible, button:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

.wrap{max-width:720px; margin:0 auto; padding:0 24px;}

/* ---- hatch: the signature motif — a thin cross-hatch strip standing in
   for the hatching used on foundation/earth cross-sections in structural
   drawings. Reused as every section divider on every page. ---- */
.hatch{
  height:10px;
  background-image:repeating-linear-gradient(
    -45deg,
    var(--rule) 0, var(--rule) 1px,
    transparent 1px, transparent 8px
  );
  opacity:.9;
}

header{
  padding:20px 0;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-family:var(--mono);
}
.logo{font-weight:600; font-size:15px; letter-spacing:.02em;}
.logo b{color:var(--accent); font-weight:700;}
.logo a{color:inherit; text-decoration:none;}
.hdr-right{display:flex; align-items:center; gap:18px; font-size:13px;}
nav.crumbs{display:flex; gap:14px; color:var(--ink-muted);}
nav.crumbs a{color:var(--ink-muted);}
nav.crumbs a:hover{color:var(--accent);}
.langs{font-size:13px; color:var(--ink-muted);}
.langs button{
  background:none; border:none; color:var(--ink-muted); font-family:var(--mono);
  font-size:13px; cursor:pointer; padding:2px 4px;
}
.langs button[aria-current="true"]{color:var(--ink); font-weight:600; text-decoration:underline; text-underline-offset:3px;}
.langs span{color:var(--rule); margin:0 2px;}

main{padding-bottom:64px;}

.hero{padding:56px 0 36px;}
.hero.compact{padding:44px 0 30px;}
.kicker{
  font-family:var(--mono); font-size:13px; color:var(--blueprint);
  text-transform:uppercase; letter-spacing:.08em; margin-bottom:18px;
}
h1{
  font-family:var(--mono); font-weight:700;
  font-size:clamp(28px, 5.4vw, 44px);
  line-height:1.15;
  letter-spacing:-.01em;
  max-width:16ch;
}
h1.page-title{font-size:clamp(24px, 4.6vw, 34px); max-width:none;}
.lede{
  margin-top:20px; max-width:56ch;
  font-size:17px; color:var(--ink-muted);
}
.badge{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:28px; padding:9px 14px;
  border:1px solid var(--accent);
  color:var(--accent-ink);
  background:color-mix(in srgb, var(--accent) 18%, transparent);
  font-family:var(--mono); font-size:13px; font-weight:600;
}
@media (prefers-color-scheme: dark){ .badge{color:var(--accent);} }
.badge::before{content:"●"; font-size:9px; position:relative; top:-1px;}

section{padding:36px 0;}
section.tight{padding:24px 0;}
.section-title{
  font-family:var(--mono); font-size:13px; color:var(--ink-muted);
  text-transform:uppercase; letter-spacing:.08em; margin-bottom:22px;
}
h2{
  font-family:var(--mono); font-size:19px; font-weight:600; margin-bottom:14px;
}
p + p{margin-top:12px;}
.prose{max-width:62ch; color:var(--ink-muted);}
.prose strong{color:var(--ink); font-weight:600;}

/* pill: sync/async + verb+method markers, reused across home list and doc pages */
.pill{
  display:inline-flex; align-items:center; gap:5px;
  font-family:var(--mono); font-size:11.5px; font-weight:600;
  padding:3px 8px; border:1px solid currentColor; letter-spacing:.03em;
}
.pill-sync{color:var(--ok);}
.pill-async{color:var(--async);}
.pill-method{
  font-family:var(--mono); font-size:11.5px; font-weight:700;
  padding:2px 7px; background:var(--bg-raised); color:var(--blueprint);
}

/* ---- home: API index ---- */
.api-list{list-style:none; display:flex; flex-direction:column; gap:0;}
.api{
  display:block;
  padding:20px 0;
  border-bottom:1px solid var(--rule);
  text-decoration:none; color:inherit;
}
.api:first-child{border-top:1px solid var(--rule);}
.api:hover .api-name{color:var(--accent);}
.api-top{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;}
.api-tag{
  font-family:var(--mono); font-size:12px; font-weight:600;
  color:var(--blueprint); letter-spacing:.03em;
}
.api-name{font-weight:600; font-size:16px;}
.api-desc{color:var(--ink-muted); font-size:14.5px; margin-top:5px; max-width:56ch;}
.api-arrow{margin-left:auto; font-family:var(--mono); color:var(--ink-muted); font-size:13px;}
.api:hover .api-arrow{color:var(--accent);}

.flow{
  font-family:var(--mono); font-size:14px;
  display:flex; flex-direction:column; gap:10px;
}
.flow-step{display:flex; gap:14px; align-items:baseline;}
.flow-num{color:var(--accent); font-weight:600; width:1.4em; flex:none;}
pre{
  background:var(--bg-raised); border:1px solid var(--rule);
  padding:16px; overflow-x:auto; font-family:var(--mono); font-size:13px;
  line-height:1.6; margin-top:18px;
}
pre code{color:var(--ink);}
.comment{color:var(--ink-muted);}

.limits-note{
  font-size:14.5px; color:var(--ink-muted); margin-top:16px; max-width:56ch;
}
.limits-note code{
  font-family:var(--mono); background:var(--bg-raised); padding:1px 5px; font-size:13px;
}

/* ---- API doc pages ---- */
.endpoint-row{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:12px 0; border-bottom:1px solid var(--rule);
  font-family:var(--mono); font-size:13.5px;
}
.endpoint-row:first-child{border-top:1px solid var(--rule);}
.endpoint-row code{font-size:13.5px;}
.endpoint-desc{color:var(--ink-muted); font-family:var(--sans); font-size:13.5px; margin-left:auto;}

table.spec{width:100%; border-collapse:collapse; font-size:14px; margin-top:4px;}
table.spec th, table.spec td{
  text-align:left; padding:10px 12px 10px 0; border-bottom:1px solid var(--rule);
  vertical-align:top;
}
table.spec th{
  font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.06em;
  color:var(--ink-muted); font-weight:600;
}
table.spec code{font-family:var(--mono); font-size:12.5px; background:var(--bg-raised); padding:1px 5px;}
table.spec td.status{font-family:var(--mono); font-weight:600;}

.field-required{color:var(--accent); font-size:11px; font-family:var(--mono); margin-left:6px;}

footer{
  padding:28px 0 40px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  font-family:var(--mono); font-size:12.5px; color:var(--ink-muted);
}
footer a{color:var(--ink-muted);}
footer a:hover{color:var(--accent);}

[data-lang]{display:none;}
html[data-active-lang="pt"] [data-lang="pt"]{display:block;}
html[data-active-lang="pt"] span[data-lang="pt"]{display:inline;}
html[data-active-lang="en"] [data-lang="en"]{display:block;}
html[data-active-lang="en"] span[data-lang="en"]{display:inline;}

@media (prefers-reduced-motion:no-preference){
  .badge{animation:pulse 3s ease-in-out infinite;}
}
@keyframes pulse{ 0%,100%{opacity:1;} 50%{opacity:.7;} }
