/* ============================================================
   ELVEN OBSERVABILITY — CHANGELOG
   Tokens derivados do brand locked da Elven (decks-skill v0.1.0):
   teal #00bfa5 / teal-2 #00897b / ink #0f1923 / paper #f4f7f8
   red #ff5252 / amber #fbbf24 / blue #0d47a1
   Variantes escuras derivadas apenas onde o contraste AA exige.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", "IBM Plex Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --page-max: 78rem;
  --rail-w: 15.5rem;
  --content-w: 42.5rem;
  --jump-w: 11rem;
  --gutter: 2rem;

  --r-sm: 4px; --r-md: 6px; --r-lg: 8px; --r-pill: 999px;
  --t-fast: .1s ease;
  --t-med: .18s cubic-bezier(.4,0,.2,1);

  /* LIGHT — paper #f4f7f8 do brand */
  --bg: #F4F7F8;
  --bg-raised: #FFFFFF;
  --surface: rgba(15,25,35,.030);
  --surface-strong: rgba(15,25,35,.065);
  --text-1: #0F1923;
  --text-2: #475569;
  --text-3: #64748B;
  --border: #DCE3E7;
  --border-soft: rgba(15,25,35,.075);
  --dot-muted: #C0C9CE;
  --accent: #00897B;
  --accent-soft: rgba(0,137,123,.10);
  --danger: #C62828;
  --danger-soft: rgba(198,40,40,.07);
  --danger-border: rgba(198,40,40,.26);
  --warn: #8A5A00;
  --warn-soft: rgba(251,191,36,.16);
  --warn-border: rgba(138,90,0,.24);
  --code-bg: #EDF1F3;
  --diff-add-bg: rgba(22,101,52,.08); --diff-add-fg: #166534;
  --diff-del-bg: rgba(180,35,24,.08); --diff-del-fg: #B42318;
  --focus: #0d47a1;
  --shadow-pop: 0 1rem 3rem rgba(15,25,35,.18);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0F1923; --bg-raised: #142638;
    --surface: rgba(255,255,255,.035); --surface-strong: rgba(255,255,255,.085);
    --text-1: #F1F5F7; --text-2: #C3CDD6; --text-3: #8B98A5;
    --border: #223244; --border-soft: rgba(255,255,255,.065);
    --dot-muted: #35485C;
    --accent: #00BFA5; --accent-soft: rgba(0,191,165,.15);
    --danger: #FF5252; --danger-soft: rgba(255,82,82,.11); --danger-border: rgba(255,82,82,.30);
    --warn: #FBBF24; --warn-soft: rgba(251,191,36,.11); --warn-border: rgba(251,191,36,.26);
    --code-bg: #0B1220;
    --diff-add-bg: rgba(74,222,128,.10); --diff-add-fg: #6EE7A0;
    --diff-del-bg: rgba(255,82,82,.10); --diff-del-fg: #FF8F8F;
    --focus: #5B9BFF;
    --shadow-pop: 0 1rem 3rem rgba(0,0,0,.45);
  }
}
:root[data-theme="dark"] {
  --bg: #0F1923; --bg-raised: #142638;
  --surface: rgba(255,255,255,.035); --surface-strong: rgba(255,255,255,.085);
  --text-1: #F1F5F7; --text-2: #C3CDD6; --text-3: #8B98A5;
  --border: #223244; --border-soft: rgba(255,255,255,.065);
  --dot-muted: #35485C;
  --accent: #00BFA5; --accent-soft: rgba(0,191,165,.15);
  --danger: #FF5252; --danger-soft: rgba(255,82,82,.11); --danger-border: rgba(255,82,82,.30);
  --warn: #FBBF24; --warn-soft: rgba(251,191,36,.11); --warn-border: rgba(251,191,36,.26);
  --code-bg: #0B1220;
  --diff-add-bg: rgba(74,222,128,.10); --diff-add-fg: #6EE7A0;
  --diff-del-bg: rgba(255,82,82,.10); --diff-del-fg: #FF8F8F;
  --focus: #5B9BFF;
  --shadow-pop: 0 1rem 3rem rgba(0,0,0,.45);
}

html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--text-1);
  font-family: var(--font-sans); font-size: 1.0625rem; line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 2px; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: inherit; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
h1,h2,h3,h4 { margin: 0; text-wrap: balance; font-weight: 590; }
strong, b { font-weight: 590; }
p { margin: 0; }
ul, ol { margin: 0; padding-left: 1.25rem; }
li { margin: .25rem 0; }
.sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip { position:absolute; left:.5rem; top:-3rem; z-index:99; background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-md); padding:.5rem .75rem; transition:top var(--t-fast); }
.skip:focus { top:.5rem; }

