@font-face{font-family:'Fraunces';src:url('fonts/fraunces-latin-wght-normal.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url('fonts/fraunces-latin-wght-italic.woff2') format('woff2');font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:'Source Sans 3';src:url('fonts/source-sans-3-latin-wght-normal.woff2') format('woff2');font-weight:200 900;font-style:normal;font-display:swap}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html:not(.js) [data-sc-act]{min-height:0}
/* Diário de Campo: gramática "chaptered editorial". Cortes secos de fundo entre capítulos (sem gradiente), folio na margem, medida
   de leitura, rodapés reais. O folio é um registro que carimba cada entrada ao passar por ela e se assina no colofão. */
.pf-diario-de-campo {
  --sc-canvas: #f2f1ec; --sc-surface: #ffffff; --sc-ink: #181a1c; --sc-ink-soft: #4a4f54;
  --sc-accent: #a23b2a; --sc-accent-ink: #ffffff;
  --sc-font-display: 'Fraunces', Georgia, serif; --sc-font-text: 'Source Sans 3', system-ui, sans-serif;
  --pad: clamp(18px, 4vw, 64px);
  background: #f2f1ec; color: #181a1c; font-family: 'Source Sans 3', system-ui, sans-serif; font-size: 1.0625rem;
}
.pf-skip { position: absolute; left: 8px; top: -60px; z-index: 50; background: #fff; color: #181a1c; padding: 10px 14px; border-radius: 6px; }
.pf-skip:focus { top: 8px; }
.pf-noscript { padding: 16px; background: #fff; color: #181a1c; }
.pf-diario-de-campo :focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }

/* ───────── capítulos: cada um com o seu chão, em corte seco ───────── */
.dc-ch { position: relative; padding: clamp(72px, 12vw, 160px) 0; }
.dc-ch[data-ch='0'] { background: #f2f1ec; color: #181a1c; --acc: #a23b2a; --soft: #4a4f54; --line: #181a1c33; min-height: 100svh; display: grid; align-content: center; }
.dc-ch[data-ch='1'] { background: #dcdcd6; color: #181a1c; --acc: #a23b2a; --soft: #3f4449; --line: #181a1c40; }
.dc-ch[data-ch='2'] { background: #1d242b; color: #eceff1; --acc: #f0937c; --soft: #b6c0c8; --line: #eceff140; }
.dc-ch[data-ch='3'] { background: #e1e7d9; color: #181a1c; --acc: #a23b2a; --soft: #3f4a3a; --line: #181a1c40; }
.dc-ch[data-ch='4'] { background: #f2f1ec; color: #181a1c; --acc: #a23b2a; --soft: #4a4f54; --line: #181a1c33; padding-bottom: clamp(40px, 6vw, 80px); }
.dc-in { display: grid; grid-template-columns: 200px minmax(0, 1fr) minmax(260px, 380px); gap: clamp(24px, 4vw, 64px); max-width: 1440px; margin: 0 auto; padding: 0 var(--pad); }
.dc-main { grid-column: 2; max-width: 40rem; }
.dc-side { grid-column: 3; align-self: start; padding-top: .4rem; }

/* título (página de rosto): tipo sobre o papel, sem mídia, alinhado à esquerda */
.dc-title { grid-column: 2 / -1; display: grid; gap: clamp(24px, 4vw, 48px); }
.dc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.dc-head span { font: 600 .8125rem/1.3 'Source Sans 3', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--soft); }
.pf-lang { display: flex; gap: 2px; }
.pf-lang a { min-width: 44px; min-height: 44px; display: grid; place-items: center; font: 600 .8125rem/1 'Source Sans 3', sans-serif; letter-spacing: .08em; color: var(--soft); text-decoration: none; }
.pf-lang a[aria-current='true'] { color: var(--acc); box-shadow: inset 0 -2px 0 currentColor; }
.dc-h1 { margin: 0; font-family: 'Fraunces', Georgia, serif; font-weight: 600; font-size: clamp(3rem, 9vw, 8.5rem); line-height: .92; letter-spacing: -.035em; font-optical-sizing: auto; max-width: 9ch; }
.dc-h1 em { font-style: italic; font-weight: 400; color: var(--acc); display: block; }
.dc-lede { margin: 0; max-width: 34rem; font-size: clamp(1.15rem, 1.8vw, 1.5rem); line-height: 1.5; color: var(--soft); }
.dc-by { margin: 0; font: 600 .875rem/1.4 'Source Sans 3', sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--soft); border-top: 1px solid var(--line); padding-top: 14px; max-width: 34rem; }
.dc-run { margin: 0; font-size: 1.0625rem; }
.dc-run a { color: inherit; font-weight: 700; text-underline-offset: 5px; text-decoration-thickness: 2px; text-decoration-color: var(--acc); }
.dc-run a:hover { color: var(--acc); }

/* capítulo */
.dc-kicker { margin: 0 0 18px; font: 600 .8125rem/1.2 'Source Sans 3', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--acc); }
.dc-h2 { margin: 0 0 clamp(20px, 3vw, 36px); font-family: 'Fraunces', Georgia, serif; font-weight: 600; font-size: clamp(2.1rem, 4.4vw, 3.9rem); line-height: 1.02; letter-spacing: -.028em; text-wrap: balance; }
.dc-main p { margin: 0 0 1.1em; line-height: 1.62; max-width: 38rem; text-wrap: pretty; }
.dc-main p.q { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-size: 1.2rem; line-height: 1.5; }
.dc-fig { margin: clamp(24px, 4vw, 48px) 0 0; padding-top: 18px; border-top: 1px solid currentColor; display: grid; gap: 4px; }
.dc-fig b { font: 600 clamp(2.4rem, 5vw, 4.2rem)/1 'Fraunces', Georgia, serif; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.dc-fig span { font-size: .9375rem; color: var(--soft); }
.dc-open { display: inline-flex; align-items: center; min-height: 44px; margin-top: 14px; color: inherit; font-weight: 700; text-underline-offset: 5px; text-decoration-thickness: 2px; text-decoration-color: var(--acc); }
.dc-open:hover { color: var(--acc); }

/* marginália: as linhas do diário, com rodapés reais */
.dc-lines { list-style: none; margin: 0; padding: 0; border-top: 1px solid currentColor; font-size: .9375rem; }
.dc-lines li { display: grid; gap: 1px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.dc-lines b { font-weight: 600; }
.dc-lines span { color: var(--soft); font-size: .8125rem; }
.dc-lines sup { color: var(--acc); font-weight: 700; margin-left: 3px; }
.dc-notes { margin: 14px 0 0; padding: 0; list-style: none; font-size: .8125rem; line-height: 1.5; color: var(--soft); display: grid; gap: 4px; }
.dc-notes sup { color: var(--acc); font-weight: 700; margin-right: 4px; }
.dc-cap { margin: 0 0 8px; font: 600 .75rem/1 'Source Sans 3', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--soft); }

/* colofão */
.dc-colophon { grid-column: 2 / -1; display: grid; grid-template-columns: minmax(0, 40rem) minmax(260px, 380px); gap: clamp(24px, 4vw, 64px); font-size: .9375rem; line-height: 1.6; }
.dc-colophon p { margin: 0 0 1em; max-width: 40rem; }
.dc-colophon a { color: inherit; font-weight: 700; text-underline-offset: 4px; text-decoration-color: var(--acc); }
.dc-colophon h2 { margin: 0 0 14px; font: 600 .8125rem/1 'Source Sans 3', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--acc); }
.dc-sign { display: grid; gap: 10px; align-content: start; }
.dc-sign label { font: 600 .75rem/1 'Source Sans 3', sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--soft); }
.dc-sign .row { display: flex; gap: 8px; }
.dc-sign input { flex: 1; min-width: 0; min-height: 46px; padding: 0 12px; background: #fff; border: 1px solid #181a1c66; border-radius: 2px; font: inherit; color: inherit; }
.dc-sign button { min-height: 46px; padding: 0 16px; background: #181a1c; color: #f2f1ec; border: 0; border-radius: 2px; font: 700 .9375rem/1 'Source Sans 3', sans-serif; cursor: pointer; }
.dc-sign button.ghost { background: transparent; color: #181a1c; border: 1px solid #181a1c66; }
.dc-sign button:active { transform: translateY(1px); }
.dc-sign button:disabled { opacity: .45; cursor: not-allowed; }
.dc-log { margin: 0; padding: 12px 14px; list-style: none; border: 1px dashed #181a1c66; font: 400 .8125rem/1.6 'Source Sans 3', sans-serif; min-height: 4.5em; display: grid; gap: 2px; background: #ffffff80; }
.dc-log li::before { content: '· '; color: var(--acc); font-weight: 700; }
.dc-log li.empty { color: var(--soft); } .dc-log li.empty::before { content: ''; }
.dc-msg { min-height: 1.4em; font-size: .8125rem; color: var(--soft); }

/* folio: o registro do dia na margem */
.dc-folio { position: fixed; z-index: 20; left: var(--pad); top: 50%; transform: translateY(-50%); width: 168px; display: grid; gap: 8px; font-size: .8125rem; line-height: 1.4; color: #181a1c; }
.dc-folio[data-tone='dark'] { color: #eceff1; }
.dc-folio b { font: 600 .9375rem/1.2 'Fraunces', Georgia, serif; }
.dc-folio small { font: 600 .6875rem/1.3 'Source Sans 3', sans-serif; letter-spacing: .14em; text-transform: uppercase; opacity: .75; }
.dc-folio ol { margin: 0; padding: 8px 0 0; list-style: none; border-top: 1px solid currentColor; display: grid; gap: 6px; max-height: 40vh; overflow: hidden; }
.dc-folio ol li { opacity: .9; font-size: .75rem; }
.dc-folio ol li time { display: block; font-weight: 700; opacity: .88; letter-spacing: .04em; }
.dc-folio[data-hidden='1'] { opacity: 0; pointer-events: none; }
@media (max-width: 1180px) {
  .dc-in { grid-template-columns: minmax(0, 1fr); }
  .dc-main, .dc-side, .dc-title, .dc-colophon { grid-column: 1; }
  .dc-colophon { grid-template-columns: minmax(0, 1fr); }
  .dc-side { margin-top: 28px; }
  .dc-folio { top: auto; bottom: 0; left: 0; right: 0; transform: none; width: auto; grid-auto-flow: column; justify-content: space-between; align-items: center; padding: 6px 16px; background: #f2f1ecf2; border-top: 1px solid #181a1c33; color: #181a1c; }
  .dc-folio[data-tone='dark'] { background: #1d242bf2; color: #eceff1; border-top-color: #eceff140; }
  .dc-folio ol { display: none; } .dc-folio small { display: none; }
  .dc-ch { padding-bottom: clamp(72px, 14vw, 140px); }
}
@media (prefers-reduced-motion: reduce) { .dc-folio { transition: none; } }
