/* BBSH tactile packet / 2026-10-18. Original CSS; no third-party runtime. */
.sticker-shell .pack { isolation:isolate; }
.sticker-shell .pack-lining {
  position:absolute;inset:12.5% 3% 2%;z-index:0;pointer-events:none;
  border-radius:9px;background:linear-gradient(110deg,#526472,#b4c4cd 24%,#253e50 70%,#77919e);
  box-shadow:inset 0 1px 2px #e8f0f6aa,inset 0 -10px 12px #001321aa;
}
.sticker-shell .pack-mouth {
  position:absolute;left:3%;right:3%;top:13.7%;height:3.8%;z-index:1;
  border-radius:50%;background:linear-gradient(#010c16,#071a29 65%,#527084);
  box-shadow:0 -1px 0 #c5d5de80,inset 0 3px 5px #000c;
  pointer-events:none;opacity:0;transition:opacity .18s ease;
}
.sticker-shell [data-phase="tearing"] .pack-mouth { opacity:1; }
.sticker-shell .pack .pbody { z-index:2;box-shadow:inset 1px 0 0 #b3d6ea30,inset -2px 0 3px #03101c90,0 8px 14px #010b1540; }
.sticker-shell .pack .pbody::before {
  content:"";position:absolute;left:2%;right:2%;top:0;height:4px;z-index:4;
  background:linear-gradient(90deg,#c7d6df66,#eff7f4c0 28%,#405d7270 62%,#b1cbd970);
  clip-path:polygon(0 10%,7% 50%,14% 0,22% 45%,31% 10%,43% 40%,53% 0,65% 50%,77% 10%,88% 40%,100% 0,100% 100%,0 100%);
  pointer-events:none;
}
.sticker-shell .pack .flap { z-index:4;box-shadow:0 2px 3px #010b1580; }
.sticker-shell .st-card.is-emerging { pointer-events:none;filter:drop-shadow(0 5px 4px #010a1744); }
.sticker-shell .st-card { transition:translate .2s ease,filter .2s ease; }
@media (hover:hover) and (pointer:fine) {
  .sticker-shell:not(.is-calm) [data-phase="revealing"] .st-card:hover,
  .sticker-shell:not(.is-calm) [data-phase="revealed"] .st-card:hover {
    translate:0 -7px;filter:drop-shadow(0 12px 9px #0005);
  }
}
.sticker-shell:not(.is-calm) [data-phase="revealing"] .st-card:focus-visible,
.sticker-shell:not(.is-calm) [data-phase="revealed"] .st-card:focus-visible { translate:0 -5px; }
/* The highlight only touches the frame; photos and names stay unmasked. */
.sticker-shell .st-card .pack-reveal-glint {
  inset:0;width:auto;height:auto;transform:none;border-radius:inherit;padding:4px;
  background:linear-gradient(112deg,transparent 35%,var(--reveal-glint,#d5edf8) 48%,#fff 50%,transparent 61%);
  background-size:300% 100%;background-position:120% 0;pointer-events:none;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;
}
.sticker-shell .face>.shine {
  inset:0;padding:4px;pointer-events:none;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;
}
.sticker-shell .st-card.reveal-r0 .face { box-shadow:inset 0 0 0 1px #eee4cc35,0 6px 14px #020e1840; }
.sticker-shell .st-card.reveal-r1 .face { box-shadow:inset 0 0 0 1px #d3e4f777,0 7px 18px #08152055; }
.sticker-shell .st-card.reveal-r2 .face { box-shadow:inset 0 0 0 1px #eac584a0,0 7px 18px #130f0655; }
.sticker-shell .st-card.reveal-r3 .face { box-shadow:inset 0 0 0 1px #f7df98b0,0 8px 20px #221e1055; }
@supports not (mask-composite:exclude) {
  @supports not (-webkit-mask-composite:xor) {
    .sticker-shell .pack-reveal-glint,.sticker-shell .face>.shine { display:none; }
  }
}
/* A wrapped matchday banner leaves less vertical space on 320px phones.
   Let this view scroll normally instead of trapping Skip below a sticky nav.
   The album's existing sticky navigation and page sizing are untouched. */
/* Пакетик на телефоне: страница растёт по содержимому, нижнее меню не закрывает «Вскрыть пакетик»
   (на 390 px, особенно с плашкой матча над коллекцией, кнопка уходила под меню и не нажималась) */
@media (max-width:699px) {
  .sticker-shell .sticker-app[data-view="packView"] { height:auto;max-height:none;min-height:560px; }
  .sticker-shell .sticker-app[data-view="packView"] .st-nav { position:static; }
}
@media (max-width:380px) {
  .sticker-shell .sticker-app[data-view="packView"] .pack-layout,
  .sticker-shell .sticker-app[data-view="packView"] .pack-col { flex:0 0 auto; }
  .sticker-shell .sticker-app[data-view="packView"] .stage { flex:0 0 250px;height:250px;min-height:250px; }
  .sticker-shell .sticker-app[data-view="packView"] .stage-foot { flex:0 0 auto; }
  .sticker-shell .sticker-app[data-view="packView"] .st-nav { position:static; }
}
.sticker-shell.is-calm .st-card,.sticker-shell.is-calm .pack-mouth { transition:none;translate:none; }
@media (prefers-reduced-motion:reduce) {
  .sticker-shell .st-card,.sticker-shell .pack-mouth { transition:none!important;translate:none!important; }
}
/* вспышка вокруг наклейки (inset -30%, растёт до ×2) не должна давать горизонтальную прокрутку на 320 px;
   clip, а не hidden – липкое меню продолжает работать */
.sticker-shell { overflow-x: clip; }