/* ---------- code / tables / callouts ---------- */
code {
  font-family: var(--font-mono); font-size: .875em;
  background: var(--code-bg); border: 1px solid var(--border-soft);
  border-radius: .25em; padding: .1em .28em; color: var(--text-1);
  overflow-wrap: break-word;
}
pre {
  font-family: var(--font-mono); font-size: .8125rem; line-height: 1.6;
  background: var(--code-bg); border: 1px solid var(--border);
  border-radius: var(--r-lg); padding: .875rem 1rem; margin: 0;
  overflow-x: auto; color: var(--text-2); tab-size: 2;
}
pre code { background: none; border: 0; padding: 0; font-size: inherit; }
.code-wrap { position: relative; margin: 1rem 0; }
.code-wrap .lang { position:absolute; top:.5rem; right:.625rem; font-size:.625rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-3); font-family:var(--font-mono); pointer-events:none; }
.code-wrap .copy { position:absolute; top:.375rem; right:.375rem; opacity:0; font-size:.75rem; color:var(--text-3); background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-sm); padding:.125rem .5rem; transition:opacity var(--t-fast); }
.code-wrap:hover .copy, .code-wrap:focus-within .copy { opacity:1; }
@media (pointer:coarse) { .code-wrap .copy { opacity:1; } }
.code-wrap:hover .lang, .code-wrap:focus-within .lang { opacity:0; }
.diff-path { font-family:var(--font-mono); font-size:.75rem; color:var(--text-3); margin-bottom:.375rem; }
.dl { display:block; }
.dl.add { background: var(--diff-add-bg); color: var(--diff-add-fg); }
.dl.del { background: var(--diff-del-bg); color: var(--diff-del-fg); }

.table-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:var(--r-lg); margin:1rem 0; }
table { width:100%; border-collapse:collapse; font-size:.9375rem; }
th { text-align:left; font-size:.75rem; font-weight:590; letter-spacing:.06em; text-transform:uppercase; color:var(--text-3); padding:.625rem .75rem; border-bottom:1px solid var(--border); white-space:nowrap; background:var(--surface); }
td { padding:.5rem .75rem; border-bottom:1px solid var(--border-soft); color:var(--text-2); vertical-align:top; }
tr:last-child td { border-bottom:0; }
.tbl-cap { font-size:.8125rem; color:var(--text-3); margin-bottom:.375rem; }

.callout { border-left:3px solid; border-radius:0 var(--r-md) var(--r-md) 0; padding:.75rem 1rem; margin:1rem 0; font-size:1rem; line-height:1.6; }
.callout--nota { border-color:var(--border); background:var(--surface); color:var(--text-2); }
.callout--atencao { border-color:var(--warn); background:var(--warn-soft); color:var(--text-1); }
.callout--perigo { border-color:var(--danger); background:var(--danger-soft); color:var(--text-1); }
.callout .lbl { display:block; font-size:.6875rem; font-weight:590; letter-spacing:.06em; text-transform:uppercase; margin-bottom:.25rem; }
.callout--nota .lbl { color:var(--text-3); }
.callout--atencao .lbl { color:var(--warn); }
.callout--perigo .lbl { color:var(--danger); }

/* ---------- header ---------- */
.hdr {
  position:sticky; top:0; z-index:40; height:4.5rem;
  display:flex; align-items:center; gap:1rem;
  padding:0 2rem; border-bottom:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter:saturate(180%) blur(12px); -webkit-backdrop-filter:saturate(180%) blur(12px);
}
.brand { display:flex; align-items:center; gap:.625rem; min-width:0; }
.brand img { height:26px; width:auto; display:block; }
:root[data-theme="dark"] .brand img { filter: brightness(0) invert(1); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .brand img { filter: brightness(0) invert(1); } }
.brand .nm { font-size:.9375rem; font-weight:590; letter-spacing:-.01em; white-space:nowrap; }
.brand .sl { font-size:.9375rem; color:var(--text-3); white-space:nowrap; }
.hdr-sp { flex:1; }
.search { position:relative; }
.search input {
  width:16rem; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--r-md); padding:.4375rem .625rem .4375rem 2rem; font-size:.875rem;
  transition:border-color var(--t-fast), width var(--t-med);
}
.search input:focus { border-color:var(--accent); outline:none; box-shadow:0 0 0 3px var(--accent-soft); }
.search .ic { position:absolute; left:.5rem; top:50%; transform:translateY(-50%); color:var(--text-3); font-size:.875rem; pointer-events:none; }
.ghost { border:1px solid var(--border); border-radius:var(--r-md); padding:.375rem .625rem; font-size:.8125rem; color:var(--text-2); background:var(--bg-raised); transition:background var(--t-fast), border-color var(--t-fast); white-space:nowrap; }
.ghost:hover { background:var(--surface-strong); border-color:var(--text-3); }
.ghost.pri { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:510; }
.ghost.pri:hover { filter:brightness(1.08); }
.ghost.dgr { color:var(--danger); border-color:var(--danger-border); }
.ghost[disabled] { opacity:.45; cursor:not-allowed; }

