:root{
  --bg:#050505; --accent:#FF4500; --card:#111111; --card-border:rgba(255,255,255,0.06);
  --ok:#3ddc84; --muted:#737373;
}
*{-webkit-font-smoothing:antialiased;box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:#d4d4d4;font-family:'Inter',system-ui,sans-serif;font-weight:300;padding-bottom:90px}
::selection{background:var(--accent);color:#fff}
a{color:inherit}
.serif{font-family:'Playfair Display',serif}
.stat-num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* texturas */
.dot-pattern{position:fixed;inset:0;z-index:0;opacity:.4;pointer-events:none;
  background-image:radial-gradient(circle,rgba(255,255,255,.06) 1px,transparent 1px);background-size:32px 32px}

.wrap{position:relative;z-index:1;max-width:780px;margin:0 auto;padding:0 16px}

/* header */
.topbar{position:sticky;top:0;z-index:30;background:rgba(5,5,5,.85);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--card-border)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:58px}
.brand{font-family:'Playfair Display',serif;font-size:1.15rem;color:#fff}
.brand b{color:var(--accent)}
.kicker{font-size:.62rem;text-transform:uppercase;letter-spacing:.28em;color:rgba(255,69,0,.8);font-weight:500}

/* cards */
.card{background:var(--card);border:1px solid var(--card-border);border-radius:1rem;padding:1.25rem;transition:border-color .3s}
.card:hover{border-color:rgba(255,69,0,.20)}
.card.accent{border-color:rgba(255,69,0,.30)}
.card.glow{box-shadow:0 0 60px rgba(255,69,0,.08)}
.card.ok{border-color:rgba(61,220,132,.30)}
.grid{display:grid;gap:12px}
.g2{grid-template-columns:1fr 1fr}
.g3{grid-template-columns:1fr 1fr 1fr}
@media(max-width:560px){.g3{grid-template-columns:1fr 1fr}.hide-sm{display:none}}
/* custo: cards full-width no mobile pra caber o número */
@media(max-width:560px){#view-custo .g3{grid-template-columns:1fr}}
/* telas bem estreitas */
@media(max-width:390px){
  .big{font-size:1.95rem}
  .cost-num{font-size:1.6rem}
  .card{padding:1.05rem}
  .wrap{padding:0 12px}
}

.section-title{display:flex;align-items:center;gap:10px;margin:26px 0 14px}
.divider{width:40px;height:2px;background:linear-gradient(90deg,var(--accent),transparent)}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer;
  font-family:inherit;font-weight:600;border-radius:9999px;padding:14px 22px;font-size:.95rem;
  background:var(--accent);color:#fff;transition:background .2s,transform .1s}
.btn:hover{background:#e63e00}
.btn:active{transform:scale(.98)}
.btn.full{width:100%}
.btn.ghost{background:transparent;border:1px solid var(--card-border);color:#d4d4d4;font-weight:500}
.btn.ghost.on{border-color:var(--accent);color:#fff;background:rgba(255,69,0,.08)}
.btn.sm{padding:8px 14px;font-size:.8rem}
.glow{animation:glow 4s ease-in-out infinite}
@keyframes glow{0%,100%{box-shadow:0 0 16px rgba(255,69,0,.2),0 0 40px rgba(255,69,0,.06)}50%{box-shadow:0 0 24px rgba(255,69,0,.35),0 0 56px rgba(255,69,0,.1)}}

/* inputs */
input,select{width:100%;background:#1a1a1a;border:1px solid var(--card-border);border-radius:.7rem;
  padding:12px;color:#fff;font-family:inherit;font-size:16px;font-weight:300}
input:focus,select:focus{outline:none;border-color:rgba(255,69,0,.45)}
label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:6px}
.field{margin-bottom:12px}

/* badges / pills */
.pill{font-size:.6rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;padding:3px 9px;border-radius:9999px}
.pill.accent{background:rgba(255,69,0,.18);color:var(--accent)}
.pill.ok{background:rgba(61,220,132,.16);color:var(--ok)}
.pill.muted{background:rgba(255,255,255,.05);color:var(--muted)}

/* macro barras */
.macro{margin:10px 0}
.macro .top{display:flex;justify-content:space-between;font-size:.85rem;margin-bottom:5px}
.bar{height:8px;border-radius:9999px;background:#1a1a1a;overflow:hidden}
.bar>span{display:block;height:100%;background:var(--accent);border-radius:9999px;transition:width .4s}
.bar.over>span{background:#e63e00}

/* números grandes */
.big{font-size:2.2rem;font-weight:500;color:#fff;line-height:1.05}
.big .u{font-size:1rem;color:var(--muted)}
.sub{font-size:.8rem;color:var(--muted);margin-top:6px}
.cost-num{font-size:1.75rem;font-weight:500;color:#fff;line-height:1.05;white-space:nowrap}

/* cabeçalho da aba Hoje (kcal + botão) */
.today-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px;flex-wrap:wrap}
.today-head .kc{flex:1 1 auto;min-width:120px}
.today-head .btn{flex:0 0 auto}
@media(max-width:520px){
  .today-head .btn{flex:1 1 100%;width:100%}
}

/* meal rows */
.meal-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--card-border)}
.meal-row:last-child{border-bottom:none}
.foodline{font-size:.8rem;color:var(--muted)}

/* tab bar (mobile-first bottom nav) */
.tabbar{position:fixed;bottom:0;left:0;right:0;z-index:40;background:rgba(10,10,10,.92);backdrop-filter:blur(14px);
  border-top:1px solid var(--card-border);display:flex;justify-content:space-around;padding:8px 0 max(8px,env(safe-area-inset-bottom))}
.tabbar button{background:none;border:none;color:var(--muted);font-family:inherit;font-size:.62rem;
  text-transform:uppercase;letter-spacing:.08em;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px 10px}
.tabbar button .ic{font-size:1.15rem;line-height:1}
.tabbar button.on{color:var(--accent)}

.view{display:none;animation:fade .4s ease}
.view.on{display:block}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

.muted{color:var(--muted)}
.accent{color:var(--accent)}
.right{text-align:right}
.row{display:flex;gap:10px;align-items:center}
.spread{display:flex;justify-content:space-between;align-items:center}
small.note{font-size:.7rem;color:#525252;display:block;margin-top:8px}
.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:#1a1a1a;border:1px solid rgba(255,69,0,.3);
  color:#fff;padding:10px 18px;border-radius:9999px;font-size:.85rem;z-index:50;opacity:0;transition:opacity .3s;pointer-events:none}
.toast.show{opacity:1}
hr{border:none;border-top:1px solid var(--card-border);margin:14px 0}
