/* Tio Dino no telemóvel — mesmos tokens do sistema de design do computador (tema âmbar; claro, escuro ou automático) */
:root{
  --h:38;--ns:18%;--acc-l:#B7791F;--acc-d:#E2A63B;
  --bg:hsl(var(--h) var(--ns) 97.5%);--card:hsl(var(--h) 30% 99.6%);--soft:hsl(var(--h) var(--ns) 93.5%);
  --line:hsl(var(--h) calc(var(--ns) - 4%) 88.5%);--ink:hsl(var(--h) 14% 13%);--ink-2:hsl(var(--h) 9% 33%);
  --muted:hsl(var(--h) 7% 43%);--accent:var(--acc-l);--accent-ink:#fff;
  --accent-soft:color-mix(in srgb,var(--acc-l) 13%,transparent);--focus:color-mix(in srgb,var(--acc-l) 45%,transparent);
  --pos:#1D7A4C;--neg:#B9382D;--warn:#9A6400;--r:12px;--r-s:8px;color-scheme:light;
  --font:-apple-system,system-ui,"Segoe UI",Roboto,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-mode="light"]){
  --bg:hsl(var(--h) var(--ns) 7.5%);--card:hsl(var(--h) var(--ns) 10.5%);--soft:hsl(var(--h) var(--ns) 14%);
  --line:hsl(var(--h) var(--ns) 19%);--ink:hsl(var(--h) 18% 92%);--ink-2:hsl(var(--h) 10% 76%);--muted:hsl(var(--h) 8% 62%);
  --accent:var(--acc-d);--accent-ink:hsl(var(--h) 30% 8%);--accent-soft:color-mix(in srgb,var(--acc-d) 16%,transparent);
  --focus:color-mix(in srgb,var(--acc-d) 50%,transparent);--pos:#4CC58A;--neg:#F0776B;--warn:#E7B04A;color-scheme:dark}}
:root[data-mode="dark"]{
  --bg:hsl(var(--h) var(--ns) 7.5%);--card:hsl(var(--h) var(--ns) 10.5%);--soft:hsl(var(--h) var(--ns) 14%);
  --line:hsl(var(--h) var(--ns) 19%);--ink:hsl(var(--h) 18% 92%);--ink-2:hsl(var(--h) 10% 76%);--muted:hsl(var(--h) 8% 62%);
  --accent:var(--acc-d);--accent-ink:hsl(var(--h) 30% 8%);--accent-soft:color-mix(in srgb,var(--acc-d) 16%,transparent);
  --focus:color-mix(in srgb,var(--acc-d) 50%,transparent);--pos:#4CC58A;--neg:#F0776B;--warn:#E7B04A;color-scheme:dark}
:root[data-mode="light"]{color-scheme:light}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.45 var(--font);-webkit-text-size-adjust:100%}
body{padding:env(safe-area-inset-top) 0 calc(72px + env(safe-area-inset-bottom))}
[hidden]{display:none!important}
main{max-width:640px;margin:0 auto;padding:12px 16px 24px}
h1{font-size:1.35rem;margin:6px 0 12px;letter-spacing:-.01em}
h2{font-size:1rem;margin:0 0 10px}
.muted{color:var(--muted)}.small{font-size:.85rem}.pos{color:var(--pos)}.neg{color:var(--neg)}.warn{color:var(--warn)}
.n{font-variant-numeric:tabular-nums}
a{color:var(--accent)}

/* cartões e listas */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:12px}
.list{background:var(--card);border:1px solid var(--line);border-radius:var(--r);margin-bottom:12px;overflow:hidden}
.row{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);min-height:56px;width:100%;
  background:none;border-left:0;border-right:0;border-top:0;color:inherit;font:inherit;text-align:left}