/* ---------- page shell ---------- */
.wrap { max-width:var(--page-max); margin:0 auto; padding:0 2rem; }
.phead { padding-top:3.5rem; }
.phead h1 { font-size:3rem; line-height:1.02; letter-spacing:-.024em; }
.phead .sub { font-size:1.0625rem; line-height:1.6; color:var(--text-3); margin-top:.75rem; max-width:44rem; }
.policy { font-size:1.0625rem; line-height:1.7; color:var(--text-2); margin-top:1.5rem; max-width:44rem; }
.policy strong { color:var(--text-1); font-weight:590; }
details.pol { margin-top:1rem; max-width:44rem; }
details.pol > summary { font-size:.875rem; color:var(--accent); cursor:pointer; list-style:none; display:inline-flex; align-items:center; gap:.375rem; }
details.pol > summary::-webkit-details-marker { display:none; }
details.pol > summary::before { content:"▸"; font-size:.75rem; transition:transform var(--t-fast); }
details.pol[open] > summary::before { transform:rotate(90deg); }
details.pol .pol-body { margin-top:.75rem; font-size:1rem; line-height:1.7; color:var(--text-2); padding-left:1rem; border-left:2px solid var(--border); }

/* ---------- sua instalação ---------- */
.install { margin-top:2.5rem; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:1.25rem; display:flex; flex-wrap:wrap; align-items:center; gap:1rem; }
.install .lbl { font-size:.6875rem; font-weight:590; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); }
.install select { background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-md); padding:.4375rem .625rem; font-size:.875rem; font-variant-numeric:tabular-nums; }
.install .verdict { font-size:.9375rem; color:var(--text-2); }
.install .verdict b { color:var(--text-1); font-weight:590; font-variant-numeric:tabular-nums; }
.install .metrics { display:flex; flex-wrap:wrap; gap:.75rem; font-size:.8125rem; color:var(--text-3); font-variant-numeric:tabular-nums; width:100%; }
.install .metrics .m { display:inline-flex; align-items:center; gap:.375rem; }
.install .metrics .m.bad { color:var(--danger); }
.install .metrics .m.warn { color:var(--warn); }

/* ---------- filters ---------- */
.filters { margin-top:2rem; padding-bottom:1rem; border-bottom:1px solid var(--border); display:flex; flex-direction:column; gap:.75rem; }
.seg { display:inline-flex; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md); padding:2px; gap:2px; }
.seg button { font-size:.8125rem; padding:.3125rem .75rem; border-radius:4px; color:var(--text-3); transition:background var(--t-fast), color var(--t-fast); white-space:nowrap; }
.seg button[aria-pressed="true"] { background:var(--bg-raised); color:var(--text-1); font-weight:510; box-shadow:0 1px 2px rgba(0,0,0,.06); }
.chips { display:flex; flex-wrap:wrap; gap:.375rem; align-items:center; }
.chip { font-size:.75rem; padding:.25rem .5625rem; border:1px solid var(--border); border-radius:var(--r-pill); color:var(--text-3); transition:all var(--t-fast); white-space:nowrap; font-variant-numeric:tabular-nums; }
.chip:hover { border-color:var(--text-3); color:var(--text-2); }
.chip[aria-pressed="true"] { background:var(--accent-soft); border-color:var(--accent); color:var(--accent); font-weight:510; }
.chip.imp[aria-pressed="true"] { background:var(--danger-soft); border-color:var(--danger-border); color:var(--danger); }
.chip.imp.warn[aria-pressed="true"] { background:var(--warn-soft); border-color:var(--warn-border); color:var(--warn); }
.chip .ct { opacity:.65; margin-left:.25rem; }
.chip-div { width:1px; height:1.125rem; background:var(--border); margin:0 .25rem; }
.fmeta { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; font-size:.8125rem; color:var(--text-3); font-variant-numeric:tabular-nums; }
.fmeta .clr { color:var(--accent); font-size:.8125rem; }
.soakavg { font-size:.8125rem; color:var(--text-3); font-variant-numeric:tabular-nums; }
.dep-banner { margin-top:1rem; font-size:.875rem; color:var(--text-2); background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:0 var(--r-md) var(--r-md) 0; padding:.625rem .875rem; }

/* ---------- layout ---------- */
.layout { display:grid; grid-template-columns:minmax(0,1fr); gap:var(--gutter); padding-top:3.5rem; }
@media (min-width:1280px) { .layout { grid-template-columns:minmax(0,1fr) var(--jump-w); } }
.feed { position:relative; min-width:0; }
.feed::before { content:""; position:absolute; left:9px; top:.5rem; bottom:0; width:1px; background:var(--border); }
@media (max-width:899px) { .feed::before { display:none; } }

.entry { display:grid; grid-template-columns:var(--rail-w) minmax(0,1fr); column-gap:2rem; padding-bottom:6rem; position:relative; scroll-margin-top:7rem; }
.entry.focused .etitle { background:var(--accent-soft); border-radius:var(--r-sm); }
.entry.yanked { opacity:.55; }
.month-eyebrow { grid-column:1/-1; font-size:.625rem; font-weight:590; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); padding-left:2rem; margin-bottom:1.5rem; }

