/* alarm.css — 5.5: сигнализация на голубя (alarm.js): плашка «Отбей голубя» над «Соседи | Топ», окно выбора, значки, магазин и рюкзак */

/* ---------- плашка над «Соседи | Топ» (стоит, не прокручивается — #search-tab колонкой, leaderboard.css) ---------- */
#search-tab .al-strip{ flex: none; display: flex; flex-direction: column; gap: 8px; margin: 0 0 10px; }
#search-tab .al-strip[hidden]{ display: none; }
.al-row{ position: relative; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 16px; color: #fff;
  background: linear-gradient(135deg, rgba(220,38,38,.92), rgba(127,29,29,.92)); box-shadow: 0 8px 22px rgba(220,38,38,.35), inset 0 0 0 1px rgba(255,255,255,.18); }
/* пульс: яркое свечение нарисовано заранее слоем ::after, анимируется только его прозрачность (тень сама не перерисовывается каждый кадр) */
.al-row::after{ content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
  box-shadow: 0 8px 30px rgba(255,70,70,.65), inset 0 0 0 1px rgba(255,255,255,.35); animation: al-pulse 1.6s ease-in-out infinite; }
.al-row.is-t{ background: linear-gradient(135deg, rgba(245,158,11,.9), rgba(146,64,14,.92)); box-shadow: 0 8px 22px rgba(245,158,11,.25), inset 0 0 0 1px rgba(255,255,255,.18); }
.al-row.is-t::after{ display: none; }
@keyframes al-pulse{ 0%,100%{ opacity: 0; } 50%{ opacity: 1; } }
body.less-motion .al-row::after{ animation: none; }
.al-pic{ flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: rgba(0,0,0,.25); }
.al-pic img{ width: 38px; height: 38px; object-fit: contain; filter: drop-shadow(0 2px 3px rgba(0,0,0,.4)); }
.al-tx{ flex: 1; min-width: 0; }
.al-tx b{ display: block; font-size: 14.5px; font-weight: 900; }
.al-tx small{ display: block; margin-top: 2px; font-size: 11.5px; font-weight: 700; color: rgba(255,255,255,.85); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.al-side{ flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.al-tm{ font-size: 13px; font-weight: 900; font-variant-numeric: tabular-nums; padding: 2px 8px; border-radius: 999px; background: rgba(0,0,0,.28); }
.al-tm.is-low{ color: #fde68a; }
.al-go{ height: 32px; padding: 0 14px; border: 0; border-radius: 10px; font: inherit; font-size: 13.5px; font-weight: 900; cursor: pointer;
  color: #7f1d1d; background: #fff; box-shadow: 0 3px 0 rgba(0,0,0,.25); -webkit-tap-highlight-color: transparent; }
.al-go:active{ transform: translateY(2px); box-shadow: 0 1px 0 rgba(0,0,0,.25); }
.al-go:disabled{ opacity: .6; }

/* ---------- значок на карточке фермы (inventory.js → cardBadgesHtml) ---------- */
.al-card-ico{ width: 26px; height: 26px; flex: 0 0 26px; box-sizing: border-box; border-radius: 50%; display: grid; place-items: center; font-size: 13px; line-height: 1;
  background: linear-gradient(180deg, #ef4444, #991b1b); border: 1.5px solid rgba(255,255,255,.85); box-shadow: 0 2px 6px rgba(0,0,0,.35); }

/* ---------- кнопка в окне голубя (inventory.js → .pm-alarm) ---------- */
.pm-alarm{ height: 42px; margin-top: 8px; border-radius: 14px; border: 1px solid rgba(248,113,113,.45); background: rgba(239,68,68,.12); color: #fca5a5;
  font-family: inherit; font-size: 14.5px; font-weight: 900; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.pm-alarm[hidden]{ display: none; }
.pm-alarm.is-on{ border-color: rgba(248,113,113,.7); background: rgba(239,68,68,.22); color: #fff; }
.pm-alarm:active{ transform: scale(.98); }

/* ---------- окно выбора (поверх окна голубя) ---------- */
.al-sheet{ position: fixed; inset: 0; z-index: 2147483400; display: flex; align-items: flex-end; justify-content: center; background: rgba(5,8,20,.6);
  padding: 0 10px calc(10px + var(--pf-safe-bottom, 0px)); animation: al-fade .18s ease; }
@keyframes al-fade{ from{ opacity: 0; } }
.al-card{ position: relative; width: 100%; max-width: 440px; padding: 16px 14px 14px; border-radius: 22px; background: #1c243e; color: #fff;
  box-shadow: 0 -10px 40px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.1); animation: al-up .22s cubic-bezier(.2,.8,.3,1.1); }
@keyframes al-up{ from{ transform: translateY(30px); opacity: .4; } }
.al-x{ position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border: 0; border-radius: 10px; background: rgba(255,255,255,.08); color: #cfd3ea; font: inherit; font-weight: 900; cursor: pointer; }
.al-h{ display: flex; align-items: center; gap: 10px; padding-right: 40px; }
.al-h img{ width: 46px; height: 46px; object-fit: contain; }
.al-h b{ display: block; font-size: 17px; font-weight: 900; }
.al-h small{ display: block; color: #9aa3c7; font-size: 12.5px; font-weight: 700; }
.al-about{ margin: 10px 2px 12px; color: #cfd3ea; font-size: 12.5px; font-weight: 700; line-height: 1.4; }
.al-opt{ display: flex; align-items: center; gap: 10px; padding: 10px; margin-bottom: 8px; border-radius: 14px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.al-opt.is-on{ box-shadow: inset 0 0 0 2px rgba(248,113,113,.7); background: rgba(239,68,68,.1); }
.al-opt__ic, .al-shop-ico, .al-bag-ic{ position: relative; flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 20px;
  background: linear-gradient(160deg, #ef4444, #7f1d1d); }
.al-opt__ic em, .al-shop-ico em, .al-bag-ic em{ position: absolute; right: -5px; bottom: -5px; padding: 0 5px; border-radius: 999px; font-style: normal; font-size: 10.5px; font-weight: 900;
  color: #fff; background: #0b0f24; box-shadow: 0 0 0 2px #1c243e; }
.al-opt__tx{ flex: 1; min-width: 0; }
.al-opt__tx b{ display: block; font-size: 14.5px; font-weight: 900; }
.al-opt__tx small{ display: block; color: #9aa3c7; font-size: 11.5px; font-weight: 700; }
.al-b{ height: 32px; padding: 0 12px; border: 0; border-radius: 10px; font: inherit; font-size: 12.5px; font-weight: 900; cursor: pointer; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 4px; background: linear-gradient(180deg, #ef4444, #b91c1c); color: #fff; }
.al-b.is-buy{ background: rgba(255,215,106,.14); color: #ffd76a; box-shadow: inset 0 0 0 1px rgba(255,215,106,.35); }
.al-b:disabled{ opacity: .45; }
.al-cur{ font-size: 12.5px; font-weight: 900; color: #fca5a5; }
.al-off{ width: 100%; height: 40px; margin-top: 4px; border: 0; border-radius: 12px; background: rgba(255,255,255,.06); color: #cfd3ea; font: inherit; font-size: 13.5px; font-weight: 800; cursor: pointer; }
.al-fe{ display: inline-block; object-fit: contain; vertical-align: -2px; }

/* ---------- магазин и рюкзак ---------- */
.mk-row--alarm{ border-color: rgba(248,113,113,.35); }
.mk-row--alarm .al-shop-ico{ flex: 0 0 56px; width: 56px; height: 56px; border-radius: 16px; font-size: 26px; }
.bag-al{ background: none; }
.bag-al .al-bag-ic{ width: 46px; height: 46px; border-radius: 13px; }