/* Sem fonte auto-hospedada, por decisão da Cláudia em 31/07/2026: Georgia nos
   títulos e a fonte do sistema no resto. Zero download, zero dependência de rede.
   O relatório em canvas usa a mesma pilha, então a imagem sai igual à tela. */

:root{
  --areia:#EFE5D5;
  --tinta:#3A4A3E;
  --linha:rgba(58,74,62,.13);
  --nav:60px;
  --serif:Georgia,'Times New Roman',serif;
  --sans:ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}

/* O atributo hidden precisa vencer qualquer display que a gente declare depois.
   Sem isso, a barra de navegação e a gaveta aparecem antes da hora. */
[hidden]{display:none !important}
body{
  background:var(--areia);color:var(--tinta);
  font-family:var(--sans);
  -webkit-text-size-adjust:100%;
  padding-bottom:calc(var(--nav) + env(safe-area-inset-bottom));
}
h1,h2,.serif{font-family:var(--serif);font-weight:400}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

/* abertura */
.abertura{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;gap:22px;padding:32px 26px}
.abertura h1{font-size:34px;margin:0}
.abertura blockquote{margin:0;font-family:var(--serif);font-size:19px;line-height:1.5;font-style:italic}
.abertura cite{display:block;margin-top:12px;font-family:var(--sans);font-size:11.5px;font-style:normal;opacity:.6}
#entrar{align-self:flex-start;padding:11px 26px;border-radius:22px;background:var(--tinta);color:var(--areia);font-size:14px}

/* estrutura */
.tela{padding:14px 16px}
nav#navegacao{
  position:fixed;left:0;right:0;bottom:0;display:flex;
  background:var(--areia);border-top:1px solid var(--linha);
  padding-bottom:env(safe-area-inset-bottom);
}
nav#navegacao button{flex:1;padding:18px 0;font-size:12.5px;opacity:.5}
nav#navegacao button.ativo{opacity:1;font-weight:700;box-shadow:inset 0 -2px 0 var(--tinta)}

/* tela do dia */
.dia-topo h2{font-size:20px;margin:0 0 10px}
.dia-abas{display:flex;gap:4px;margin-bottom:12px}
.dia-abas button{flex:1;padding:8px 0;border-radius:6px;font-size:12px;font-weight:700;opacity:.5}
.dia-abas button.sel{background:var(--tinta);color:var(--areia);opacity:1}

.dia-lista{display:flex;flex-direction:column;gap:3px}
.hora{display:flex;align-items:center;gap:9px;width:100%;padding:0;text-align:left;min-height:30px}
.hora-rot{font-size:10px;opacity:.45;width:19px;flex:0 0 auto;text-align:right;font-variant-numeric:tabular-nums}
.hora-ret{flex:1 1 auto;height:22px;display:flex;gap:1.5px;border-radius:3px;overflow:hidden}
.hora-ret.vazio{box-shadow:inset 0 0 0 1px var(--linha)}
.hora-ret i{flex:1;height:100%}
.hora-nome{font-size:10px;opacity:.75;width:88px;flex:0 0 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* conta */
#tela-conta h2{font-size:20px;margin:0 0 10px}
.conta-lista{margin:6px 0 16px}
.conta-l{display:flex;align-items:center;gap:9px;padding:7px 0;border-bottom:1px solid var(--linha);font-size:12.5px}
.conta-l i{width:14px;height:14px;border-radius:2px;flex:0 0 auto}
.conta-l b{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:700}
.conta-freq p{font-size:12.5px;line-height:1.5;margin:6px 0;opacity:.85}
.conta-branco{font-size:12.5px;opacity:.7;margin:14px 0 20px}
.botao{display:block;width:100%;padding:14px;border-radius:24px;background:var(--tinta);color:var(--areia);font-size:13.5px;font-weight:600;margin-bottom:10px}
.botao.vazado{background:none;color:var(--tinta);box-shadow:inset 0 0 0 1.4px var(--linha);font-weight:400}

/* mosaico da semana */
#tela-semana h2{font-size:20px;margin:0 0 10px}
.mosaico{display:grid;grid-template-columns:20px repeat(7,1fr);gap:2px;align-items:stretch}
.ms-cab{font-size:9.5px;text-align:center;opacity:.55;font-weight:700;padding-bottom:2px}
.ms-hora{font-size:8px;opacity:.4;text-align:right;padding-right:3px;line-height:1;align-self:center;font-variant-numeric:tabular-nums}
.ms-cel{height:calc((100dvh - var(--nav) - 130px) / 24);min-height:11px;border-radius:2px;display:flex;gap:1px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--linha)}
.ms-cel.cheia{box-shadow:none}
.ms-cel i{flex:1}

/* gaveta */
.gaveta{
  position:fixed;left:0;right:0;bottom:0;z-index:20;
  background:var(--areia);border-top:1px solid var(--linha);
  border-radius:14px 14px 0 0;max-height:82dvh;display:flex;flex-direction:column;
  box-shadow:0 -8px 28px rgba(58,74,62,.16);
  padding-bottom:env(safe-area-inset-bottom);
}
.gv-barra{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;font-size:12.5px;font-weight:700;background:rgba(58,74,62,.06)}
.gv-barra button{font-weight:400;opacity:.6}
.gv-corpo{overflow-y:auto;padding:11px 16px 4px;flex:1 1 auto}
.gv-rot{font-size:9px;text-transform:uppercase;letter-spacing:.09em;opacity:.5;font-weight:800;margin-bottom:5px}
.gv-freq{background:rgba(58,74,62,.055);border-radius:8px;padding:8px 9px 10px;margin-bottom:10px}
.gv-chips{display:flex;flex-wrap:wrap;gap:5px}
.gv-chips.recuo{padding:6px 0 9px 12px}
.gv-fam{display:flex;align-items:center;gap:8px;width:100%;padding:11px;margin:4px 0;border-radius:7px;font-size:12.5px;text-align:left;box-shadow:inset 0 0 0 1.4px var(--k)}
.gv-fam.aberta{background:var(--k);color:#fff;font-weight:700}
.gv-fam i{margin-left:auto;font-style:normal;font-size:9.5px;opacity:.55}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;padding:7px 11px;border-radius:15px;box-shadow:inset 0 0 0 1.2px var(--linha)}
.chip i{width:12px;height:12px;border-radius:2px;flex:0 0 auto}
.chip.on{background:var(--tinta);color:var(--areia);box-shadow:none;font-weight:600}
.chip:disabled{opacity:.32}
.gv-rep{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-top:1px solid var(--linha);font-size:12px}
.gv-rep select{font:inherit;background:none;border:1px solid var(--linha);border-radius:6px;padding:5px 8px;color:inherit}