.rail { position:sticky; top:6rem; align-self:start; display:flex; flex-direction:column; gap:.375rem; padding-left:2rem; }
.rail .dot { position:absolute; left:6px; top:.4375rem; width:7px; height:7px; border-radius:50%; background:var(--dot-muted); border:2px solid var(--bg); box-sizing:content-box; }
.rail .dot.on { background:var(--accent); }
.vchip { align-self:flex-start; font-family:var(--font-mono); font-size:.8125rem; line-height:1.125rem; font-weight:510; color:var(--accent); background:var(--accent-soft); border-radius:var(--r-md); padding:.125rem .4375rem; }
.vchip:hover { text-decoration:none; filter:brightness(1.05); }
.rdate { font-size:.875rem; line-height:1.4; color:var(--text-3); font-variant-numeric:tabular-nums; letter-spacing:-.005em; }
.rdate .k { display:block; font-size:.625rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); opacity:.75; }
.rstub { width:1px; height:12px; background:var(--border); margin-left:.25rem; }
.rsoak { font-size:.6875rem; line-height:1rem; color:var(--text-3); font-variant-numeric:tabular-nums; }
.rsoak.run { color:var(--accent); }
.rapplied { font-size:.6875rem; color:var(--text-3); margin-top:.25rem; }
.rdraft { font-size:.625rem; font-weight:590; letter-spacing:.08em; text-transform:uppercase; color:var(--warn); }

.content { max-width:var(--content-w); min-width:0; }

/* badges */
.deprow { display:flex; flex-wrap:wrap; align-items:center; gap:.25rem; }
.badge-dep { display:inline-flex; align-items:center; gap:.375rem; font-size:.75rem; line-height:1.125rem; font-weight:510; letter-spacing:.01em; padding:.1875rem .5rem; border-radius:var(--r-md); font-variant-numeric:tabular-nums; white-space:nowrap; }
.badge-dep .bd { width:6px; height:6px; border-radius:50%; flex:none; }
.badge-dep--saas { background:var(--surface-strong); border:1px solid var(--border); color:var(--text-1); }
.badge-dep--saas .bd { background:var(--text-2); }
.badge-dep--sh { background:transparent; border:1px solid var(--border); color:var(--text-2); }
.badge-dep--sh .bd { background:var(--text-3); }
.badge-dep--sh.is-planejado { border-style:dashed; color:var(--text-3); }
.badge-dep--sh.is-planejado .bd { background:transparent; box-shadow:inset 0 0 0 1px var(--text-3); }
.badge-dep--sh.is-na { opacity:.55; }
.badge-arrow { color:var(--text-3); font-size:.875rem; margin:0 .25rem; }
.soak-chip { font-size:.6875rem; line-height:1rem; color:var(--text-3); font-variant-numeric:tabular-nums; margin-left:.25rem; }
.soak-chip.is-running { color:var(--accent); }

.improw { display:flex; flex-wrap:wrap; gap:.375rem; margin-top:.625rem; }
.imp { font-size:.6875rem; line-height:1rem; font-weight:590; letter-spacing:.06em; text-transform:uppercase; padding:.1875rem .5rem; border-radius:var(--r-pill); border:1px solid; }
.imp.brk { color:var(--danger); border-color:var(--danger-border); background:var(--danger-soft); }
.imp.act { color:var(--warn); border-color:var(--warn-border); background:var(--warn-soft); }
.imp.sec { color:var(--danger); border-color:var(--danger-border); background:var(--danger-soft); }
.imp.mig { color:var(--text-2); border-color:var(--border); background:var(--surface); }

.etitle-wrap { margin-top:.75rem; display:flex; align-items:flex-start; gap:.5rem; }
.etitle { font-size:2rem; line-height:1.125; letter-spacing:-.022em; color:var(--text-1); display:block; padding:.75rem; margin:-.75rem; border-radius:var(--r-sm); transition:background var(--t-fast); }
a.etitle:hover { background:var(--surface); text-decoration:none; }
.clink { opacity:0; color:var(--text-3); font-size:.875rem; padding:.25rem; border-radius:var(--r-sm); transition:opacity var(--t-fast); flex:none; margin-top:.375rem; }
.etitle-wrap:hover .clink, .clink:focus { opacity:1; }
.esummary { font-size:1.0625rem; line-height:1.6; color:var(--text-2); margin-top:.75rem; }
.cstrip { margin-top:1rem; font-family:var(--font-mono); font-size:.8125rem; line-height:1.7; color:var(--text-3); }
.cstrip a { color:var(--text-3); border-bottom:1px solid var(--border-soft); }
.cstrip a:hover { color:var(--accent); text-decoration:none; border-color:var(--accent); }
.cstrip .sep { opacity:.5; margin:0 .375rem; }

.esec { margin-top:2.5rem; }
.esec > h3 { font-size:1.25rem; line-height:1.4; letter-spacing:-.012em; margin-bottom:1rem; }
.esec > h3.danger { color:var(--danger); }
.comp-h { font-size:.9375rem; line-height:1.4; letter-spacing:.005em; margin:1.75rem 0 .75rem; display:flex; align-items:center; gap:.5rem; }
.comp-h::after { content:""; flex:1; height:1px; background:var(--border-soft); }
.type-h { font-size:.6875rem; font-weight:590; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); margin:1rem 0 .5rem; }

