:root{
  --ink:#1b1a22; --dim:#5f5a6b; --faint:#8b8597;
  --ground:#faf8fb; --surface:#ffffff; --line:#e8e4ee; --rail:#f1eef5;
  --accent:#6b4e9e;
  --abaixo:#a8541c; --abaixo-bg:#fbf1e8;
  --acima:#2f6b4f;  --acima-bg:#eaf3ee;
  --pend:#8a2f52;   --pend-bg:#fbeef2;
  --ok:#5f5a6b;     --ok-bg:#f3f1f6;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --ink:#ece9f2; --dim:#a9a3b8; --faint:#857f94;
  --ground:#141318; --surface:#1c1a22; --line:#2e2a36; --rail:#232029;
  --accent:#b49ae0; --abaixo:#e0a06a; --abaixo-bg:#2b2017;
  --acima:#7fc3a1; --acima-bg:#16241d; --pend:#e591ad; --pend-bg:#2a1620;
  --ok:#a9a3b8; --ok-bg:#232029;
}}
:root[data-theme="dark"]{
  --ink:#ece9f2; --dim:#a9a3b8; --faint:#857f94;
  --ground:#141318; --surface:#1c1a22; --line:#2e2a36; --rail:#232029;
  --accent:#b49ae0; --abaixo:#e0a06a; --abaixo-bg:#2b2017;
  --acima:#7fc3a1; --acima-bg:#16241d; --pend:#e591ad; --pend-bg:#2a1620;
  --ok:#a9a3b8; --ok-bg:#232029;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{background:var(--ground);color:var(--ink);font-family:"Source Sans 3",system-ui,sans-serif;
     font-size:16px;line-height:1.5;margin:0;padding-inline:16px;padding-block:24px 64px;max-width:860px;margin-inline:auto}
header.topo{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:18px}
h1{font-family:Spectral,Georgia,serif;font-weight:600;font-size:clamp(25px,6vw,34px);margin:0 0 6px;letter-spacing:-.01em;text-wrap:balance}
.quando{color:var(--faint);font-size:13.5px;margin:0}
.nota-topo{margin:14px 0 0;padding:12px 14px;background:var(--rail);border-radius:9px;font-size:14px;color:var(--dim)}
.nota-topo b{color:var(--ink)}
.resumo{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:9px;margin:18px 0 24px}
.cartao{background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:12px 14px}
.cartao .k{font-family:var(--mono);font-size:25px;font-weight:500;display:block;letter-spacing:-.02em}
.cartao .r{font-size:12.5px;color:var(--dim);display:block;margin-top:2px}
.cartao.a .k{color:var(--acima)} .cartao.p .k{color:var(--pend)} .cartao.b .k{color:var(--abaixo)}
h2{font-family:Spectral,Georgia,serif;font-weight:600;font-size:20px;margin:30px 0 12px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 15px;margin-bottom:11px}
.card.pend{border-color:var(--pend)}
.ch{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:11px}
.ch h3{font-size:17px;margin:0;font-weight:600}
.dose{color:var(--faint);font-weight:400;font-size:14px}
.chip{display:inline-block;padding:2px 9px;border-radius:99px;font-size:11.5px;white-space:nowrap}
.chip.acima{background:var(--acima-bg);color:var(--acima)}
.chip.abaixo{background:var(--abaixo-bg);color:var(--abaixo)}
.chip.pend{background:var(--pend-bg);color:var(--pend)}
.chip.ok{background:var(--ok-bg);color:var(--ok)}
.linha{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:9px;padding-bottom:12px;border-bottom:1px solid var(--rail)}
.kv{display:flex;flex-direction:column;gap:1px}
.kv .k{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint)}
.kv .v{font-family:var(--mono);font-size:16px;font-variant-numeric:tabular-nums}
.kv .v small{font-family:"Source Sans 3",sans-serif;font-size:11px;color:var(--faint);display:block;margin-top:1px}
.kv.destaque .v{font-weight:600;font-size:19px}
.kv .v.sg{color:var(--accent)}
.lojas{margin-top:11px}
.rot{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint);margin-bottom:6px}
.loja{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:4px 0;border-bottom:1px dotted var(--rail)}
.loja:last-child{border-bottom:none}
.ln{font-size:14px;color:var(--dim)}
.lv{font-family:var(--mono);font-size:14.5px;font-variant-numeric:tabular-nums;text-align:right}
.hoje{display:block;font-size:12px;color:var(--abaixo);font-family:"Source Sans 3",sans-serif}
.obs{margin:10px 0 0;font-size:12.5px;color:var(--faint);font-style:italic}
.dec{display:grid;gap:9px;padding:0;margin:0;list-style:none}
.dec li{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:15px}
.dec .val{font-family:var(--mono);color:var(--accent)}
.rodape{margin-top:30px;font-size:12.5px;color:var(--faint)}
.bloco{margin-top:12px}
.faixa{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;background:var(--rail);border-radius:9px;padding:9px 12px}
.fx{font-family:var(--mono);font-size:17px;font-weight:600;font-variant-numeric:tabular-nums}
.seta{color:var(--faint);font-size:13px}
.med{font-family:var(--mono);font-size:14px;color:var(--accent);margin-left:4px}
.qt{font-size:12px;color:var(--faint);margin-left:auto}
.faixa.vazio{font-size:13.5px;color:var(--faint);font-style:italic}
.decide{margin-top:12px;padding:11px 12px;background:var(--rail);border-radius:10px}
.decide label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint);margin-bottom:6px}
.entrada{display:flex;align-items:center;gap:8px}
.cifrao{font-family:var(--mono);font-size:19px;color:var(--faint)}
.entrada input{flex:1;min-width:0;font-family:var(--mono);font-size:19px;padding:9px 11px;border:1px solid var(--line);
  border-radius:8px;background:var(--surface);color:var(--ink);font-variant-numeric:tabular-nums}
