:root{
  --sage:#7E9B7A; --sage-dark:#5C7A58; --sage-light:#E4EBDF;
  --beige:#F1E6D3; --beige-dark:#E3D3B5; --cream:#FDFBF6; --ink:#3A4038; --muted:#8B9188;
}
*{box-sizing:border-box;}
html{scroll-padding-top:env(safe-area-inset-top,0px);}
body{
  font-family:'Nunito',sans-serif; background:var(--cream); color:var(--ink); margin:0;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
h1,h2,h3,.title-font{font-family:'Fraunces',serif; letter-spacing:-0.01em;}
.card{background:#fff; border-radius:20px; box-shadow:0 6px 20px rgba(92,122,88,0.09); border:1px solid rgba(92,122,88,0.06);}
.btn-main{background:var(--sage-dark); color:#fff; border-radius:14px; font-weight:700; letter-spacing:.01em; transition:transform .12s, opacity .12s; box-shadow:0 6px 16px rgba(92,122,88,0.25);}
.btn-main:active{transform:scale(.97); opacity:.92;}
.btn-main:disabled{opacity:.5; box-shadow:none;}
.btn-ghost{background:var(--sage-light); color:var(--sage-dark); border-radius:14px; font-weight:700;}
.food-photo{background:linear-gradient(145deg,var(--beige),var(--beige-dark)); display:flex; align-items:center; justify-content:center;}
.food-photo span{font-size:44px;}
.progress-bg{background:var(--beige); border-radius:99px; overflow:hidden;}
.progress-fill{background:linear-gradient(90deg,var(--sage),var(--sage-dark)); height:100%; border-radius:99px; transition:width .5s ease;}
.fade-in{animation:fadeIn .3s ease;}
@keyframes fadeIn{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);}}
.nav-item{display:flex; flex-direction:column; align-items:center; gap:2px; font-size:11px; font-weight:700; color:var(--muted); padding:8px 0;}
.nav-item.active{color:var(--sage-dark);}
.safe-bottom{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 84px);}
.navbar{padding-bottom:env(safe-area-inset-bottom,0px);}
input[type=text],input[type=email],input[type=number],input[type=tel],textarea{
  border:2px solid var(--beige-dark); border-radius:14px; padding:13px 15px; width:100%; font-family:'Nunito',sans-serif; outline:none; background:#fff;
}
input:focus,textarea:focus{border-color:var(--sage);}
.badge{background:var(--sage-light); color:var(--sage-dark); font-size:11px; font-weight:700; border-radius:99px; padding:3px 10px; text-transform:uppercase; letter-spacing:.03em;}
details.howto summary{cursor:pointer; font-weight:700; color:var(--sage-dark); list-style:none;}
details.howto summary::-webkit-details-marker{display:none;}
details.howto summary:before{content:"▸ "; }
details.howto[open] summary:before{content:"▾ "; }
.banner-offline{background:#FBEFDD; color:#8A5A20; font-size:12px; padding:8px 14px; text-align:center;}
.loading-screen{position:fixed; inset:0; display:flex; align-items:center; justify-content:center; background:var(--cream);}
.spinner{width:34px; height:34px; border:4px solid var(--beige); border-top-color:var(--sage-dark); border-radius:50%; animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
::-webkit-scrollbar{display:none;}

/* Ajustes leves do MVP: legibilidade, cartões e estados de foco */
body{background:linear-gradient(180deg,#f7f9f3 0%,#fdfbf6 48%);}
.card{border:1px solid #e7ebdf;box-shadow:0 8px 28px rgba(48,78,51,.08);}
.btn-main:hover{filter:brightness(1.07)}
button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #86ad83;outline-offset:2px}
.recipe-detail summary{cursor:pointer;padding:8px 0}
.recipe-detail li{margin:5px 0}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}