.chg { margin:1rem 0; scroll-margin-top:7rem; }
.chg:target, .chg.hit { background:var(--accent-soft); border-radius:var(--r-sm); padding:.5rem; margin-left:-.5rem; margin-right:-.5rem; }
.chg-head { display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem; }
.tbadge { font-size:.6875rem; line-height:1rem; font-weight:510; letter-spacing:.02em; color:var(--text-3); border:1px solid var(--border); border-radius:var(--r-pill); padding:.0625rem .4375rem; white-space:nowrap; }
.scopetag { font-size:.6875rem; color:var(--text-3); border:1px dashed var(--border); border-radius:var(--r-pill); padding:.0625rem .4375rem; }
.chg-title { font-size:1.0625rem; line-height:1.5; font-weight:510; color:var(--text-1); }
.chg-anchor { opacity:0; color:var(--text-3); font-size:.8125rem; font-family:var(--font-mono); transition:opacity var(--t-fast); }
.chg:hover .chg-anchor { opacity:1; }
.chg-body { font-size:1.0625rem; line-height:1.6; color:var(--text-2); margin-top:.25rem; }
.chg-body p + p { margin-top:1.25rem; }
.fmode { color:var(--danger); font-size:1rem; line-height:1.6; margin-top:.25rem; }
.refs { font-family:var(--font-mono); font-size:.8125rem; color:var(--text-3); margin-top:.25rem; }
.refs a { color:var(--text-3); } .refs a:hover { color:var(--accent); }
.dflt { font-family:var(--font-mono); font-size:.8125rem; color:var(--text-3); margin-top:.25rem; }

.act-list { display:flex; flex-direction:column; gap:1rem; }
.act-item { display:flex; gap:.625rem; }
.act-item .ctag { font-size:.6875rem; font-weight:590; letter-spacing:.04em; color:var(--text-3); white-space:nowrap; padding-top:.1875rem; min-width:5.5rem; }
.act-item .abody { flex:1; min-width:0; }
.act-item .atitle { font-size:1.0625rem; line-height:1.5; font-weight:510; }
.act-item .asum { font-size:1rem; line-height:1.6; color:var(--text-2); margin-top:.125rem; }

details.dblock { margin:1rem 0; border:1px solid var(--border); border-radius:var(--r-lg); background:var(--bg-raised); }
details.dblock > summary { cursor:pointer; list-style:none; padding:.625rem .875rem; font-size:.875rem; color:var(--text-2); display:flex; align-items:center; gap:.5rem; }
details.dblock > summary::-webkit-details-marker { display:none; }
details.dblock > summary::before { content:"▸"; font-size:.75rem; color:var(--text-3); transition:transform var(--t-fast); }
details.dblock[open] > summary::before { transform:rotate(90deg); }
details.dblock[open] > summary { border-bottom:1px solid var(--border-soft); }
.dblock-body { padding:.875rem; }
.dblock-body > *:first-child { margin-top:0; }
.dblock-body > *:last-child { margin-bottom:0; }

.steps { counter-reset:st; display:flex; flex-direction:column; gap:1rem; }
.step { display:flex; gap:.75rem; }
.step .n { counter-increment:st; flex:none; width:1.5rem; height:1.5rem; border-radius:50%; border:1px solid var(--border); font-size:.75rem; display:flex; align-items:center; justify-content:center; color:var(--text-3); font-variant-numeric:tabular-nums; }
.step .n::before { content:counter(st); }
.step .sb { flex:1; min-width:0; }
.step .st-title { font-size:1rem; font-weight:510; }

details.upnote { margin-top:2.5rem; border:1px solid var(--border); border-radius:var(--r-lg); background:var(--surface); }
details.upnote > summary { cursor:pointer; list-style:none; padding:.875rem 1rem; font-size:.9375rem; font-weight:510; display:flex; align-items:center; gap:.5rem; }
details.upnote > summary::-webkit-details-marker { display:none; }
details.upnote > summary::before { content:"▸"; font-size:.75rem; color:var(--text-3); transition:transform var(--t-fast); }
details.upnote[open] > summary::before { transform:rotate(90deg); }
details.upnote[open] > summary { border-bottom:1px solid var(--border); }
.upnote-body { padding:1rem; }
.up-sec { margin-top:1.25rem; }
.up-sec:first-child { margin-top:0; }
.up-sec h5 { margin:0 0 .375rem; font-size:.6875rem; font-weight:590; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.up-sec p, .up-sec li { font-size:1rem; line-height:1.6; color:var(--text-2); }

.linkrow { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1.5rem; }
.linkchip { font-size:.875rem; color:var(--text-2); border:1px solid var(--border); border-radius:var(--r-md); padding:.25rem .625rem; }
.linkchip:hover { border-color:var(--accent); color:var(--accent); text-decoration:none; }
.tagrow { display:flex; flex-wrap:wrap; gap:.375rem; margin-top:1.5rem; }
.tag { font-size:.6875rem; color:var(--text-3); background:var(--surface); border-radius:var(--r-pill); padding:.125rem .5rem; }
.morechg { font-size:.875rem; color:var(--accent); margin-top:1rem; }
.yank-banner { margin-top:.75rem; background:var(--danger-soft); border:1px solid var(--danger-border); border-radius:var(--r-md); padding:.625rem .875rem; font-size:.875rem; color:var(--danger); font-weight:510; }

.empty { padding:4rem 0; text-align:center; color:var(--text-3); }
.empty p { font-size:1.0625rem; margin-bottom:1rem; }

/* jump nav */
.jump { display:none; }
@media (min-width:1280px) { .jump { display:block; position:sticky; top:6rem; align-self:start; max-height:calc(100vh - 8rem); overflow-y:auto; } }
.jump .eyebrow { font-size:.625rem; font-weight:590; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); margin-bottom:.75rem; }
.jump a { display:block; font-size:.8125rem; color:var(--text-3); padding:.1875rem 0 .1875rem .625rem; border-left:2px solid transparent; font-variant-numeric:tabular-nums; }
.jump a:hover { color:var(--text-2); text-decoration:none; }
.jump a.on { color:var(--accent); border-left-color:var(--accent); }
.jump .yr { font-size:.6875rem; color:var(--text-3); opacity:.7; margin:.75rem 0 .25rem; font-variant-numeric:tabular-nums; }
.jump .avoid { margin-top:1.5rem; padding-top:1rem; border-top:1px solid var(--border); }
.jump .avoid .eyebrow { color:var(--danger); }
.jump .avoid li { font-size:.75rem; color:var(--text-3); }
.jump .avoid code { font-size:.75rem; }

