/* SacaPlato v0.9.16 · popup contrast + pantry head cleanup */
:root{
  --sp916-orange:#ff6b2c;
  --sp916-orange-strong:#ff5a18;
  --sp916-cream:#fff0dc;
  --sp916-paper:#fff7ec;
  --sp916-ink:#17130f;
  --sp916-acid:#d9ff63;
}

/* HELP popup: body copy must be visible and punchy. */
#aboutDialog .help-steps article{
  background:var(--sp916-paper)!important;
  color:var(--sp916-ink)!important;
}
#aboutDialog .help-steps article b{
  color:var(--sp916-ink)!important;
}
#aboutDialog .help-steps article p{
  color:var(--sp916-orange-strong)!important;
  opacity:1!important;
}
#aboutDialog .help-steps article:nth-child(2),
#aboutDialog .help-steps article:nth-child(3),
#aboutDialog .help-steps article:nth-child(4){
  background:var(--sp916-paper)!important;
  color:var(--sp916-ink)!important;
}
#aboutDialog .help-steps article:nth-child(2) p,
#aboutDialog .help-steps article:nth-child(3) p,
#aboutDialog .help-steps article:nth-child(4) p{
  color:var(--sp916-orange-strong)!important;
}

/* Pantry dialog: same sticker language as the other popups. */
#pantryDialog.about-dialog{
  background:var(--sp916-orange)!important;
}
#pantryDialog .pantry-dialog-head{
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr)!important;
  gap:14px!important;
  align-items:center!important;
  margin:16px 16px 14px!important;
  padding:18px 54px 18px 18px!important;
  background:var(--sp916-cream)!important;
  color:var(--sp916-ink)!important;
  border:3px solid var(--sp916-ink)!important;
  border-radius:22px!important;
  box-shadow:5px 6px 0 var(--sp916-ink)!important;
}
#pantryDialog .pantry-dialog-head .eyebrow{
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  margin:0 0 12px!important;
  padding:9px 12px!important;
  border:3px solid var(--sp916-ink)!important;
  border-radius:9px!important;
  background:var(--sp916-ink)!important;
  color:var(--sp916-acid)!important;
  box-shadow:4px 4px 0 var(--sp916-acid)!important;
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:950!important;
  letter-spacing:.13em!important;
  text-transform:uppercase!important;
}
#pantryDialog .pantry-dialog-head img{
  width:56px!important;
  height:56px!important;
  border:3px solid var(--sp916-ink)!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:4px 5px 0 var(--sp916-acid)!important;
  transform:rotate(-5deg)!important;
}
#pantryDialog .pantry-dialog-head h2{
  margin:0!important;
  color:var(--sp916-ink)!important;
  font-family:"Arial Black",Impact,ui-sans-serif,sans-serif!important;
  font-size:clamp(36px,6vw,60px)!important;
  line-height:.92!important;
  letter-spacing:-.06em!important;
  text-transform:uppercase!important;
  text-shadow:none!important;
  -webkit-text-stroke:0!important;
}
#pantryDialog .pantry-dialog-head h2 em{
  display:inline-block!important;
  color:var(--sp916-ink)!important;
  font-style:normal!important;
  text-shadow:3px 4px 0 var(--sp916-acid)!important;
  -webkit-text-stroke:0!important;
}
#pantryDialog .pantry-dialog-copy{
  color:var(--sp916-ink)!important;
}

/* Pantry tiles: aligned and readable on mobile too. */
#pantryDialog .pantry-editor-grid{
  padding:0 16px!important;
}
#pantryDialog .pantry-tile{
  grid-template-columns:58px minmax(0,1fr) 34px!important;
  gap:12px!important;
  padding:12px 13px!important;
}
#pantryDialog .pantry-tile-copy b{
  font-size:17px!important;
  line-height:1.08!important;
}
#pantryDialog .pantry-tile-copy small{
  margin-top:5px!important;
  font-size:10px!important;
  line-height:1.2!important;
  color:#73452c!important;
}
#pantryDialog .pantry-tile.is-on .pantry-tile-copy small{
  color:#73452c!important;
}

/* Mobile fixed button should leave IA REAL visible. */
@media(max-width:860px){
  #floatingForgotButton{
    bottom:calc(156px + env(safe-area-inset-bottom))!important;
  }
  #pantryDialog .pantry-dialog-head{
    margin:14px 12px 12px!important;
    padding:16px 46px 16px 14px!important;
    grid-template-columns:50px minmax(0,1fr)!important;
    gap:11px!important;
  }
  #pantryDialog .pantry-dialog-head img{
    width:48px!important;height:48px!important;
  }
  #pantryDialog .pantry-dialog-head .eyebrow{
    font-size:10px!important;
    margin-bottom:10px!important;
    padding:8px 10px!important;
  }
  #pantryDialog .pantry-dialog-head h2{
    font-size:clamp(30px,9vw,44px)!important;
    line-height:.9!important;
  }
  #pantryDialog .pantry-dialog-head h2 em{
    text-shadow:2.5px 3px 0 var(--sp916-acid)!important;
  }
  #pantryDialog .pantry-editor-grid{
    padding:0 12px!important;
  }
  #pantryDialog .pantry-tile{
    grid-template-columns:52px minmax(0,1fr) 30px!important;
    min-height:86px!important;
  }
  #pantryDialog .pantry-emoji{
    width:52px!important;height:52px!important;font-size:28px!important;
  }
  #pantryDialog .pantry-tile>i{
    width:30px!important;height:30px!important;font-size:14px!important;
  }
}
@media(max-width:430px){
  #floatingForgotButton{
    bottom:calc(162px + env(safe-area-inset-bottom))!important;
  }
  #pantryDialog .pantry-dialog-head{
    padding:14px 44px 14px 12px!important;
  }
  #pantryDialog .pantry-dialog-head h2{
    font-size:clamp(28px,9.2vw,39px)!important;
  }
}