/* 108 Pranayama · phone quick bar (+1 glass, Check Calories, Steps) and the Check Calories pop-up */
.qb108,.qb-toast{display:none}
@media (max-width:899px){
  body.qb108-on{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))!important}
  .qb108{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:99980;
    padding:8px max(10px,env(safe-area-inset-left,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(10px,env(safe-area-inset-right,0px));
    background:rgba(251,246,236,.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid #EADBC6;box-shadow:0 -10px 30px -18px rgba(90,40,10,.45);
    font-family:Mukta,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  .qb-b{display:flex;align-items:center;justify-content:center;gap:8px;min-height:58px;padding:6px 8px;border-radius:16px;border:1px solid #EADBC6;background:#fff;color:#2B211B!important;
    text-decoration:none!important;font:inherit;cursor:pointer;box-shadow:0 6px 14px -12px rgba(110,60,20,.7);-webkit-tap-highlight-color:transparent;transition:transform .12s}
  .qb-b:active{transform:scale(.96)}
  .qb-b:focus-visible{outline:3px solid #F2B98B;outline-offset:2px}
  .qb-ic{font-size:22px;line-height:1}
  .qb-tx{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15;min-width:0}
  .qb-tx b{font-size:14.5px;font-weight:800;white-space:nowrap}
  .qb-n{font-size:11.5px;color:#6E6057;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .qb-water{background:#E8F4FA;border-color:#BFE0EF}
  .qb-water b{color:#1A5E80}
  .qb-cal{background:linear-gradient(180deg,#EE9446,#D9711F);border-color:#D9711F;color:#fff!important;box-shadow:0 10px 20px -12px rgba(200,95,20,.9)}
  .qb-cal .qb-n{color:rgba(255,255,255,.9)}
  .qb-steps{background:#EEF4E6;border-color:#CFE2BA}
  .qb-steps b{color:#3F6B1E}
  .qb-water.pop .qb-ic{animation:qbpop .5s ease-out}
  @keyframes qbpop{0%{transform:scale(1)}35%{transform:scale(1.45) translateY(-4px)}100%{transform:scale(1)}}
  @media (max-width:360px){.qb-ic{font-size:19px}.qb-tx b{font-size:13px}.qb-b{gap:5px;padding:6px 5px}}
  /* the Mitra sun and its tip sit above the bar */
  body.qb108-on .mitra108-fab{bottom:calc(84px + max(10px,env(safe-area-inset-bottom,0px)))!important}
  body.qb108-on .mitra108-tip{bottom:calc(100px + env(safe-area-inset-bottom,0px))!important}
  /* one place for everything that floats, above the bar:
     Mitra on the right, the home page's Om chant button on the left (its message opens to the right) */
  body.qb108-on .lv-om{right:auto!important;left:calc(12px + env(safe-area-inset-left,0px))!important;bottom:calc(94px + env(safe-area-inset-bottom,0px))!important;flex-direction:row-reverse;gap:8px}
  body.qb108-on .lv-om-btn{width:52px;height:52px;font-size:26px}
  body.qb108-on .lv-om-tip{white-space:normal!important;max-width:calc(100vw - 190px);padding:7px 12px;font-size:13.5px}
  body.qb108-on:has(#lv-om) .qb-toast{bottom:calc(156px + env(safe-area-inset-bottom,0px))}
  /* the site's "something new" message and the install-app banner also clear the bar */
  body.qb108-on div[role="status"][style*="left:18px;bottom:18px"]{bottom:calc(94px + env(safe-area-inset-bottom,0px))!important}
  body.qb108-on div[aria-label="Install the 108 Pranayama app"]{bottom:calc(160px + env(safe-area-inset-bottom,0px))!important}
  /* no empty band under the header */
  body.qb108-tight header.wp-block-template-part .wp-block-group.alignwide{padding-top:10px!important;padding-bottom:4px!important}
  body.qb108-tight .wp-site-blocks>main,body.qb108-tight .wp-site-blocks>header+*{margin-top:0!important}
  body.qb108-tight .qb108-first[class*="-bleed"]{padding-top:12px!important}
  /* hidden while the menu drawer or Mitra's panel is open */
  body.m108-lock .qb108{display:none}

  .qb-toast{display:flex;align-items:center;gap:10px;position:fixed;left:12px;right:96px;bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:99995;
    padding:10px 10px 10px 14px;border-radius:14px;background:#2B211B;color:#fff;font:600 14.5px/1.3 Mukta,system-ui,sans-serif;box-shadow:0 14px 30px -14px rgba(0,0,0,.6);
    opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .2s,transform .2s}
  .qb-toast.on{opacity:1;transform:none;pointer-events:auto}
  .qb-toast span{flex:1}
  .qb-toast button{flex:none;min-height:36px;padding:4px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.5);background:none;color:#FFD9B0;font:700 14px Mukta,system-ui,sans-serif;cursor:pointer}
}

/* ---------- the Check Calories pop-up ---------- */
.qb-sheet{position:fixed;inset:0;z-index:2147482500;font-family:Mukta,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.qb-scrim{position:absolute;inset:0;background:rgba(43,33,27,.5);opacity:0;transition:opacity .25s}
.qb-card{position:absolute;left:0;right:0;bottom:0;max-height:92vh;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:#FFFBF4;
  border-radius:24px 24px 0 0;padding:6px 16px calc(18px + env(safe-area-inset-bottom,0px));box-shadow:0 -20px 50px -20px rgba(60,30,10,.5);transform:translateY(100%);transition:transform .28s cubic-bezier(.2,.8,.2,1);color:#2B211B}
.qb-sheet.on .qb-scrim{opacity:1}
.qb-sheet.on .qb-card{transform:none}
@media (min-width:900px){.qb-card{left:50%;right:auto;bottom:auto;top:50%;width:560px;border-radius:24px;transform:translate(-50%,-46%);opacity:0;transition:transform .25s,opacity .25s}.qb-sheet.on .qb-card{transform:translate(-50%,-50%);opacity:1}.qb-grab{display:none}}
.qb-grab{width:44px;height:5px;border-radius:5px;background:#E3D3BC;margin:4px auto 6px}
.qb-head{display:flex;align-items:center;justify-content:space-between;gap:10px;position:sticky;top:-6px;background:#FFFBF4;padding:6px 0 8px;z-index:2}
.qb-head h2{margin:0;font-family:Marcellus,Georgia,serif;font-weight:400;font-size:24px;color:#7A2E2A}
.qb-x{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid #EADBC6;background:#fff;font-size:17px;cursor:pointer;color:#2B211B}
.qb-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;list-style:none;margin:0 0 12px;padding:0}
.qb-guide li{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;font-size:12.5px;line-height:1.25;color:#6E6057;background:#FFF1DE;border-radius:12px;padding:8px 6px}
.qb-guide b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#D9711F;color:#fff;font-size:13px}
.qb-guide[hidden]{display:none}
.qb-cc .qb-stepped{position:relative}
.qb-cc .cc-field.qb-stepped .cc-label::before,.qb-cc .cc-preview.qb-stepped::before{content:attr(data-step);display:inline-grid;place-items:center;width:22px;height:22px;margin-right:8px;border-radius:50%;background:#D9711F;color:#fff;font:700 12.5px/1 Mukta,system-ui,sans-serif;vertical-align:1px}
.qb-cc .cc-field.qb-stepped .cc-label::before{content:"1"}
.qb-cc .cc-preview.qb-stepped::before{content:"2";position:absolute;left:10px;top:10px;margin:0;z-index:1}
.qb-cc .cc-go{font-size:17px}
.qb-fine{margin:12px 0 0;text-align:center;font-size:12.5px;color:#6E6057}
body.qb-lock{overflow:hidden}
/* the "Today so far" / "If you eat this" panel in the Check Calories pop-up */
.qb-stats{background:#fff;border:1px solid #EADBC6;border-radius:16px;padding:12px 14px;margin:0 0 14px;display:grid;gap:8px}
.qb-stats-h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 10px}
.qb-stats-h b{font-family:Marcellus,Georgia,serif;font-weight:400;font-size:18px;color:#7A2E2A}
.qb-stats-h span{font-size:12.5px;color:#6E6057}
.qb-swap{border:0;background:none;padding:0;font:inherit;font-weight:700;color:#9E4A12;text-decoration:underline;cursor:pointer}
.qb-row{display:grid;gap:4px}
.qb-row-t{display:flex;justify-content:space-between;gap:8px;font-size:14px;color:#6E6057}
.qb-row-t b{color:#2B211B}
.qb-row-t i{font-style:normal;color:#D9711F;font-weight:700}
.qb-meter{display:flex;height:9px;border-radius:5px;background:#EDE2D2;overflow:hidden}
.qb-meter i{display:block;height:100%;background:linear-gradient(90deg,#C9A13A,#E07B24)}
.qb-meter i.add{background:repeating-linear-gradient(45deg,#2F3A7A 0 6px,#5361AE 6px 12px)}
.qb-row.over .qb-meter i.add{background:repeating-linear-gradient(45deg,#C9566E 0 6px,#E07A90 6px 12px)}
.qb-left{margin:2px 0 0;font-size:14px;color:#2B211B}