/* footer */
.ftr { margin-top:4rem; border-top:1px solid var(--border); padding:3.5rem 0 4rem; }
.ftr-cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); gap:2.5rem; }
.ftr h4 { font-size:.6875rem; font-weight:590; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); margin-bottom:.75rem; }
.ftr .fbtns { display:flex; flex-direction:column; align-items:flex-start; gap:.5rem; }
.ftr-note { margin-top:2.5rem; font-size:.8125rem; color:var(--text-3); font-variant-numeric:tabular-nums; }

/* toast */
.toasts { position:fixed; bottom:1.5rem; left:50%; transform:translateX(-50%); z-index:200; display:flex; flex-direction:column; gap:.5rem; align-items:center; }
.toast { background:var(--text-1); color:var(--bg); border-radius:var(--r-md); padding:.625rem 1rem; font-size:.875rem; box-shadow:var(--shadow-pop); display:flex; align-items:center; gap:.75rem; }
.toast button { color:var(--bg); text-decoration:underline; font-size:.8125rem; }

/* ---------- admin ---------- */
.abar { position:sticky; top:0; z-index:60; display:flex; align-items:center; gap:.75rem; padding:.625rem 2rem; background:var(--bg-raised); border-bottom:1px solid var(--border); flex-wrap:wrap; }
.abar .dot { width:8px; height:8px; border-radius:50%; background:var(--accent); flex:none; }
.abar .ttl { font-size:.875rem; font-weight:590; }
.savepill { font-size:.75rem; color:var(--text-3); font-variant-numeric:tabular-nums; }
.savepill.dirty { color:var(--warn); }
.asp { flex:1; }
.apage { max-width:var(--page-max); margin:0 auto; padding:2rem; }
.atable { width:100%; border-collapse:collapse; font-size:.875rem; }
.atable th { position:sticky; top:3.25rem; z-index:5; background:var(--bg); }
.atable td { vertical-align:middle; }
.atable tr.draft td:first-child { border-left:2px dashed var(--warn); }
.atable .ttl2 { font-size:.75rem; color:var(--text-3); }
.rowbtns { display:flex; gap:.375rem; justify-content:flex-end; }
.rowbtns button { font-size:.75rem; color:var(--text-3); border:1px solid transparent; border-radius:var(--r-sm); padding:.125rem .375rem; }
.rowbtns button:hover { border-color:var(--border); color:var(--text-1); }
.rowbtns button.dgr:hover { color:var(--danger); border-color:var(--danger-border); }
.stdot { display:inline-block; width:7px; height:7px; border-radius:50%; }
.stdot.published { background:var(--accent); } .stdot.draft { background:var(--warn); } .stdot.yanked { background:var(--danger); } .stdot.trashed { background:var(--dot-muted); }