.row:last-child{border-bottom:0}
button.row{cursor:pointer}button.row:active{background:var(--soft)}
.row .grow{flex:1;min-width:0}
.row .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .s{font-size:.8rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.emoji{width:36px;height:36px;border-radius:10px;background:var(--soft);display:grid;place-items:center;font-size:1.15rem;flex:none}
.day{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:16px 4px 6px}

/* números do painel */
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.kpi .l{font-size:.78rem;color:var(--muted)}.kpi .v{font-size:1.3rem;font-weight:650;margin-top:2px}
.kpi.big{grid-column:1/-1}.kpi.big .v{font-size:1.8rem}
.bar{height:8px;border-radius:99px;background:var(--soft);overflow:hidden;margin-top:6px}
.bar>i{display:block;height:100%;background:var(--accent);border-radius:99px}
.bar.over>i{background:var(--neg)}

/* controlos */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 16px;border-radius:var(--r-s);
  border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:550;cursor:pointer}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.danger{color:var(--neg)}.btn.block{width:100%}.btn.small{min-height:36px;padding:0 12px;font-size:.9rem}
.btn:disabled{opacity:.5}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
label.f{display:block;font-size:.85rem;color:var(--muted);margin:12px 0 4px}
input,select,textarea{width:100%;min-height:46px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-s);
  background:var(--card);color:var(--ink);font:inherit;font-size:16px}
textarea{min-height:80px}
.check{display:flex;gap:10px;align-items:center;margin:12px 0}.check input{width:22px;min-height:22px}
.seg{display:flex;background:var(--soft);border-radius:var(--r-s);padding:3px;gap:3px}
.seg button{flex:1;min-height:36px;border:0;border-radius:6px;background:none;color:var(--ink-2);font:inherit;font-size:.9rem}
.seg button.on{background:var(--card);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgb(0 0 0/.08)}
.mes{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.mes b{flex:1;text-align:center;font-size:1.05rem}
.mes button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:1.1rem}
.search{margin-bottom:10px}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:6px}
.chip{flex:none;border:1px solid var(--line);background:var(--card);color:var(--ink-2);border-radius:99px;padding:6px 12px;font:inherit;font-size:.85rem}
.chip.on{background:var(--accent-soft);border-color:transparent;color:var(--ink);font-weight:600}
.tag{display:inline-block;font-size:.72rem;padding:1px 7px;border-radius:99px;background:var(--soft);color:var(--ink-2)}
.tag.rev{background:var(--accent-soft);color:var(--ink)}
.alert{border-radius:var(--r);padding:12px 14px;background:var(--accent-soft);margin-bottom:12px;font-size:.92rem}
.alert.err{background:color-mix(in srgb,var(--neg) 14%,transparent)}
.empty{text-align:center;color:var(--muted);padding:32px 12px}

/* barra inferior */
nav.tabs{position:fixed;left:0;right:0;bottom:0;display:flex;background:color-mix(in srgb,var(--card) 92%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);
  padding:4px 4px calc(4px + env(safe-area-inset-bottom));z-index:20}
nav.tabs a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;color:var(--muted);
  text-decoration:none;font-size:.7rem;font-weight:550}
nav.tabs a svg{width:24px;height:24px}
nav.tabs a.on{color:var(--accent)}

/* folha (janela que sobe de baixo) */
.sheet-bg{position:fixed;inset:0;background:rgb(0 0 0/.4);z-index:30;display:flex;align-items:flex-end;justify-content:center}
.sheet{background:var(--bg);width:100%;max-width:640px;max-height:92vh;overflow-y:auto;border-radius:16px 16px 0 0;
  padding:8px 16px calc(20px + env(safe-area-inset-bottom))}
.sheet .grab{width:40px;height:5px;border-radius:9px;background:var(--line);margin:4px auto 10px}
.sheet h2{font-size:1.15rem;margin:4px 0 8px}
.actions{display:flex;gap:10px;margin-top:18px}.actions .btn{flex:1}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom));background:var(--ink);
  color:var(--bg);padding:10px 16px;border-radius:99px;font-size:.9rem;z-index:40;max-width:90vw}

/* entrada */
.lock{min-height:100vh;display:flex;flex-direction:column;justify-content:center;max-width:420px;margin:0 auto;padding:24px 16px}
.lock img{width:72px;height:72px;margin:0 auto 8px;display:block}
.lock h1{text-align:center;margin-bottom:4px}.lock p{text-align:center}