/* Short to Track — base comum às páginas.
   1) Reset mínimo (o mesmo que o ambiente do protótipo aplicava).
   2) Tokens de cor e fonte (tema claro + escuro). Consulte docs/guia-visual.html.
   3) Regras gerais idênticas na home e no Meu Cifrador. */

/* 1. Reset */
:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#fff;color:#000}
img{max-width:100%}
[hidden]:not([hidden=until-found i]){display:none!important}

/* 2. Tokens */
:root{
  --bg:#EEF1EC; --surface:#FFFFFF; --ink:#17201B; --muted:#5B6760; --line:#D6DCD3; --soft:#E3EBE5;
  --accent:#1D6A55; --accent-ink:#FFFFFF; --chord:#1D6A55; --warn:#9A4D12;
  --s-neutral:#CBD2CC; --s-verso:#B9CFE6; --s-pre:#EBD3A4; --s-refrao:#9FD4BF; --s-ponte:#D5C3E8;
  --display:'Bricolage Grotesque', 'Segoe UI', system-ui, sans-serif;
  --body:'Atkinson Hyperlegible', 'Segoe UI', system-ui, sans-serif;
  --mono:'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#111613; --surface:#19201C; --ink:#E4EBE6; --muted:#97A59D; --line:#2B3530; --soft:#1F2A24;
  --accent:#5BC3A2; --accent-ink:#0D1411; --chord:#7AD8BA; --warn:#E8A15F;
  --s-neutral:#3A443E; --s-verso:#2E4A66; --s-pre:#5E4C25; --s-refrao:#24594A; --s-ponte:#4B3D63; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111613; --surface:#19201C; --ink:#E4EBE6; --muted:#97A59D; --line:#2B3530; --soft:#1F2A24;
  --accent:#5BC3A2; --accent-ink:#0D1411; --chord:#7AD8BA; --warn:#E8A15F;
  --s-neutral:#3A443E; --s-verso:#2E4A66; --s-pre:#5E4C25; --s-refrao:#24594A; --s-ponte:#4B3D63; color-scheme:dark}


/* 3. Regras gerais */
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;
  padding-left:max(16px, env(safe-area-inset-left, 0px));padding-right:max(16px, env(safe-area-inset-right, 0px));padding-block:20px 48px}
h1,h2,h3{font-family:var(--display);margin:0;text-wrap:balance;letter-spacing:-.01em}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion: reduce){*{transition:none!important}}