.ed { display:grid; grid-template-columns:minmax(0,1fr); gap:2rem; }
@media (min-width:1280px) { .ed { grid-template-columns:minmax(0,1fr) 19rem; } }
.fld { margin-bottom:1.25rem; }
.fld > label, .fld > .lg { display:block; font-size:.75rem; font-weight:590; letter-spacing:.04em; text-transform:uppercase; color:var(--text-3); margin-bottom:.375rem; }
.fld input[type=text], .fld input[type=date], .fld input[type=number], .fld select, .fld textarea {
  width:100%; background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-md);
  padding:.5rem .625rem; font-size:.9375rem;
}
.fld textarea { font-family:var(--font-mono); font-size:.8125rem; line-height:1.6; resize:vertical; tab-size:2; }
.fld input:focus, .fld select:focus, .fld textarea:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.fld .hint { font-size:.75rem; color:var(--text-3); margin-top:.25rem; }
.fld .err { font-size:.75rem; color:var(--danger); margin-top:.25rem; }
.row2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(9rem,1fr)); gap:.75rem; }
.panel { border:1px solid var(--border); border-radius:var(--r-lg); padding:1rem; background:var(--surface); margin-bottom:1.25rem; }
.panel > .ph { font-size:.75rem; font-weight:590; letter-spacing:.06em; text-transform:uppercase; color:var(--text-3); margin-bottom:.75rem; }
.radios { display:flex; flex-wrap:wrap; gap:.375rem; }
.radios label { font-size:.8125rem; border:1px solid var(--border); border-radius:var(--r-pill); padding:.1875rem .625rem; cursor:pointer; color:var(--text-3); }
.radios input { position:absolute; opacity:0; width:0; height:0; }
.radios label:has(input:checked) { background:var(--accent-soft); border-color:var(--accent); color:var(--accent); font-weight:510; }
.radios label:has(input:focus-visible) { outline:2px solid var(--focus); outline-offset:2px; }
.togs { display:flex; gap:1rem; align-items:center; padding-left:1rem; margin-left:.5rem; border-left:1px solid var(--border); }
.togs label { display:inline-flex; align-items:center; gap:.375rem; font-size:.8125rem; color:var(--text-2); cursor:pointer; }
.chgcard { border:1px solid var(--border); border-radius:var(--r-lg); background:var(--bg-raised); margin-bottom:.75rem; }
.chgcard > .ch { display:flex; align-items:center; gap:.5rem; padding:.5rem .75rem; cursor:pointer; }
.chgcard > .ch .cnum { font-size:.75rem; color:var(--text-3); font-variant-numeric:tabular-nums; }
.chgcard > .ch .cttl { flex:1; font-size:.875rem; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chgcard > .cb { padding:.75rem; border-top:1px solid var(--border-soft); }
.mini { font-size:.75rem; color:var(--text-3); border:1px solid var(--border); border-radius:var(--r-sm); padding:.125rem .4375rem; }
.mini:hover { color:var(--text-1); border-color:var(--text-3); }
.slideover { position:fixed; inset:0; z-index:120; display:flex; justify-content:flex-end; background:rgba(0,0,0,.35); }
.slideover .so-panel { width:min(30rem,100%); background:var(--bg); border-left:1px solid var(--border); padding:1.5rem; overflow-y:auto; box-shadow:var(--shadow-pop); }
.so-list { display:flex; flex-direction:column; gap:.5rem; align-items:stretch; }
.so-list button { text-align:left; }
.disclose { font-size:.75rem; color:var(--text-3); border-top:1px solid var(--border); margin-top:2rem; padding-top:1rem; line-height:1.6; }
.warnbar { background:var(--warn-soft); border:1px solid var(--warn-border); color:var(--text-1); border-radius:var(--r-md); padding:.5rem .75rem; font-size:.8125rem; margin-bottom:1rem; display:flex; align-items:center; gap:.75rem; }
.prevcol { border-left:1px solid var(--border); padding-left:1.5rem; }
@media (max-width:1279px) { .prevcol { border-left:0; padding-left:0; border-top:1px solid var(--border); padding-top:1.5rem; } }

/* ---------- responsive ---------- */
@media (max-width:1279px) { .rail { position:static; } }
@media (max-width:899px) {
  .wrap { padding:0 1.25rem; }
  .hdr { padding:0 1.25rem; gap:.625rem; }
  .brand .sl { display:none; }
  .hdr-sp { display:none; }
  .search { flex:1; min-width:0; }
  .search input { width:100%; }
  #btnMd { display:none; }   /* mesma acao existe no rodape */
  .phead h1 { font-size:2.25rem; }
  .phead { padding-top:2.5rem; }
  .entry { grid-template-columns:minmax(0,1fr); padding-bottom:3.5rem; }
  .etitle { font-size:1.625rem; }
  .rail { position:static; flex-direction:row; flex-wrap:wrap; align-items:center; gap:.5rem; padding-left:0; margin-bottom:.75rem; }
  .rail .dot { display:none; }
  .rail .rstub { display:none; }
  .rdate .k { display:inline; margin-right:.25rem; }
  .rdate { font-size:.8125rem; }
  .month-eyebrow { padding-left:0; }
  .chips { flex-wrap:nowrap; overflow-x:auto; padding-bottom:.25rem; -webkit-overflow-scrolling:touch; }
  .apage { padding:1.25rem; }
}

@media print {
  :root { --bg:#fff; --bg-raised:#fff; --text-1:#000; --text-2:#222; --text-3:#555; --border:#ccc; --border-soft:#e5e5e5; --accent:#00695f; --code-bg:#f5f5f5; }
  .hdr, .filters, .jump, .install, .toasts, .abar, .clink, .chg-anchor, .code-wrap .copy, .skip { display:none !important; }
  details { open:true; }
  details > div, .dblock-body, .upnote-body { display:block !important; }
  .entry { page-break-inside:avoid; padding-bottom:2rem; }
  a[href^="http"]::after { content:" (" attr(href) ")"; font-size:.7rem; color:#555; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } }

/* ============================================================
   UTILITÁRIOS — substituem os atributos style="" do protótipo.
   A CSP do backend não permite estilo inline; nenhuma regra
   abaixo muda o design: são as mesmas declarações, nomeadas.
   ============================================================ */
.sp { flex:1; }
.nowrap { white-space:nowrap; }
.num { font-variant-numeric:tabular-nums; }
.mono { font-family:var(--font-mono); }
.mono-sm { font-family:var(--font-mono); font-size:.8125rem; }
.sans { font-family:var(--font-sans); }
.ta-sans { font-family:var(--font-sans); font-size:.9375rem; }
.ta-r { text-align:right; }
.muted { color:var(--text-3); }
.danger-txt { color:var(--danger); }
.small-muted { font-size:.875rem; color:var(--text-3); }
.tiny-muted { font-size:.8125rem; color:var(--text-3); }
.lbl-aux { text-transform:none; font-weight:400; }
.mt-05 { margin-top:.5rem; }
.mt-1 { margin-top:1rem; }
.mt-2 { margin-top:2rem; }

.mdhr { border:0; border-top:1px solid var(--border-soft); margin:1.5rem 0; }
.chg-body.intro { margin-top:1.25rem; }
.imp.inline { margin-right:.375rem; }
.jump a .jd { opacity:.6; }
.upnote-vazia { color:var(--text-3); font-size:1rem; }
.avoid-list { padding-left:1rem; }
.verdict.muted { color:var(--text-3); }

/* estados de carga e falha da API */
.loading { padding:4rem 0; text-align:center; color:var(--text-3); font-size:1.0625rem; }
.apierro { max-width:44rem; margin:3rem auto; background:var(--danger-soft); border:1px solid var(--danger-border); border-radius:var(--r-lg); padding:1.25rem; color:var(--text-1); }
.apierro h2 { font-size:1.125rem; margin-bottom:.5rem; }
.apierro p { font-size:.9375rem; color:var(--text-2); }
.apierro .ghost { margin-top:1rem; }

/* login do admin */
.login { max-width:22rem; margin:7rem auto 4rem; padding:0 1.25rem; }
.login img { height:26px; width:auto; display:block; margin-bottom:1.5rem; }
:root[data-theme="dark"] .login img { filter:brightness(0) invert(1); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .login img { filter:brightness(0) invert(1); } }
.login h1 { font-size:1.5rem; letter-spacing:-.02em; }
.login .sub { font-size:.9375rem; color:var(--text-3); margin-top:.5rem; line-height:1.6; }
.login form { margin-top:1.5rem; }
.login .ghost.pri { width:100%; padding:.5rem; text-align:center; }

/* admin — lista */
.arow { display:flex; gap:.75rem; align-items:center; flex-wrap:wrap; margin-bottom:1rem; }
.ainput { background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-md); padding:.4375rem .625rem; font-size:.875rem; }
.atable th.c1 { width:1.5rem; }
.seg.full { width:100%; }
.seg.full button { flex:1; }

/* admin — editor */
.soakline { font-size:.8125rem; color:var(--text-3); }
.soakline.bad { color:var(--danger); font-weight:510; }
.meta-id { font-size:.6875rem; color:var(--text-3); font-family:var(--font-mono); border-top:1px solid var(--border); padding-top:.75rem; margin-top:1rem; line-height:1.6; }
.chg-type-row { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; }
.detcount { font-size:.75rem; color:var(--text-3); margin-bottom:.375rem; }
.detbtns { display:flex; gap:.375rem; flex-wrap:wrap; }
.detrow { display:flex; align-items:center; gap:.5rem; margin:.75rem 0 .375rem; }
.det-lbl { font-size:.75rem; color:var(--text-3); }
.dsel { width:auto; margin-bottom:.375rem; background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-md); padding:.25rem .5rem; font-size:.8125rem; }
.dinput { width:100%; margin-bottom:.375rem; background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-md); padding:.375rem .5rem; font-size:.8125rem; }
.dinput.mono-xs { font-family:var(--font-mono); font-size:.75rem; }
.dta { width:100%; background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-md); padding:.5rem; font-family:var(--font-mono); font-size:.75rem; line-height:1.6; resize:vertical; }
.dta.md { font-size:.8125rem; }
.prevwrap { margin-top:2rem; }
.prevhead { font-size:.75rem; font-weight:590; letter-spacing:.06em; text-transform:uppercase; color:var(--text-3); margin-bottom:1rem; }
.prevfeed { max-width:var(--content-w); }

/* violações vindas do backend (422) ancoradas no campo */
.fld.invalid > input, .fld.invalid > select, .fld.invalid > textarea,
.fld.invalid input[type=text], .fld.invalid input[type=date], .fld.invalid textarea, .fld.invalid select { border-color:var(--danger); }
.chgcard.invalid { border-color:var(--danger-border); }
.chgcard.invalid > .ch { color:var(--danger); }
.panel.invalid { border-color:var(--danger-border); }

/* slideover de dados */
.so-head { display:flex; align-items:center; gap:.75rem; margin-bottom:1.25rem; }
.so-head h3 { font-size:1.125rem; }
.so-h4 { font-size:.6875rem; font-weight:590; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); margin:1.75rem 0 .5rem; }
.so-p { font-size:.8125rem; color:var(--text-3); line-height:1.6; }
.so-p.forte { color:var(--text-2); margin-top:.75rem; }