:root{
  --green:#0b7a3b; --green-dark:#095f2e;
  --ink:#1a1a1a; --muted:#6b6b6b;
  --bg:#f4f4f2; --card:#fff; --line:#e6e6e2; --err:#b00020;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.4;
}
#app{max-width:480px;margin:0 auto;min-height:100vh;}

.screen{padding:28px 22px 40px;display:flex;flex-direction:column;gap:20px;min-height:100vh;}
.screen.center{justify-content:center;align-items:center;text-align:center;gap:14px;}

.muted{color:var(--muted);font-size:.95rem;}
.err{color:var(--err);font-weight:600;}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.8rem;color:var(--muted);word-break:break-all;}

.dash-head{margin-top:8px;}
.hello{font-size:1.6rem;font-weight:700;letter-spacing:-.02em;}
.tagline{color:var(--muted);font-size:1.05rem;margin-top:2px;}

.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;}
.card-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:6px;}
.goal-big{font-size:1.35rem;font-weight:650;}

.streak-row{display:flex;gap:16px;}
.stat{flex:1;display:flex;flex-direction:column;}
.stat-num{font-size:2rem;font-weight:750;line-height:1;color:var(--green);}
.stat-lbl{font-size:.82rem;color:var(--muted);margin-top:4px;}
.pips{display:flex;gap:8px;margin-top:16px;}
.pip{flex:1;height:8px;border-radius:99px;background:var(--line);}
.pip.on{background:var(--green);}

.btn{border:none;border-radius:14px;font-size:1.05rem;font-weight:650;padding:16px;
  cursor:pointer;font-family:inherit;transition:transform .04s ease,background .15s ease;}
.btn:active{transform:scale(.99);}
.btn.primary{background:var(--green);color:#fff;}
.btn.primary:active{background:var(--green-dark);}
.btn.big{width:100%;padding:18px;font-size:1.15rem;margin-top:4px;}
.btn.ghost{background:transparent;color:var(--green);border:1px solid var(--line);}
.btn:disabled{opacity:.6;cursor:default;}

.foot{text-align:center;margin-top:auto;padding-top:12px;}