/* ===== v176: bag + context action ===== */

/* Retire the meadow tool ring, the pinned tool chip and the ring pet button. */
.tool-dock96, #toolNow98, #toolPet96 { display: none !important; }

/* Both controls sit above the bottom HUD, opposite the stick. */
.bag176, .act176, .swap176 {
  position: fixed;
  left: 18px;
  z-index: 8;
  border: 1px solid rgba(255, 255, 255, .78);
  background: rgba(255, 255, 255, .82);
  color: #29483a;
  box-shadow: 0 6px 18px rgba(30, 60, 45, .18);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.bag176 { bottom: calc(92px + env(safe-area-inset-bottom)); width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; }
.bag176 .p96-icon { width: 30px; height: 30px; }
.bag176:active, .act176:active, .swap176:active { transform: scale(.94); }
.bag-badge176 {
  position: absolute; top: -3px; right: -3px;
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: #e6634a; color: #fff; font: 800 11px/18px system-ui; font-style: normal;
}

/* Action: label follows the context, so one wide pill instead of a row of tools. */
.act176 {
  bottom: calc(160px + env(safe-area-inset-bottom));
  height: 48px; min-width: 96px; padding: 0 16px 0 12px;
  border-radius: 24px; display: flex; align-items: center; gap: 8px;
  font: 800 14px system-ui;
}
.act176 .p96-icon { width: 24px; height: 24px; }
.act176[data-act="pull"] { background: #ffd84d; border-color: #f2c02c; animation: pull176 .55s ease-in-out infinite alternate; }
.act176[data-act="swing"], .act176[data-act="fish"] { background: rgba(214, 240, 222, .92); }
@keyframes pull176 { from { transform: scale(1); } to { transform: scale(1.06); } }

/* Swap chip: only when both a bug and the pond are in reach. */
.swap176 {
  bottom: calc(216px + env(safe-area-inset-bottom));
  width: 36px; height: 36px; border-radius: 50%; font: 700 16px system-ui;
}

/* Mirror when the stick is on the left (v93 setting). */
body[data-stick92="left"] .bag176,
body[data-stick92="left"] .act176,
body[data-stick92="left"] .swap176 { left: auto; right: 18px; }

/* `hidden` must win over the display rules above. */
.act176[hidden], .swap176[hidden] { display: none !important; }

/* Sheet: tabs */
.bag-tabs176 { display: flex; gap: 6px; margin: 0 0 12px; }
.bag-tabs176 button {
  flex: 1; height: 36px; border-radius: 12px; border: 1px solid rgba(42, 94, 65, .14);
  background: rgba(255, 255, 255, .55); color: #5c7669; font: 700 12px system-ui; position: relative;
}
.bag-tabs176 button.on { background: #2f6b4d; border-color: #2f6b4d; color: #fff; }
.bag-tabs176 em {
  position: absolute; top: -6px; right: -4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
  background: #e6634a; color: #fff; font: 800 10px/16px system-ui; font-style: normal;
}

/* Sheet: cards */
.life-card95.on176 { outline: 2px solid #2f6b4d; outline-offset: -2px; }
.life-card95.new176 { position: relative; }
.life-card95.new176::after {
  content: 'NEW'; position: absolute; top: 6px; right: 6px; padding: 1px 5px; border-radius: 6px;
  background: #e6634a; color: #fff; font: 800 9px/14px system-ui;
}
.life-card95.donated176 b::before { content: '\2605 '; color: #d9a400; }
.bag-emoji176 { font-size: 30px; line-height: 1; }
.bag-note176 { margin: 12px 2px 0; }
.bag-empty176 { margin: 0 2px; font-size: 12px; color: #6c8779; }

/* Dark theme */
html[data-theme="dark"] .bag176, html[data-theme="dark"] .act176, html[data-theme="dark"] .swap176 {
  background: rgba(30, 44, 36, .86); border-color: rgba(255, 255, 255, .12); color: #e4efe8;
}
html[data-theme="dark"] .act176[data-act="swing"], html[data-theme="dark"] .act176[data-act="fish"] { background: rgba(58, 110, 80, .9); }
html[data-theme="dark"] .bag-tabs176 button { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .08); color: #9db4a8; }
html[data-theme="dark"] .bag-empty176 { color: #9db4a8; }

/* v177: header close is icon-only; the label stays in aria-label */
.life-sheet95 header button span{display:none}
/* v177: tabs stay put while the list scrolls */
.life-body95 .bag-tabs176{position:sticky;top:0;z-index:2;background:rgba(252,255,250,.96);padding-top:6px}
html[data-theme="dark"] .life-body95 .bag-tabs176{background:rgba(24,35,31,.96)}