.entrada input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.salvar{font:inherit;font-size:14px;font-weight:600;padding:10px 16px;border:none;border-radius:8px;
  background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap}
.salvar:disabled{opacity:.45;cursor:default}
.salvar.feito{background:var(--acima)}
.calc{display:block;margin-top:7px;font-size:12.5px;color:var(--dim);min-height:17px}
.calc b{font-family:var(--mono);color:var(--ink)}
details.bloco summary{cursor:pointer;list-style:none}
details.bloco summary::-webkit-details-marker{display:none}
details.bloco summary::after{content:" ver";color:var(--accent);font-size:11px}
details.bloco[open] summary::after{content:" esconder"}
.aviso{margin:0 0 16px;padding:11px 13px;border-radius:9px;background:var(--pend-bg);color:var(--pend);font-size:13.5px}
.aviso[hidden]{display:none}
.contador{font-family:var(--mono)}
.barra{position:sticky;bottom:0;z-index:5;margin:18px -16px -64px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:var(--surface);border-top:1px solid var(--line);display:flex;gap:10px;align-items:center}
.barra[hidden]{display:none}
#enviar{flex:1;font:inherit;font-size:15px;font-weight:600;padding:13px 16px;border:none;border-radius:10px;
  background:var(--accent);color:#fff;cursor:pointer}
#limpar{font:inherit;font-size:13px;padding:13px 12px;border:1px solid var(--line);border-radius:10px;
  background:transparent;color:var(--dim);cursor:pointer}
.calc{line-height:1.45}
.calc.meu{color:var(--ink)}
.calc.meu b{color:var(--accent)}
.loja.sem .ln{color:var(--faint)}
.lv.nao{font-family:"Source Sans 3",sans-serif;font-size:12.5px;color:var(--faint);font-style:italic}
h2.sec{font-family:Spectral,Georgia,serif;font-weight:600;font-size:20px;margin:30px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--line)}
article.fixo{background:var(--rail);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:10px}
article.fixo .ch{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
article.fixo h3{font-size:16px;margin:0}
.v.peq{font-size:12px;font-weight:400;color:var(--dim);text-align:right}