/* Collection page additions: nest pack opening + original trophy cabinet. */

/* ------------------------------------------------------------------ */
/* Egg-in-nest pack opening                                            */
/* ------------------------------------------------------------------ */
.pack-opening {
  border: 1px solid rgba(102, 67, 31, .16);
  border-radius: 18px;
  background: #fffdf8;
  color: #352416;
  padding: 0;
  max-width: min(94vw, 760px);
  box-shadow: 0 24px 80px rgba(71, 47, 24, .28);
}
.pack-opening::backdrop {
  background: rgba(246, 239, 224, .88);
  backdrop-filter: blur(7px);
}
.pack-opening__stage {
  padding: 18px 18px 16px;
  text-align: center;
  border-radius: inherit;
  background: radial-gradient(circle at 50% 8%, #fff 0, #fffaf0 44%, #f5ead4 100%);
}
.pack-opening__stage h2 { margin: 0 0 8px; font-size: 18px; color: #7a4b0f; }
.pack-opening .button--quiet { background: #fff; color: #342516; border-color: rgba(76, 52, 28, .3); }

.nest { position: relative; width: min(86vw, 620px); margin: 0 auto; aspect-ratio: 4 / 3; }
.nest__bg, .nest__fg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.nest__bg { z-index: 1; }
.egg-container { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; }
.nest__fg { z-index: 3; }

.egg-card {
  position: absolute;
  left: 50%; top: 50%;
  width: 24%;
  aspect-ratio: 3 / 4;
  margin-left: -12%;
  margin-top: -18%;
  cursor: pointer;
  border: 0;
  padding: 0;
  background: none;
  perspective: 700px;
  transform: translate(var(--x, 0), var(--y, 0));
  z-index: 4; /* eggs sit above the nest foreground so they stay clickable */
  transition: transform .2s ease;
}
.egg-card:hover:not(.revealed) { transform: translate(var(--x, 0), var(--y, 0)) scale(1.07); }
.egg-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; backface-visibility: hidden; transition: transform .55s ease; filter: drop-shadow(0 4px 8px rgba(0,0,0,.5)); }
.egg-card .egg-card__back { transform: rotateY(0); }
.egg-card .egg-card__front { transform: rotateY(180deg); }
.egg-card.revealed .egg-card__back { transform: rotateY(-180deg); }
.egg-card.revealed .egg-card__front { transform: rotateY(0); }
.egg-card__back.is-missing {
  color: transparent;
  font-size: 0;
  background: radial-gradient(circle at 38% 28%, #fffdf6 0 8%, #f6dfad 28%, #d9a756 76%, #8a5a22 100%);
  border: 4px solid #2a1b12;
  border-radius: 50% 50% 46% 46% / 60% 60% 42% 42%;
  box-sizing: border-box;
}

/* Crack shake right before the hatch flip */
.egg-card.is-cracking { animation: egg-crack .45s ease; }
@keyframes egg-crack {
  0%, 100% { transform: translate(var(--x, 0), var(--y, 0)) rotate(0); }
  20% { transform: translate(var(--x, 0), var(--y, 0)) rotate(-7deg); }
  40% { transform: translate(var(--x, 0), var(--y, 0)) rotate(7deg); }
  60% { transform: translate(var(--x, 0), var(--y, 0)) rotate(-5deg); }
  80% { transform: translate(var(--x, 0), var(--y, 0)) rotate(4deg); }
}
/* Hatch pop when revealed */
.egg-card.revealed { animation: hatch-pop .45s ease; z-index: 6; }
@keyframes hatch-pop { 40% { transform: translate(var(--x, 0), var(--y, 0)) scale(1.18); } }

/* Trophy unlock toast */
.trophy-toast {
  position: fixed; right: 16px; bottom: 16px; z-index: 8000;
  display: flex; align-items: center; gap: 12px;
  background: rgba(20, 14, 8, .95); color: #fff; border: 1px solid #ffd700;
  border-radius: 12px; padding: 10px 16px; box-shadow: 0 8px 24px rgba(0,0,0,.5);
}
.trophy-toast img { width: 64px; height: 64px; object-fit: contain; }
.trophy-toast strong { color: #ffd27a; }
.trophy-toast small { display: block; opacity: .8; }
.trophy-toast.is-showing { animation: trophy-toast-in .5s ease; }
@keyframes trophy-toast-in { from { transform: translateY(24px) scale(.8); opacity: 0; } 70% { transform: translateY(-4px) scale(1.04); } }

.saved-deck-picker {
  display: flex;
  align-items: end;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
}
.saved-deck-picker label { min-width: min(100%, 300px); }
.saved-deck-picker select { width: 100%; }

.binder-scope-tabs {
  display: inline-flex;
  gap: 4px;
  margin-bottom: 14px;
  padding: 4px;
  border-radius: 999px;
  background: rgba(0,0,0,.22);
}
.binder-scope-tabs button {
  border: 0;
  border-radius: 999px;
  padding: .55rem .95rem;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.binder-scope-tabs button[aria-selected="true"] {
  background: #f7b731;
  color: #241400;
  box-shadow: 0 3px 10px rgba(0,0,0,.25);
}

.binder-set-heading {
  grid-column: 1 / -1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  margin: 14px 0 2px;
  padding: 12px 2px 8px;
  border-bottom: 2px solid rgba(86,52,25,.18);
}
.binder-set-heading:first-child { margin-top: 0; }
.binder-set-heading h2 { margin: 0; font-size: clamp(1.2rem, 3vw, 1.75rem); }
.binder-set-heading span { color: var(--ink-soft); font-size: .76rem; font-weight: 800; white-space: nowrap; }
.binder-set-heading--expansion { margin-top: 34px; border-bottom-color: rgba(178,42,45,.34); }
.binder-expansion-lock { grid-column:1/-1; margin:0 0 18px; padding:18px 20px; border:2px dashed #8b5b9e; border-radius:16px; color:#5e4771; background:linear-gradient(135deg,#fbf4ff,#f1e5f8); font-weight:800; line-height:1.45; }
.binder-set-heading--expansion h2 { color: #a62c2c; }

.sticker-book-panel {
  background: linear-gradient(135deg, rgba(255,253,248,.97), rgba(255,235,198,.95));
}
.sticker-book-panel[hidden] { display: none; }
.sticker-book-head { display: flex; align-items: start; justify-content: space-between; gap: 28px; }
.sticker-book-head h2 { margin: .2rem 0 .65rem; }
.sticker-book-head > div:first-child { max-width: 760px; }
.sticker-book-progress { display: grid; min-width: min(100%, 430px); grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sticker-book-progress div { padding: 14px; border-radius: 12px; background: rgba(255,255,255,.72); box-shadow: inset 0 0 0 1px rgba(70,40,19,.1); }
.sticker-book-progress strong { display: block; color: #aa241e; font-size: 1.5rem; }
.sticker-book-progress span { color: #654c3d; font-size: .8rem; font-weight: 700; }
.sticker-book-viewer {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 58px;
  align-items: center;
  gap: 12px;
  margin: 24px 0 20px;
  padding: clamp(10px, 2vw, 24px);
  border-radius: 18px;
  background: radial-gradient(circle at 50% 30%, #704829, #28190f 75%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 18px 44px rgba(58,34,17,.26);
}
.sticker-book-spread { position: relative; min-width: 0; margin: 0; overflow: visible; }
.sticker-book-scrollport { width:100%; max-height:min(72vh,820px); overflow:auto; overscroll-behavior:contain; scrollbar-gutter:stable both-edges; border-radius:10px; }
.sticker-book-art { position: relative; min-width: 0; width:100%; max-width:none; margin-inline:auto; }
.sticker-book-spread::after {
  content: '';
  position: absolute;
  top: 2%; bottom: 8%; left: 50%;
  width: 1.4%;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(40,20,7,.24), rgba(255,255,255,.13), transparent);
  pointer-events: none;
}
.sticker-book-spread.is-single::after { display: none; }
.sticker-book-art > img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  border-radius: 8px;
  filter: brightness(var(--sticker-page-brightness, 1)) contrast(.98) saturate(1.04) drop-shadow(0 13px 18px rgba(0,0,0,.35));
}
.sticker-book-spread.is-single .sticker-book-art { margin-inline:auto; }
.sticker-book-spread figcaption {
  position: sticky; left: 0; bottom: 0; z-index: 50;
  display: flex; justify-content: space-between; align-items:center; gap: 18px;
  width: min(100%, 100vw); min-width: min(100%, 640px);
  padding: 10px 8px; margin-top: 6px; border-radius: 12px;
  color: #fff4dc; font-size: .82rem; background: rgba(32,18,10,.88);
  box-shadow: 0 -5px 16px rgba(0,0,0,.22); backdrop-filter: blur(6px);
}
.sticker-book-spread figcaption span { color: rgba(255,244,220,.72); }
.sticker-book-fullscreen {
  margin-left: auto; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; padding: 6px 10px;
  color: #fff4dc; background: rgba(255,255,255,.1); font: 800 .74rem/1 system-ui, sans-serif; cursor: pointer;
}
.sticker-book-fullscreen:hover { background: rgba(255,255,255,.2); }
.sticker-book-toolbar { display:flex; align-items:center; gap:8px; margin-left:auto; }
.sticker-book-zoom { min-width: 34px; padding-inline: 0; }
.sticker-book-zoom-readout { display:inline-flex; align-items:center; justify-content:center; min-width:56px; padding:6px 8px; border-radius:999px; color:#fff4dc; background:rgba(255,255,255,.08); font:800 .74rem/1 system-ui,sans-serif; }
.sticker-book-back-cards { position: absolute; inset: 0; pointer-events: none; }
.sticker-book-back-cards img {
  position: absolute; top: 28.2%; width: 22.8%; height: 32.7%; object-fit: contain;
  border-radius: 4%; background: #16120c; box-shadow: 0 4px 8px rgba(0,0,0,.52);
}
.sticker-book-back-cards img:nth-child(1) { left: 1.2%; }
.sticker-book-back-cards img:nth-child(2) { left: 25.1%; }
.sticker-book-back-cards img:nth-child(3) { left: 49.1%; }
.sticker-book-back-cards img:nth-child(4) { left: 73.0%; }
.sticker-book-viewer:fullscreen,
.sticker-book-viewer.is-fullscreen-fallback {
  position: fixed; inset: 0; z-index: 1000; width: 100vw; height: 100vh; height: 100dvh; margin: 0;
  grid-template-columns: clamp(44px, 6vw, 74px) minmax(0, 1fr) clamp(44px, 6vw, 74px);
  padding: clamp(8px, 2vw, 24px); border-radius: 0; background: radial-gradient(circle at 50% 30%, #704829, #160d08 78%);
}
.sticker-book-viewer:fullscreen .sticker-book-scrollport,
.sticker-book-viewer.is-fullscreen-fallback .sticker-book-scrollport { max-height:calc(100dvh - 96px); }
body.sticker-book-fullscreen-fallback { overflow: hidden; }
.sticker-book-arrow {
  width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%;
  color: #3c210e; background: #ffd27a; font-size: 1.7rem; font-weight: 900; cursor: pointer;
  box-shadow: 0 5px 14px rgba(0,0,0,.3);
}
.sticker-book-arrow:disabled { cursor: default; filter: grayscale(1); opacity: .28; }
.scrapbook-helper {
  scroll-margin-top:16px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  margin:-4px 0 20px; padding:12px 14px; border-radius:14px;
  color:#4b301f; background:linear-gradient(135deg,#fff3c7,#f7d993);
  box-shadow:inset 0 0 0 1px rgba(92,54,24,.16),0 8px 18px rgba(84,47,20,.12);
}
.scrapbook-helper[hidden]{display:none}
.scrapbook-helper > div:first-child{display:grid;gap:2px;max-width:720px}
.scrapbook-helper > div:first-child span{font-size:.83rem;color:#745038}
.scrapbook-helper__controls{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.scrapbook-helper__controls .button{padding:7px 10px;font-size:.76rem}
.sticker-slot-layer.is-scrapbook{pointer-events:auto;cursor:default}
.scrapbook-sticker{
  --scrapbook-scale:1; --scrapbook-rotation:0deg;
  position:absolute; width:12%; aspect-ratio:1; padding:0; border:0; background:transparent;
  transform:translate(-50%,-50%) rotate(var(--scrapbook-rotation)) scale(var(--scrapbook-scale));
  transform-origin:center; touch-action:none; cursor:grab; z-index:5;
}
.scrapbook-sticker:active{cursor:grabbing}
.scrapbook-sticker.is-selected::after{
  content:''; position:absolute; inset:-4px; border:2px dashed #ffe15f; border-radius:14px;
  filter:drop-shadow(0 2px 3px #0008); pointer-events:none;
}
.scrapbook-sticker img{
  width:100%;height:100%;object-fit:contain;pointer-events:none;
  filter:drop-shadow(0 6px 5px rgba(0,0,0,.38));
  transform:translate(var(--sticker-shift-x,0%),var(--sticker-shift-y,0%)) scale(var(--sticker-visible-scale,1));
  transform-origin:center;
}
.sticker-inventory-card.is-scrapbook-ready::after{
  content:'ADD'; position:absolute; left:7px; top:7px; padding:4px 6px; border-radius:999px;
  color:#2e220d;background:#ffe06d;font:900 .62rem/1 system-ui,sans-serif;
}
.sticker-book-viewer.is-scrapbook-page .sticker-book-spread::after{display:none}
.sticker-book-foot { display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.sticker-book-features { margin: 0; padding-left: 1.2rem; color: #543e31; }
.sticker-book-features li + li { margin-top: .45rem; }
.sticker-book-features code { font-size: .82em; }

.pack-results { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 14px; }
.result-card { width: 130px; text-align: center; animation: reward-slide .4s ease backwards; }
.result-card:nth-child(2) { animation-delay: .05s; } .result-card:nth-child(3) { animation-delay: .1s; }
.result-card:nth-child(4) { animation-delay: .15s; } .result-card:nth-child(5) { animation-delay: .2s; }
.result-card:nth-child(6) { animation-delay: .25s; }
@keyframes reward-slide { from { transform: translateY(16px); opacity: 0; } }
.result-card img { width: 100%; border-radius: 8px; box-shadow: 0 4px 10px rgba(0,0,0,.3); }

/* ------------------------------------------------------------------ */
/* Trophy cabinet — original artwork                                   */
/* ------------------------------------------------------------------ */
.trophy-cabinet {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
}
.trophy {
  position: relative; border: 0; background: rgba(255,255,255,.06);
  border-radius: 12px; padding: 10px 8px 12px; cursor: pointer; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  transition: transform .15s ease;
}
.trophy:hover { transform: translateY(-3px); }
.trophy-img {
  width: 150px;
  height: 150px;
  max-width: 100%;
  object-fit: contain;
  filter: drop-shadow(0 5px 10px rgba(0,0,0,.5));
}
.trophy--locked .trophy-img { filter: grayscale(1) brightness(.45); }
.trophy--silver .trophy-img { filter: drop-shadow(0 0 6px #cfd8dc); }
.trophy--gold .trophy-img { filter: drop-shadow(0 0 8px #ffd700); }
.trophy--platinum .trophy-img { filter: drop-shadow(0 0 10px #9be7ff) saturate(1.2); }
.trophy strong { font-size: 12px; line-height: 1.2; }
.trophy .tier-tag { font-size: 10px; text-transform: uppercase; letter-spacing: .06em; opacity: .8; }
.trophy--bronze .tier-tag { color: #cd7f32; }
.trophy--silver .tier-tag { color: #c0c0c0; }
.trophy--gold .tier-tag { color: #ffd700; }
.trophy--platinum .tier-tag { color: #9be7ff; }
.progress-bar { width: 100%; height: 6px; border-radius: 999px; background: rgba(0,0,0,.35); overflow: hidden; }
.progress-fill { height: 100%; background: linear-gradient(90deg, #ff6b6b, #feca57); border-radius: 999px; transition: width .4s ease; }

/* Unlock animation */
.trophy.is-unlocking { animation: trophy-unlock .9s ease; }
@keyframes trophy-unlock {
  0% { transform: scale(.6) rotate(-8deg); }
  40% { transform: scale(1.25) rotate(4deg); filter: drop-shadow(0 0 18px #ffd700); }
  100% { transform: scale(1); }
}
.trophy-unlock .dialog__content { animation: trophy-unlock .9s ease; }
.trophy-unlock img { width: 150px; height: 150px; object-fit: contain; filter: drop-shadow(0 0 16px #ffd700); }

.trophy-popup { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.trophy-popup img {
  width: min(360px, 75vw);
  height: min(360px, 65vh);
  max-width: 100%;
  object-fit: contain;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

/* Unowned binder cards are deliberately face-down so the player can
   see which catalogue slots still need to be collected. */
.collection-card.is-unowned {
  opacity: .82;
  cursor: default;
}

.collection-card.is-unowned:hover {
  transform: none;
}

.collection-card__back {
  width: 100%;
  aspect-ratio: 5 / 7;
  object-fit: contain;
  display: block;
  filter: brightness(.82) saturate(.8);
}

.collection-card__visual {
  position: relative;
  display: block;
}

.holo-card {
  position: relative;
  display: inline-block;
  isolation: isolate;
}

.holo-card > img:first-child {
  display: block;
}

.holo-card__overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: .66;
  z-index: 2;
}

.holo-card__sparkle {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  background:
    linear-gradient(115deg, transparent 0 26%, rgba(255,255,255,.52) 36%, rgba(255,255,255,.07) 45%, transparent 56%),
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.32), transparent 34%),
    radial-gradient(circle at 82% 14%, rgba(255,240,168,.22), transparent 28%);
  opacity: .78;
}

.collection-card__holo-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 4;
  padding: 3px 7px;
  border-radius: 999px;
  color: #24133c;
  background: linear-gradient(135deg, #fff2b8, #8ee8ff 55%, #f2b2ff);
  box-shadow: 0 4px 10px rgba(0,0,0,.35);
  font: 900 10px/1 system-ui, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.collection-card.is-unowned .collection-card__body strong {
  color: rgba(255,255,255,.65);
}

.collection-card.is-unowned .collection-card__body span {
  color: rgba(255,255,255,.55);
}

/* Locked trophies fallback styling */
.trophy--locked .trophy-img {
  filter: grayscale(100%) brightness(0.55) contrast(0.85);
  opacity: 0.75;
}

/* Optional: subtle flash prevention */
.trophy--locked .trophy-img {
  transition: filter 0.3s ease;
}

.trophy-popup.trophy--locked .popup-img {
  filter: grayscale(100%) brightness(0.55) contrast(0.85);
  opacity: 0.75;
}

.trophy__claimable {
  border: 0;
  border-radius: 999px;
  padding: .28rem .6rem;
  background: #f7b731;
  color: #241400;
  font-size: .72rem;
  font-weight: 800;
  cursor: pointer;
}

.trophy-reward-line { display: block; }

.cabinet-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin: 28px 0 14px;
}
.cabinet-heading h3 { margin: .15rem 0 0; }
.cabinet-heading > strong { color: #ffd27a; white-space: nowrap; }
.cabinet-heading--bosses { margin-top: 42px; }

.collection-boss-trophies {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}
.collection-boss-trophy {
  min-width: 0;
  padding: 10px 7px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-align: center;
  border-radius: 12px;
  background: rgba(255,255,255,.06);
}
.collection-boss-trophy img {
  width: 120px;
  height: 120px;
  max-width: 100%;
  object-fit: contain;
  filter: drop-shadow(0 5px 10px rgba(0,0,0,.5));
}
.collection-boss-trophy strong { font-size: .75rem; line-height: 1.2; }
.collection-boss-trophy small { color: #ffd27a; font-size: .68rem; }
.collection-boss-trophy.is-locked img { filter: grayscale(1) brightness(.32); }
.collection-boss-trophy--grand { background:linear-gradient(160deg,rgba(116,69,9,.9),rgba(38,21,7,.96)); box-shadow:inset 0 0 24px rgba(255,216,93,.18); }

@media (max-width: 1100px) {
  .trophy-cabinet { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .collection-boss-trophies { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .trophy-cabinet { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .collection-boss-trophies { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cabinet-heading { align-items: start; flex-direction: column; gap: 4px; }
  .trophy-img { width: 125px; height: 125px; }
}

.owned-nfts {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.owned-nft {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 10px;
  background: rgba(255,255,255,.07);
  color: inherit;
  cursor: pointer;
}

.owned-nft:hover { transform: translateY(-2px); }
.owned-nft img { width: 100%; aspect-ratio: 1; object-fit: contain; border-radius: 7px; background: #fff; }
.owned-nft span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.nft-dialog { width: min(96vw, 1050px); }
.nft-dialog__content { max-width: none; }
.nft-dialog__heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.nft-dialog__heading h2 { margin: .2rem 0 .8rem; }
.nft-dialog__layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(220px, 1fr); gap: 18px; }
.nft-media { position: relative; min-height: 440px; display: grid; place-items: center; border-radius: 12px; overflow: hidden; background: #f4eee4; }
.nft-media img { width: 100%; height: min(68vh, 650px); object-fit: contain; }
.nft-media__status { position: absolute; left: 50%; bottom: 14px; z-index: 2; transform: translateX(-50%); margin: 0; padding: 7px 12px; border-radius: 999px; color: #fff; background: rgba(28,22,37,.82); font-size: .78rem; font-weight: 800; white-space: nowrap; }
.nft-model-fallback { max-height: 360px; }
.nft-media .empty-state { display: grid; justify-items: center; gap: 8px; max-width: 520px; padding: 18px; text-align: center; }
.owned-nft img.is-placeholder { opacity: .82; }
.nft-view-toggle { display: flex; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; overflow: hidden; }
.nft-view-toggle button { border: 0; padding: .55rem .8rem; background: transparent; color: inherit; cursor: pointer; }
.nft-view-toggle button[aria-pressed="true"] { background: #d7263d; color: #fff; }
.nft-view-toggle button:disabled { cursor: not-allowed; opacity: .42; }
[data-panel="wallet"] code { overflow-wrap: anywhere; }
.nft-metadata dl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; }
.nft-trait { padding: 8px; border-radius: 8px; background: rgba(255,255,255,.07); }
.nft-trait dt { color: var(--muted, #aaa); font-size: .72rem; }
.nft-trait dd { margin: 3px 0 0; font-weight: 700; overflow-wrap: anywhere; }
.nft-navigation { justify-content: space-between; }

@media (max-width: 720px) {
  .nft-dialog__layout { grid-template-columns: 1fr; }
  .nft-media { min-height: 300px; }
  .sticker-book-head, .sticker-book-foot { flex-direction: column; }
  .sticker-book-progress { width: 100%; }
  .sticker-book-viewer { grid-template-columns: 42px minmax(0, 1fr) 42px; gap: 5px; padding: 8px 4px 12px; }
  .sticker-book-arrow { width: 38px; height: 38px; font-size: 1.2rem; }
  .sticker-book-scrollport { max-height:68vh; }
  .sticker-book-spread figcaption { gap:6px; flex-wrap:wrap; min-width:0; padding:8px 6px; }
  .sticker-book-toolbar { gap:5px; flex-wrap:wrap; justify-content:flex-end; }
  .binder-set-heading { align-items: start; flex-direction: column; gap: 2px; }
}

/* ------------------------------------------------------------------ */
/* Working Sticker Book: packs, inventory, placement and saved slots   */
/* ------------------------------------------------------------------ */
.sticker-slot-layer {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}
.sticker-slot {
  position: absolute;
  display: grid;
  place-items: center;
  overflow: visible;
  padding: 0;
  border: 1px dashed transparent;
  border-radius: 8%;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.sticker-slot:hover,
.sticker-slot:focus-visible {
  z-index: 8;
  border-color: rgba(255,255,255,.9);
  background: rgba(255,255,255,.12);
  outline: none;
  transform: scale(1.025);
}
.sticker-slot.has-sticker:not(.is-filled) { border-color: rgba(255,226,105,.4); }
.sticker-slot.is-selected {
  z-index: 10;
  border: 2px dashed #ffe56f;
  background: rgba(255,229,111,.12);
  box-shadow: 0 0 0 3px rgba(60,33,14,.45), 0 0 18px rgba(255,229,111,.5);
}
.sticker-book-selection-controls { display:inline-flex; gap:6px; }
.sticker-book-selection-controls button:disabled { opacity:.38; cursor:default; }
body.debug-sticker-slots .sticker-slot { border-color: #27f5ff; background: rgba(39,245,255,.08); }
.sticker-slot__plus {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  color: #28190f;
  background: #ffe47c;
  box-shadow: 0 3px 10px rgba(0,0,0,.45);
  font: 900 18px/1 system-ui, sans-serif;
}
.sticker-slot__image {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  object-position: center;
  filter: drop-shadow(0 3px 3px rgba(0,0,0,.5));
  transform: translate(var(--sticker-shift-x, 0%), var(--sticker-shift-y, 0%)) scale(var(--sticker-visible-scale, 1));
  transform-origin: center;
  pointer-events: none;
}
.sticker-slot__image.is-card-fallback { width: 90%; height: 90%; max-width:90%; max-height:90%; border-radius: 5%; }

.sticker-pack-controls {
  display: grid;
  min-width: min(100%, 330px);
  gap: 8px;
  padding: 14px;
  border-radius: 14px;
  background: rgba(255,255,255,.68);
  box-shadow: inset 0 0 0 1px rgba(70,40,19,.1);
}
.sticker-pack-controls label { display: grid; gap: 5px; color: #654c3d; font-weight: 800; }
.sticker-pack-controls select { min-width: 0; }
.sticker-pack-controls small { color: #654c3d; text-align: center; }
.sticker-pack-balance-line { margin: 0; color: #654c3d; text-align: center; font-weight: 800; }
.pack-balance-line { max-width: 520px; margin: 0 auto 18px; text-align: center; }

.sticker-inventory {
  margin-top: 22px;
  padding: clamp(14px, 2vw, 22px);
  border-radius: 18px;
  background: rgba(58,33,17,.08);
  box-shadow: inset 0 0 0 1px rgba(70,40,19,.12);
}
.sticker-inventory__head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.sticker-inventory__head h3 { margin: 2px 0 0; }
.sticker-inventory__head label { display: grid; gap: 4px; color: #654c3d; font-weight: 800; }
.sticker-inventory__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
  gap: 12px;
}
.sticker-inventory-card {
  position: relative;
  display: grid;
  content-visibility: auto;
  contain-intrinsic-size: 190px 150px;
  min-width: 0;
  grid-template-rows: 132px auto auto;
  gap: 5px;
  padding: 9px;
  border: 1px solid rgba(82,47,24,.16);
  border-radius: 14px;
  color: #372518;
  background: rgba(255,253,248,.82);
  text-align: center;
  cursor: pointer;
  box-shadow: 0 6px 15px rgba(60,34,17,.12);
}
.sticker-inventory-card[draggable="true"] { cursor: grab; }
.sticker-inventory-card[draggable="true"]:active { cursor: grabbing; }
.sticker-inventory-card:hover { transform: translateY(-2px); box-shadow: 0 9px 20px rgba(60,34,17,.2); }
.sticker-inventory-card.is-placed { background: rgba(255,242,190,.9); }
.sticker-inventory-card__image { width: 100%; height: 132px; object-fit: contain; filter: drop-shadow(0 3px 3px rgba(0,0,0,.3)); transform: translate(var(--sticker-shift-x, 0%), var(--sticker-shift-y, 0%)) scale(var(--sticker-visible-scale, 1)); transform-origin:center; }
.sticker-inventory-card__image.is-card-fallback { border-radius: 8px; }
.sticker-inventory-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sticker-inventory-card small { color: #725644; }
.sticker-inventory-card__count,
.sticker-inventory-card__placed {
  position: absolute;
  top: 7px;
  padding: 4px 6px;
  border-radius: 999px;
  color: #fff;
  background: #342116;
  font: 900 .68rem/1 system-ui, sans-serif;
}
.sticker-inventory-card__count { right: 7px; }
.sticker-inventory-card__placed { left: 7px; background: #8d2c24; }

.sticker-picker {
  width: min(760px, calc(100vw - 24px));
  max-width: 760px;
  overflow: hidden;
}
.sticker-picker .dialog__content {
  width: auto;
  max-width: 100%;
  min-width: 0;
  padding: 32px 28px 26px;
  overflow: hidden;
}
.sticker-picker [data-role="sticker-picker-title"] {
  max-width: calc(100% - 42px);
  margin: .25rem auto .8rem;
  overflow-wrap: anywhere;
  font-size: clamp(1.65rem, 4vw, 2.35rem);
  line-height: 1.08;
}
.sticker-picker__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
  margin: 14px 0 18px;
}
.sticker-picker__option {
  display: grid;
  min-width: 0;
  grid-template-rows: 142px auto auto;
  gap: 5px;
  padding: 9px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 13px;
  color: #fff;
  background: #1c1825;
  cursor: pointer;
}
.sticker-picker__option strong,
.sticker-picker__option small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sticker-picker__option:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0,0,0,.3); }
.sticker-picker__option:disabled { cursor: default; opacity: .48; }
.sticker-picker__option.is-placed { opacity: 1; box-shadow: inset 0 0 0 2px #ffd66b; }
.sticker-picker__image { width: 100%; height: 142px; object-fit: contain; filter: drop-shadow(0 4px 5px rgba(0,0,0,.55)); transform: translate(var(--sticker-shift-x, 0%), var(--sticker-shift-y, 0%)) scale(var(--sticker-visible-scale, 1)); transform-origin:center; }
.sticker-picker__image.is-card-fallback { border-radius: 9px; }
.sticker-picker .button-row { justify-content: center; margin-top: 0; }

@media (max-width: 720px) {
  .sticker-book-spread figcaption{min-width:100%;gap:6px;flex-wrap:wrap;padding:8px}
  .sticker-book-toolbar{width:100%;justify-content:center;margin-left:0;flex-wrap:wrap}
  .scrapbook-helper{align-items:flex-start}
  .scrapbook-helper__controls{width:100%}
  .scrapbook-sticker{width:18%}
}

@media (max-width: 620px) {
  .sticker-picker { width: min(94vw, 520px); }
  .sticker-picker .dialog__content { padding: 28px 16px 20px; }
  .sticker-picker__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .sticker-picker__option { grid-template-rows: 126px auto auto; padding: 8px; }
  .sticker-picker__image { height: 126px; }
}

.egg-card__front--sticker { object-fit: contain !important; padding: 7%; filter: drop-shadow(0 7px 7px rgba(0,0,0,.65)) !important; }
.pack-summary__grid .sticker-result-card__image {
  width: 100%;
  height: 150px;
  aspect-ratio: auto;
  object-fit: contain;
  padding: 4px;
  border-radius: 0;
  box-shadow: none;
  filter: drop-shadow(0 5px 6px rgba(0,0,0,.45));
  transform: translate(var(--sticker-shift-x, 0%), var(--sticker-shift-y, 0%)) scale(var(--sticker-visible-scale, 1));
  transform-origin:center;
}
.pack-summary__grid .sticker-result-card__image.is-card-fallback { border-radius: 8px; }

.sticker-book-viewer:fullscreen .sticker-slot__plus,
.sticker-book-viewer.is-fullscreen-fallback .sticker-slot__plus { width: 30px; height: 30px; font-size: 22px; }

@media (max-width: 700px) {
  .sticker-inventory__head { align-items: stretch; flex-direction: column; }
  .sticker-inventory__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sticker-inventory-card { grid-template-rows: 112px auto auto; }
  .sticker-inventory-card__image { height: 112px; }
  .sticker-slot__plus { width: 18px; height: 18px; font-size: 14px; }
}


/* ------------------------------------------------------------------ */
/* Temporary wrapper artwork + sticker-pack $EGG shop                 */
/* ------------------------------------------------------------------ */
.pack-art-showcase {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(8px, 1.5vw, 18px);
  margin-bottom: 10px;
  padding: clamp(10px, 2vw, 20px);
  border-radius: 18px;
  background: radial-gradient(circle at 50% 20%, rgba(255,210,94,.2), rgba(13,12,20,.95) 68%);
}
.pack-art-showcase figure { min-width: 0; margin: 0; text-align: center; }
.pack-art-showcase.pack-art-showcase--single { grid-template-columns: minmax(0, 1fr); justify-items: center; }
.pack-art-showcase--single figure { width: min(330px, 100%); }
.pack-art-showcase img {
  display: block;
  width: 100%;
  max-height: 390px;
  object-fit: contain;
  filter: drop-shadow(0 12px 18px rgba(0,0,0,.52));
  transition: transform .18s ease;
}
.pack-art-showcase figure:hover img { transform: translateY(-5px) scale(1.02); }
.pack-art-showcase figcaption { margin-top: 5px; color: #fff4d0; font-size: .75rem; font-weight: 900; }
.pack-art-note { margin: 0 0 18px; color: var(--ink-soft); text-align: center; font-size: .82rem; }
.pack-opening__wrapper {
  display: block;
  width: min(112px, 24vw);
  max-height: 165px;
  margin: -4px auto 6px;
  object-fit: contain;
  filter: drop-shadow(0 8px 10px rgba(0,0,0,.5));
}
.sticker-pack-shop {
  display: grid;
  grid-template-columns: minmax(120px, 190px) minmax(260px, 430px);
  gap: 18px;
  align-items: center;
  padding: 15px;
  border-radius: 16px;
  background: rgba(255,255,255,.66);
  box-shadow: inset 0 0 0 1px rgba(70,40,19,.12);
}
.sticker-pack-shop__art {
  display: block;
  width: 100%;
  max-height: 260px;
  object-fit: contain;
  filter: drop-shadow(0 9px 12px rgba(44,23,8,.38));
}
.sticker-pack-controls { display: grid; gap: 10px; }
.sticker-pack-controls label { min-width: 0; }
.sticker-pack-controls select,
.sticker-pack-controls input { width: 100%; }
.sticker-pack-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.sticker-pack-purchase {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  align-items: end;
  padding-top: 10px;
  border-top: 1px solid rgba(70,40,19,.14);
}
.sticker-pack-purchase > strong { grid-column: 1 / -1; color: #a1251f; }
.sticker-pack-purchase > button { grid-column: 1 / -1; }

@media (max-width: 760px) {
  .pack-art-showcase { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sticker-book-foot { align-items: stretch; flex-direction: column; }
  .sticker-pack-shop { grid-template-columns: minmax(95px, 30vw) minmax(0, 1fr); width: 100%; }
}
@media (max-width: 520px) {
  .sticker-pack-shop { grid-template-columns: 1fr; }
  .sticker-pack-shop__art { max-height: 220px; }
  .sticker-pack-purchase { grid-template-columns: 1fr; }
  .sticker-pack-purchase > strong,
  .sticker-pack-purchase > button { grid-column: auto; }
}

/* ------------------------------------------------------------------ */
/* Sticker bulk controls + duplicate Nest Claw                        */
/* ------------------------------------------------------------------ */
.sticker-book-bulk-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.claw-panel { overflow: hidden; }
.claw-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 18px;
}
.claw-heading h2 { margin: .2rem 0 .55rem; }
.claw-heading p { max-width: 760px; margin-bottom: 0; }
.claw-ticket-chip {
  flex: 0 0 auto;
  min-width: 150px;
  padding: 14px 18px;
  border-radius: 16px;
  text-align: center;
  color: #fff6d4;
  background: linear-gradient(145deg, #27233f, #15141f);
  box-shadow: 0 10px 24px rgba(36,23,42,.22);
}
.claw-ticket-chip span { display: block; opacity: .72; font-size: .78rem; font-weight: 800; }
.claw-ticket-chip strong { display: block; margin-top: 2px; font-size: 2rem; }
.claw-layout {
  display: grid;
  grid-template-columns: minmax(240px, 330px) minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}
.claw-recycler {
  display: grid;
  gap: 11px;
  padding: 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  box-shadow: inset 0 0 0 1px rgba(70,40,19,.1);
}
.claw-recycler h3 { margin: 0 0 4px; }
.claw-recycler small { color: #705545; line-height: 1.35; }
.claw-recycler__stat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff8e9;
  box-shadow: inset 0 0 0 1px rgba(83,48,21,.1);
}
.claw-recycler__stat span { color: #654c3d; font-weight: 800; }
.claw-recycler__stat strong { color: #aa241e; font-size: 1.35rem; }
.claw-machine {
  min-width: 0;
  padding: clamp(12px, 2vw, 20px);
  border-radius: 24px;
  background: linear-gradient(145deg, #26223c, #11111a 74%);
  box-shadow: 0 18px 46px rgba(30,18,42,.28), inset 0 0 0 2px rgba(255,225,125,.2);
  color: #fff7dd;
  text-align: center;
}
.claw-machine__cabinet {
  position: relative;
  width: min(100%, 760px);
  aspect-ratio: 16 / 11;
  min-height: 330px;
  margin: 0 auto;
  overflow: hidden;
  border: 5px solid #e9bc45;
  border-radius: 24px;
  background:
    radial-gradient(circle at 50% 64%, rgba(255,184,65,.19), transparent 42%),
    linear-gradient(180deg, #0e1523 0 58%, #21172d 100%);
  box-shadow: inset 0 0 0 3px rgba(61,32,15,.65), inset 0 0 60px rgba(0,0,0,.58);
}
.claw-machine__cabinet::before,
.claw-machine__cabinet::after {
  content: "";
  position: absolute;
  z-index: 20;
  inset: 9px auto auto 10px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #f8d56f;
  box-shadow: calc(100% + 690px) 0 #f8d56f;
  opacity: .75;
}
.claw-machine__rail {
  position: absolute;
  z-index: 22;
  top: 4%;
  left: 8%;
  right: 8%;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(#dadede, #6e787d);
  box-shadow: 0 2px 0 rgba(0,0,0,.55);
}
.claw-machine__claw {
  --claw-x: 0px;
  position: absolute;
  z-index: 12;
  top: -5%;
  left: 50%;
  width: clamp(86px, 15%, 118px);
  translate: calc(-50% + var(--claw-x)) 0;
  transform-origin: 50% 0;
  filter: drop-shadow(0 7px 6px rgba(0,0,0,.42));
}
.claw-machine__claw > img:first-child {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
}
.claw-machine__roof {
  position: absolute;
  z-index: 24;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.claw-machine__carry {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 66%;
  width: 86%;
  height: 150px;
  translate: -50% 0;
  scale: .9;
  opacity: 0;
  object-fit: contain;
  object-position: center top;
  filter: drop-shadow(0 7px 7px rgba(0,0,0,.58));
  pointer-events: none;
  transition: opacity .14s ease, scale .16s ease;
}
.claw-machine__claw.has-carry .claw-machine__carry {
  opacity: 1;
  scale: 1;
}
.claw-machine__carry[data-kind="grenade"] {
  top: 71%;
  width: 78%;
  height: 118px;
}
.claw-machine.is-playing .claw-machine__claw {
  animation: claw-grab 2.35s cubic-bezier(.4,0,.2,1) both;
}
@keyframes claw-grab {
  0% { translate: -50% 0; }
  18% { translate: calc(-50% + var(--claw-x)) 0; }
  48% { translate: calc(-50% + var(--claw-x)) 52%; }
  66% { translate: calc(-50% + var(--claw-x)) 52%; }
  90%, 100% { translate: calc(-50% + var(--claw-x)) 0; }
}
.claw-machine__nest {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.claw-machine__nest-back,
.claw-machine__nest-front {
  position: absolute;
  left: 50%;
  bottom: -24%;
  width: min(100%, 813px);
  height: auto;
  translate: -50% 0;
  object-fit: contain;
  object-position: center bottom;
  pointer-events: none;
  user-select: none;
}
.claw-machine__nest-back { z-index: 6; }
.claw-machine__nest-front { z-index: 16; }
.claw-machine__play { min-width: 180px; margin-top: 14px; }
.claw-machine__status { min-height: 1.35em; margin: 10px 0 0; color: rgba(255,247,221,.78); }
.claw-machine__explosion {
  position: absolute;
  z-index: 30;
  inset: 0;
  display: grid;
  place-items: center;
  background: radial-gradient(circle, rgba(255,240,144,.1), rgba(54,10,8,.78));
  animation: claw-explode .72s ease-out both;
}
.claw-machine__explosion[hidden] { display: none; }
.claw-machine__explosion img {
  position: absolute;
  width: min(72%, 420px);
  max-height: 76%;
  object-fit: contain;
  filter: drop-shadow(0 0 26px rgba(255,126,22,.75));
}
.claw-machine__explosion img:nth-child(2) { width: min(35%, 220px); z-index: 2; }
.claw-machine__explosion strong {
  position: relative;
  z-index: 3;
  margin-top: 34%;
  font-size: clamp(2.5rem, 8vw, 6rem);
  letter-spacing: -.06em;
  text-shadow: 0 5px 0 #1d0e0e, 0 0 20px #ff4b23;
}
@keyframes claw-explode {
  0% { opacity: 0; transform: scale(.65); }
  34% { opacity: 1; transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1); }
}
.claw-result {
  display: grid;
  grid-template-columns: minmax(80px, 130px) minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  max-width: 620px;
  margin: 14px auto 0;
  padding: 13px 16px;
  border-radius: 16px;
  color: #241b1b;
  text-align: left;
  background: #fff7df;
  box-shadow: 0 10px 26px rgba(0,0,0,.28);
}
.claw-result[hidden] { display: none; }
.claw-result img { width: 100%; height: 124px; object-fit: contain; }
.claw-result h3 { margin: 0 0 5px; }
.claw-result p { margin: 0; color: #674d3d; }
.claw-result--loss { grid-template-columns: 95px 1fr; background: #ffd9d3; }
.claw-odds { margin-top: 16px; color: #654c3d; }
.claw-odds summary { cursor: pointer; font-weight: 900; }
.claw-odds p { margin-bottom: 0; }

@media (max-width: 860px) {
  .claw-layout { grid-template-columns: 1fr; }
  .claw-recycler { order: 2; }
}
@media (max-width: 620px) {
  .claw-heading { flex-direction: column; }
  .claw-ticket-chip { width: 100%; }
  .claw-machine__cabinet { min-height: 280px; }
  .claw-result { grid-template-columns: 84px minmax(0,1fr); }
  .sticker-book-bulk-actions { justify-content: stretch; }
  .sticker-book-bulk-actions .button { flex: 1 1 180px; }
}

/* ------------------------------------------------------------------ */
/* Four-wrapper pack-shop counter                                     */
/* ------------------------------------------------------------------ */
.pack-shop-counter {
  position: relative;
  overflow: hidden;
  padding: 62px clamp(16px,3vw,34px) 22px;
  border: 6px solid #5d361a;
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgb(15 15 25 / 93%), rgb(29 23 31 / 97%)),
    repeating-linear-gradient(90deg, #6a3e20 0 10%, #85512b 10% 20%);
  box-shadow: inset 0 0 0 3px #d99c3f, inset 0 -42px 0 #513019, 0 18px 42px rgb(60 31 13 / 22%);
}
.pack-shop-counter__sign {
  position: absolute;
  z-index: 3;
  top: 10px;
  left: 50%;
  min-width: min(540px, 78%);
  padding: 8px 20px;
  translate: -50% 0;
  border: 3px solid #e1a740;
  border-radius: 12px;
  color: #fff4ce;
  background: linear-gradient(#5d3118,#2f170d);
  box-shadow: 0 6px 10px #0007, inset 0 0 0 1px #ffd97966;
  text-align: center;
}
.pack-shop-counter__sign span { display:block; font:950 clamp(18px,3vw,30px)/1 Impact,'Arial Black',sans-serif; letter-spacing:.05em; }
.pack-shop-counter__sign small { color:#eacb8a; font-weight:800; }
.pack-art-showcase { position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(10px,2vw,24px); align-items:end; }
.pack-art-choice { position:relative; display:grid; gap:7px; justify-items:center; padding:8px 6px 14px; border:2px solid transparent; border-radius:15px; color:#fff3d0; background:transparent; cursor:pointer; transition:transform .17s ease,filter .17s ease,background .17s ease,border-color .17s ease; }
.pack-art-choice:hover { transform:translateY(-8px) rotate(-1deg); filter:brightness(1.08); background:#ffffff0b; }
.pack-art-choice.is-selected { border-color:#ffd15b; background:#ffd25b12; box-shadow:0 0 24px #ffc6413d; }
.pack-art-choice.is-selected::after { content:'SELECTED'; position:absolute; top:2px; right:2px; padding:4px 7px; border-radius:999px; color:#1d1730; background:#ffd25b; font-size:.57rem; font-weight:950; }
.pack-art-choice img { width:100%; max-width:220px; height:min(390px,36vw); object-fit:contain; filter:drop-shadow(0 14px 10px #0009); }
.pack-art-choice strong { font-size:.84rem; }
.pack-shop-counter__shelf { position:absolute; z-index:1; left:2%; right:2%; bottom:32px; height:19px; border-radius:4px; background:linear-gradient(#9a6132,#4c2815); box-shadow:0 8px 0 #2b160c,0 12px 20px #0009; }

/* ------------------------------------------------------------------ */
/* Egg Arcade                                                         */
/* ------------------------------------------------------------------ */
.mini-games-panel { background:linear-gradient(140deg,#fffaf0,#ffe2ad 55%,#ffc982); }
.mini-games-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:22px; }
.mini-games-heading > div:first-child { max-width:760px; }
.mini-games-summary { display:grid; min-width:230px; grid-template-columns:repeat(2,1fr); gap:10px; }
.mini-games-summary span { padding:12px; border:1px solid #c98b38; border-radius:14px; color:#6b461d; background:#fff9e4; font-size:.75rem; font-weight:850; text-align:center; }
.mini-games-summary strong { display:block; margin-top:3px; color:#b52738; font-size:1.7rem; }
.mini-game-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.mini-game-card { position:relative; min-height:390px; padding:18px; overflow:hidden; border:2px solid #ffffffa8; border-radius:22px; background:#fffaf0; box-shadow:0 12px 28px #74451426; }
.mini-game-card h3 { font-size:1.6rem; }
.mini-game-card p { min-height:76px; }
.mini-game-card__art { position:relative; height:170px; margin:-18px -18px 17px; overflow:hidden; background:radial-gradient(circle at 50% 30%,#fff1a5,#e98745 58%,#53301a 100%); }
.mini-game-card__art::before,.mini-game-card__art::after { content:''; position:absolute; border-radius:50%; }
.mini-egg-stack::before,.mini-egg-stack::after { content:''; position:absolute; bottom:28px; width:70px; height:92px; border:4px solid #34243d; border-radius:52% 52% 45% 45%/62% 62% 40% 40%; background:linear-gradient(145deg,#fff8d8,#e95c59); box-shadow:85px 8px 0 -4px #75d95c,170px -1px 0 -5px #75d9e7; translate:34px 0; }
.mini-egg-stack::after { width:18px;height:18px;bottom:112px;left:50%;border:0;background:#4b2f1d;box-shadow:-88px 14px 0 #4b2f1d,88px 7px 0 #4b2f1d; }
.mini-target-reticle { position:absolute; left:50%; top:50%; width:120px; height:120px; translate:-50% -50%; border:8px solid #f32f4c; border-radius:50%; box-shadow:0 0 0 6px #fff8,0 0 0 22px #f32f4c55; }
.mini-target-reticle::before,.mini-target-reticle::after { content:''; position:absolute; left:50%; top:-42px; width:7px; height:190px; translate:-50% 0; background:#f32f4c; }
.mini-target-reticle::after { rotate:90deg; }
.mini-runner { position:absolute; left:18%; bottom:24px; width:70px; height:92px; border-radius:45% 50% 40% 44%; background:#f6e7c7; box-shadow:inset -14px -9px #d6ba89; }
.mini-runner::before { content:''; position:absolute; right:-38px; top:15px; border:18px solid transparent; border-left:42px solid #f5a82f; }
.mini-runner::after { content:''; position:absolute; left:-15px; bottom:-22px; width:92px; height:8px; background:#2e2233; box-shadow:130px 0 0 #2e2233,245px -30px 0 #2e2233; }
.mini-spoon,.mini-crosshair { position:absolute; inset:0; }
.mini-spoon::before { content:''; position:absolute; left:50%; top:25px; width:28px; height:125px; translate:-50% 0; border-radius:50% 50% 8px 8px; background:linear-gradient(90deg,#8d9696,#eff4f4,#777); }
.mini-spoon::after { content:''; position:absolute; left:50%; top:30px; width:68px; height:85px; translate:-50% 0; border-radius:50%; background:#ffe5b6; box-shadow:inset -8px -8px #e1a467; }
.mini-crosshair::before { content:''; position:absolute; left:50%; top:50%; width:115px; height:115px; translate:-50% -50%; border:7px solid #28243d; border-radius:50%; box-shadow:0 0 0 5px #f45e64; }
.mini-crosshair::after { content:''; position:absolute; left:50%; top:15%; width:6px; height:120px; translate:-50% 0; background:#28243d; box-shadow:0 0 0 0 #28243d; }
.mini-game-card.is-coming { opacity:.82; filter:saturate(.7); }
.mini-game-stage { margin-top:18px; padding:20px; border:3px solid #392a48; border-radius:22px; background:#171626; color:#fff6dc; box-shadow:inset 0 0 50px #0007; }
.mini-game-stage header { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:14px; }
.mini-game-stage h3 { margin:0; color:#fff; font-size:2rem; }
.mini-scoreline { display:flex; gap:8px; flex-wrap:wrap; }
.mini-scoreline span { padding:7px 11px; border-radius:999px; color:#ded7ed; background:#ffffff12; font-weight:800; }
.mini-scoreline b { color:#ffd15a; }
.mini-game-message { min-height:1.5em; color:#d4cbdb; }
.egg-shy-board { position:relative; width:100%; aspect-ratio:1672/941; min-height:0; overflow:hidden; padding:0; border:5px solid #9d5c2d; border-radius:17px; background:url('../images/arcade/egg-shy-booth.png') center/100% 100% no-repeat; box-shadow:inset 0 0 0 3px #f3bd60; touch-action:none; cursor:crosshair; user-select:none; }
.egg-shy-target { position:absolute; left:var(--slot-x,50%); top:var(--slot-y,50%); width:clamp(30px,4.7vw,50px); aspect-ratio:3/4; translate:-50% -100%; display:grid; place-items:end center; padding:0; border:0; background:transparent; z-index:2; pointer-events:none; }
.egg-shy-target img { position:relative; z-index:2; width:84%; height:100%; object-fit:contain; object-position:center bottom; filter:drop-shadow(0 5px 4px #0008); animation:none; transition:rotate .12s ease,filter .12s ease,opacity .18s ease,scale .12s ease; }
.egg-shy-target:hover img { scale:1; }
.egg-shy-target.is-hit img { animation:eggShyHit .28s ease; }
.egg-shy-target.is-broken img { animation:none; opacity:.14; filter:grayscale(1); translate:0 10px; }
.egg-shy-target.is-grenade { width:clamp(34px,5.3vw,56px); aspect-ratio:1; }
.egg-shy-target.is-grenade img { width:100%; height:100%; }
.egg-shy-launcher { position:absolute; z-index:7; left:50%; top:91%; width:clamp(30px,4vw,48px); aspect-ratio:1; translate:-50% -50%; border:4px solid #5c351d; border-radius:50%; background:radial-gradient(circle at 36% 30%,#fff4cf 0 18%,#e8a859 42%,#7c421f 100%); box-shadow:0 5px 8px #0008,0 0 0 4px #f0c66b66; pointer-events:none; }
.egg-shy-launcher::after { content:''; position:absolute; inset:23%; border-radius:50%; background:#f8e6b0; box-shadow:inset -3px -3px #b97535; }
.egg-shy-aim-line { position:absolute; z-index:5; left:50%; top:91%; width:var(--aim-length,55%); height:3px; transform-origin:0 50%; transform:rotate(var(--aim-angle,-90deg)); border-top:3px dashed rgba(255,244,184,.9); filter:drop-shadow(0 1px 2px #000); opacity:.55; pointer-events:none; }
.egg-shy-board.is-aiming .egg-shy-aim-line { opacity:1; }
.egg-shy-aim-reticle { position:absolute; z-index:6; left:50%; top:28%; width:clamp(28px,4vw,46px); aspect-ratio:1; translate:-50% -50%; border:3px solid #ffdc62; border-radius:50%; box-shadow:0 0 0 3px #3b2418cc,0 0 12px #ffd54a; pointer-events:none; }
.egg-shy-aim-reticle::before,.egg-shy-aim-reticle::after { content:''; position:absolute; left:50%; top:-7px; width:2px; height:calc(100% + 14px); translate:-50% 0; background:#fff5b8; }
.egg-shy-aim-reticle::after { rotate:90deg; }
.egg-shy-power { position:absolute; z-index:8; left:50%; bottom:2.2%; width:min(330px,44%); height:24px; translate:-50% 0; overflow:hidden; border:3px solid #5e351d; border-radius:999px; background:#2b1a12dd; box-shadow:0 3px 8px #0008; pointer-events:none; }
.egg-shy-power__fill { position:absolute; inset:2px 2px 2px 2px; border-radius:999px; background:linear-gradient(90deg,#56d36e 0 45%,#ffd34f 62%,#ed554d 100%); transform:scaleX(var(--power,.5)); transform-origin:left center; transition:transform .025s linear; }
.egg-shy-power b { position:absolute; inset:0; display:grid; place-items:center; color:#fff8d8; font-size:.66rem; letter-spacing:.12em; text-shadow:0 1px 3px #000; }
.egg-shy-projectile { position:absolute; left:0; top:0; width:28px; height:38px; border-radius:50% 50% 45% 45%/60% 60% 40% 40%; background:linear-gradient(145deg,#fff5d9,#e4a968); box-shadow:0 4px 8px rgba(0,0,0,.34); translate:-50% -50%; pointer-events:none; z-index:9; }
.egg-shy-projectile::after { content:''; position:absolute; inset:4px 5px auto auto; width:8px; height:10px; border-radius:50%; background:rgba(255,255,255,.45); }
.egg-shy-target__impact { position:absolute; left:50%; top:52%; width:20px; height:20px; translate:-50% -50%; border-radius:50%; background:radial-gradient(circle,#fff9d1 0 26%,#ffd66f 27% 48%,rgba(255,185,76,.16) 49% 100%); box-shadow:0 0 0 0 rgba(255,226,132,.0); opacity:0; pointer-events:none; z-index:6; }
.egg-shy-target__blast { position:absolute; left:50%; top:50%; width:36px; height:36px; translate:-50% -50%; border-radius:50%; background:radial-gradient(circle,#ffe07a 0 30%,#ff8a2a 31% 62%,rgba(255,120,0,.08) 63% 100%); box-shadow:0 0 0 12px rgba(255,153,0,.18), 0 0 34px rgba(255,153,0,.44); opacity:0; pointer-events:none; z-index:7; }
.egg-shy-target.is-hit .egg-shy-target__impact { animation:eggImpact .32s ease-out; }
.egg-shy-target.is-exploding .egg-shy-target__blast { animation:eggBlast .45s ease-out; }
@keyframes eggShyHit{18%{rotate:-16deg;translate:-8px -6px;scale:1.06}55%{rotate:14deg;translate:8px -4px;scale:.96}100%{rotate:0deg;translate:0 0;scale:1}}
@keyframes eggImpact{0%{opacity:0;scale:.35;box-shadow:0 0 0 0 rgba(255,226,132,0)}25%{opacity:1;scale:1;box-shadow:0 0 0 10px rgba(255,226,132,.22)}100%{opacity:0;scale:1.6;box-shadow:0 0 0 18px rgba(255,226,132,0)}}
@keyframes eggBlast{0%{opacity:1;scale:.4}70%{opacity:.92;scale:1.3}100%{opacity:0;scale:1.7}}
.egg-target-range { position:relative; width:100%; aspect-ratio:3/2; min-height:0; overflow:hidden; border:5px solid #a26132; border-radius:18px; background:#201208; box-shadow:inset 0 0 0 3px #f7c665; isolation:isolate; }
.egg-target-range__layer,.egg-target-range__row{ position:absolute; inset:0; width:100%; height:100%; }
.egg-target-range__layer{ object-fit:cover; pointer-events:none; user-select:none; }
.egg-target-range__layer--back{ z-index:1; }
.egg-target-range__row--top{ z-index:2; }
.egg-target-range__layer--top{ z-index:3; }
.egg-target-range__row--middle{ z-index:4; }
.egg-target-range__layer--middle{ z-index:5; }
.egg-target-range__row--bottom{ z-index:6; }
.egg-target-range__layer--front{ z-index:7; }
.egg-target {
  position:absolute;
  left:var(--target-x,50%);
  top:var(--target-y,50%);
  width:calc(var(--target-width,5.5%) * 2.15);
  height:28%;
  transform:translate(-50%,-82%);
  transform-origin:50% 100%;
  display:grid;
  place-items:end center;
  padding:0;
  border:0;
  background:transparent;
  cursor:crosshair;
  opacity:1;
  touch-action:none;
  transition:transform .22s cubic-bezier(.2,.9,.25,1.18),opacity .12s ease;
}
.egg-target:hover{scale:1.02}
.egg-target img{width:60%;height:69%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 6px 5px #0008);pointer-events:none}
.egg-target__impact{position:absolute;left:50%;top:42%;width:18px;height:18px;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,#fff7c5 0 30%,#ffd163 31% 52%,rgba(255,168,61,.15) 53% 100%);box-shadow:0 0 0 0 rgba(255,214,105,0);opacity:0;pointer-events:none}
.egg-target.is-hit img{animation:targetEggBonk .24s ease}
.egg-target.is-hit .egg-target__impact{animation:targetEggImpact .28s ease-out}
.egg-target.is-grenade:not(.is-hidden){transform:translate(-50%,-108%)}
.egg-target.is-grenade img{width:70%;height:66%;object-position:center bottom}
@keyframes targetEggBonk{18%{translate:0 -4px;scale:1.08}58%{translate:0 1px;scale:.95}100%{translate:0 0;scale:1}}
@keyframes targetEggImpact{0%{opacity:0;scale:.3;box-shadow:0 0 0 0 rgba(255,214,105,0)}18%{opacity:1;scale:1;box-shadow:0 0 0 8px rgba(255,214,105,.22)}100%{opacity:0;scale:1.5;box-shadow:0 0 0 16px rgba(255,214,105,0)}}
.egg-target.is-hidden{
  transform:translate(-50%,12%);
  opacity:0;
  pointer-events:none;
}
.chicken-run-canvas { display:block; width:100%; height:auto; max-height:360px; border:5px solid #9a5b2d; border-radius:17px; background:#9bd1ea; box-shadow:inset 0 0 0 3px #f3bd60; touch-action:manipulation; }
.chicken-hunt-stage { position:relative; width:100%; aspect-ratio:1672/941; overflow:hidden; border:5px solid #6a411f; border-radius:18px; background:url('../images/arcade/chicken-hunt-bg.png') center/cover no-repeat; box-shadow:inset 0 0 0 3px #e8c466; isolation:isolate; }
.chicken-hunt-stage.is-active { cursor:crosshair; }
.chicken-hunt-prop { position:absolute; pointer-events:none; user-select:none; }
.chicken-hunt-prop img { display:block; width:100%; height:100%; object-fit:contain; object-position:center bottom; }
.chicken-hunt-target { position:absolute; bottom:var(--hunt-hidden-bottom,20%); width:clamp(46px,5.2vw,78px); aspect-ratio:4/5; translate:-50% 68%; opacity:0; visibility:hidden; border:0; background:transparent; cursor:crosshair; pointer-events:none; transition:bottom .22s cubic-bezier(.2,.82,.28,1.08),translate .22s cubic-bezier(.2,.82,.28,1.08),opacity .16s ease; padding:0; }
.chicken-hunt-target.is-up { bottom:var(--hunt-up-bottom,31%); translate:-50% 0; opacity:1; visibility:visible; pointer-events:auto; }
.chicken-hunt-target.is-hit { bottom:var(--hunt-hidden-bottom,20%); opacity:0; visibility:visible; translate:-50% 88%; pointer-events:none; }
.chicken-hunt-target__art { position:absolute; inset:-10%; width:120%; height:120%; object-fit:contain; object-position:center bottom; opacity:0; filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 3px #fff) drop-shadow(0 8px 7px rgba(0,0,0,.34)); pointer-events:none; transition:opacity .12s ease; }
.chicken-hunt-target.has-art .chicken-hunt-target__art { opacity:1; }
.chicken-hunt-target.has-art .chicken-hunt-target__sticker { opacity:0; }
.chicken-hunt-target.is-depth-back { width:clamp(38px,4.2vw,60px); }
.chicken-hunt-target.is-depth-middle { width:clamp(44px,4.8vw,70px); }
.chicken-hunt-target.is-depth-front { width:clamp(50px,5.5vw,82px); }
.chicken-hunt-target__sticker { position:relative; width:100%; height:100%; filter:drop-shadow(0 0 4px #fff) drop-shadow(0 0 4px #fff) drop-shadow(0 7px 8px rgba(0,0,0,.3)); }
.chicken-hunt-target__body { position:absolute; left:13%; top:26%; width:62%; height:47%; border-radius:48% 52% 44% 48%; background:#f6f1e6; border:3px solid #222; box-shadow:inset -8px -8px rgba(215,200,161,.66); }
.chicken-hunt-target__head { position:absolute; right:8%; top:12%; width:32%; height:28%; border-radius:50%; background:#f6f1e6; border:3px solid #222; }
.chicken-hunt-target__beak { position:absolute; right:-1%; top:23%; width:20%; height:12%; background:#f1ab2a; clip-path:polygon(0 0,100% 50%,0 100%); border:2px solid #222; border-left:0; }
.chicken-hunt-target__comb { position:absolute; right:19%; top:2%; width:20%; height:14%; background:#da4134; clip-path:polygon(10% 100%,0 52%,18% 16%,42% 42%,56% 0,76% 36%,100% 100%); }
.chicken-hunt-target__eye { position:absolute; right:20%; top:22%; width:5px; height:5px; border-radius:50%; background:#111; }
.chicken-hunt-target__leg, .chicken-hunt-target__leg::after { position:absolute; width:4px; height:18%; background:#e39e28; border-radius:4px; content:''; }
.chicken-hunt-target__leg { left:30%; bottom:10%; }
.chicken-hunt-target__leg::after { left:22px; top:0; }
.cluckman-canvas { display:block; width:100%; max-width:720px; margin-inline:auto; height:auto; aspect-ratio:1/1; border:5px solid #7f5630; border-radius:18px; background:#0d120b; box-shadow:inset 0 0 0 3px #cda85d; touch-action:none; }
.cluckman-controls { display:grid; justify-content:center; gap:8px; margin:14px 0 6px; user-select:none; }
.cluckman-controls__row { display:flex; justify-content:center; gap:8px; }
.cluckman-controls .button { min-width:58px; min-height:52px; padding:10px 16px; font-size:1.15rem; touch-action:manipulation; }
.hook-a-cluck-board {
  position:relative;
  width:100%;
  aspect-ratio:3/2;
  overflow:hidden;
  border:5px solid #8a5329;
  border-radius:18px;
  background:#d9c19a url('../images/arcade/hook-a-cluck/booth.png') center/100% 100% no-repeat;
  box-shadow:inset 0 0 0 3px #e2ba65;
  isolation:isolate;
  touch-action:none;
}
.hook-a-cluck-board::before {
  content:'';
  position:absolute;
  z-index:5;
  inset:0;
  pointer-events:none;
  background:url('../images/arcade/hook-a-cluck/booth-foreground.png') center/100% 100% no-repeat;
}
.hook-a-cluck-board::after {
  content:'';
  position:absolute;
  z-index:2;
  left:13%;
  right:11%;
  top:57.5%;
  bottom:29%;
  pointer-events:none;
  background:linear-gradient(105deg,transparent 0 35%,rgba(255,255,255,.14) 43%,transparent 51% 73%,rgba(255,224,130,.12) 80%,transparent 88%);
  background-size:180% 100%;
  mix-blend-mode:screen;
  opacity:.55;
  animation:hookWaterShimmer 4.2s linear infinite;
}
@keyframes hookWaterShimmer { from{background-position:120% 0} to{background-position:-80% 0} }
.hook-a-cluck__water { position:absolute; z-index:4; inset:57% 11% 28% 13%; overflow:hidden; border-radius:4px 4px 24px 24px; background:transparent; box-shadow:none; pointer-events:none; }
.hook-a-cluck__rail {
  position:absolute;
  z-index:3;
  left:15%;
  right:15%;
  top:33%;
  height:8px;
  border-radius:999px;
  background:linear-gradient(#6c4a2c,#2c1c11);
  box-shadow:0 2px 0 #d9b271,0 5px 8px #0006;
}
.hook-a-cluck__cursor { position:absolute; z-index:6; left:50%; top:30.5%; translate:-50% 0; font-size:21px; color:#fff2c0; text-shadow:0 2px 6px #000; pointer-events:none; }
.hook-a-cluck__rig { position:absolute; z-index:7; top:33%; left:50%; width:48px; height:36%; translate:-50% 0; pointer-events:none; }
.hook-a-cluck__rope { position:absolute; left:22px; top:0; width:5px; height:var(--drop,34px); border-radius:999px; background:linear-gradient(90deg,#24170d,#d8c79d 48%,#3b2818); box-shadow:1px 0 2px #0007; transition:height .41s cubic-bezier(.2,.7,.3,1); }
.hook-a-cluck__hook { position:absolute; left:7px; top:calc(var(--drop,34px) - 5px); width:34px; height:40px; color:transparent; font-size:0; border:6px solid #deded5; border-top-color:transparent; border-left-color:transparent; border-radius:50%; filter:drop-shadow(0 2px 2px #0008); transform:rotate(16deg); transform-origin:50% 0; transition:top .41s cubic-bezier(.2,.7,.3,1); box-sizing:border-box; }
.hook-a-cluck__hook::before { content:''; position:absolute; left:16px; top:-18px; width:6px; height:21px; border-radius:999px; background:linear-gradient(90deg,#8c8c86,#f6f6ef 48%,#85857f); box-shadow:0 1px 2px #0008; }
.hook-a-cluck__hook::after { content:''; position:absolute; left:-2px; bottom:4px; width:14px; height:6px; border-radius:999px; background:linear-gradient(#f1f1ea,#8f8f89); transform:rotate(-30deg); transform-origin:right center; }
.hook-a-cluck__target {
  position:absolute;
  z-index:4;
  width:clamp(28px,4.2vw,54px);
  aspect-ratio:514/910;
  translate:-50% -50%;
  pointer-events:none;
  transform-origin:50% 70%;
  will-change:left,top,transform;
}
.hook-a-cluck__target::after {
  content:'';
  position:absolute;
  z-index:-1;
  left:50%;
  bottom:2%;
  width:130%;
  height:16%;
  translate:-50% 30%;
  border:2px solid rgba(220,245,255,.52);
  border-radius:50%;
  box-shadow:0 0 0 3px rgba(110,206,235,.12);
}
.hook-a-cluck__target img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  transform:scaleX(var(--hook-flip,1));
  filter:drop-shadow(0 5px 4px rgba(0,0,0,.34));
}
.hook-a-cluck__target.is-gold { width:clamp(31px,4.5vw,58px); }
.hook-a-cluck__target.is-gold img { filter:drop-shadow(0 0 7px #ffe352) drop-shadow(0 5px 4px rgba(0,0,0,.34)); }
.hook-a-cluck__target.is-grenade { width:clamp(25px,3.5vw,46px); aspect-ratio:510/656; }
.hook-a-cluck__target.is-grenade::after { opacity:.45; }
.hook-a-cluck__target.is-caught {
  animation:hookCaughtLift .5s ease both;
}
@keyframes hookCaughtLift {
  0% { opacity:1; scale:1; }
  55% { opacity:1; scale:1.14; }
  100% { opacity:0; translate:-50% -110%; scale:.7; }
}


/* ------------------------------------------------------------------ */
/* Temporary illustrated local market                                 */
/* ------------------------------------------------------------------ */
.market-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(330px,.7fr); align-items:stretch; gap:28px; }
.market-controls { min-width:0; }
.market-stall { position:relative; min-height:360px; overflow:hidden; border:5px solid #5a321b; border-radius:22px; background:linear-gradient(#aee4f0 0 35%,#f2ce83 35%); box-shadow:inset 0 0 0 3px #d99f45,0 15px 30px #6a381b2e; }
.market-stall__awning { position:absolute; inset:0 0 auto; height:78px; background:repeating-linear-gradient(90deg,#f4e7c4 0 42px,#c94b46 42px 84px); clip-path:polygon(0 0,100% 0,100% 74%,96% 100%,92% 74%,88% 100%,84% 74%,80% 100%,76% 74%,72% 100%,68% 74%,64% 100%,60% 74%,56% 100%,52% 74%,48% 100%,44% 74%,40% 100%,36% 74%,32% 100%,28% 74%,24% 100%,20% 74%,16% 100%,12% 74%,8% 100%,4% 74%,0 100%); }
.market-stall__sign { position:absolute; z-index:3; top:62px; left:50%; width:72%; padding:8px; translate:-50% 0; border:3px solid #e9b751; color:#fff2c4; background:#4a2715; box-shadow:0 6px 8px #0005; font:950 21px/1 Impact,'Arial Black',sans-serif; letter-spacing:.06em; text-align:center; }
.market-stall__vendor { position:absolute; z-index:2; left:50%; bottom:78px; width:54%; max-height:230px; translate:-50% 0; object-fit:contain; filter:drop-shadow(0 8px 5px #0006); }
.market-stall__counter { position:absolute; z-index:4; left:0; right:0; bottom:32px; height:74px; display:flex; align-items:center; justify-content:center; gap:13px; border-top:8px solid #3f2112; background:linear-gradient(#8b532d,#4f2a17); }
.market-egg { width:39px; height:49px; border:2px solid #322039; border-radius:50% 50% 45% 45%/62% 62% 40% 40%; background:linear-gradient(145deg,#fff6dc,#e7a562); box-shadow:inset 6px 6px #fff8; rotate:-8deg; }.market-egg--gold{background:linear-gradient(145deg,#fff9a8,#f3bd16 70%,#b57700);rotate:8deg}.market-stall small{position:absolute;left:10px;right:10px;bottom:7px;color:#f8e7c9;font-size:.65rem;text-align:center}

@media(max-width:1000px){
  .pack-art-showcase{grid-template-columns:repeat(2,1fr)}.pack-art-choice img{height:min(370px,58vw)}
  .mini-game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.market-layout{grid-template-columns:1fr}.market-stall{min-height:330px}
}
@media(max-width:650px){
  .pack-shop-counter{padding-top:76px}.pack-art-showcase{grid-template-columns:1fr 1fr;gap:4px}.pack-art-choice img{height:240px}.pack-art-choice strong{font-size:.68rem}
  .mini-games-heading{flex-direction:column}.mini-games-summary{width:100%}.mini-game-grid{grid-template-columns:1fr}.mini-game-card{min-height:340px}.mini-game-stage header{align-items:flex-start;flex-direction:column}.market-stall{min-height:300px}
}
.claw-machine__cabinet { --claw-drop: 47%; }
@keyframes claw-grab {
  0% { translate: -50% 0; }
  18% { translate: calc(-50% + var(--claw-x)) 0; }
  48% { translate: calc(-50% + var(--claw-x)) var(--claw-drop); }
  66% { translate: calc(-50% + var(--claw-x)) var(--claw-drop); }
  90%, 100% { translate: calc(-50% + var(--claw-x)) 0; }
}


/* pass 16 visual upgrades */
.pack-art-choice--sticker { cursor:default; }
.pack-art-choice--sticker:hover { transform:none; filter:none; background:transparent; }
.holo-strip { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:18px 0 8px; padding:14px 16px; border:2px solid #e7c06f; border-radius:18px; background:linear-gradient(135deg,#20162d,#52305f 44%,#1e1e3a); color:#fff9dd; overflow:hidden; position:relative; }
.holo-strip strong { display:block; margin-bottom:3px; }
.holo-strip span { color:#eadfcf; font-size:.9rem; }
.holo-strip__swatches { display:flex; gap:10px; flex-wrap:wrap; }
.holo-strip__swatches img { width:84px; height:84px; object-fit:cover; border:2px solid #fff5c966; border-radius:14px; background:#fff2; box-shadow:0 8px 18px #0005; }
[data-random-sticker-zone] { position:relative; }
.random-sticker-decor__sticker { position:absolute; z-index:4; right:14px; bottom:10px; width:68px !important; height:68px !important; max-width:68px !important; max-height:68px !important; object-fit:contain !important; pointer-events:none; transform:rotate(var(--sticker-rotate,0deg)) translateY(var(--sticker-y,0)); filter:drop-shadow(0 6px 10px #0004); }
.random-sticker-decor__sticker:nth-of-type(2) { right:78px; bottom:8px; }
.random-sticker-decor__sticker:nth-of-type(3) { right:142px; bottom:12px; }
.mini-game-card__art { display:grid; place-items:center; height:auto; aspect-ratio:16/9; margin:-10px -10px 16px; overflow:visible; padding:0; background:transparent; }
.mini-game-card__art img { width:100%; height:100%; object-fit:contain; object-position:center center; display:block; }
.market-stall { display:grid; place-items:center; background:linear-gradient(#ecdab2,#a96f3f); }
.market-stall__art { width:100%; height:100%; object-fit:contain; padding:18px; }
.sticker-pack-freebie { display:grid; gap:6px; margin:10px 0 8px; padding:12px 14px; border:1px solid rgba(88,54,28,.18); border-radius:16px; background:#fff8ea; }
.sticker-pack-freebie strong { color:#7b3d18; }
.sticker-inventory__foot { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; }
.sticker-inventory__foot .button[hidden] { display:none; }
.claw-machine__cabinet { background:url('../images/claw/claw-booth.png') center/cover no-repeat; }
.claw-machine__cabinet::after { box-shadow: calc(100% + 690px) 0 rgba(248,213,111,.6), 0 40px 0 -3px rgba(248,213,111,.65), calc(100% + 690px) 40px 0 -3px rgba(248,213,111,.65); }
.claw-machine__cabinet::before { display:none; }
.claw-machine__cabinet > .claw-machine__rail { top:23%; left:11%; right:11%; }
.claw-machine__nest-back,
.claw-machine__nest-front { bottom:-26%; }

.holo-workshop {
  display:grid;
  grid-template-columns:minmax(300px, 1.1fr) minmax(240px, .9fr);
  gap:24px;
  margin:20px 0 10px;
  padding:20px;
  border:2px solid #e7c06f;
  border-radius:22px;
  background:linear-gradient(135deg,#1e1931,#3d274b 44%,#171a33);
  color:#fff9dd;
}
.holo-workshop__copy label { display:block; margin-top:12px; color:#eadfcf; font-weight:800; }
.holo-workshop__copy select { width:100%; margin-top:6px; }
.holo-workshop__preview-zone { display:grid; gap:14px; align-content:start; }
.holo-card-preview {
  min-height:290px;
  display:grid;
  place-items:center;
  padding:16px;
  border-radius:20px;
  background:radial-gradient(circle at 50% 0, rgba(255,255,255,.18), transparent 42%), rgba(255,255,255,.05);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.holo-card-preview .collection-card__visual { width:min(210px, 100%); margin-inline:auto; }
.holo-card-preview .holo-card,
.collection-card-dialog__visual .holo-card { width:min(210px, 100%); }
.holo-card-preview .holo-card > img:first-child,
.collection-card-dialog__visual .holo-card > img:first-child { width:100%; height:auto; }
.holo-applied-list { display:grid; gap:8px; }
.holo-applied-list small {
  display:block;
  padding:8px 10px;
  border-radius:12px;
  color:#f2e8d0;
  background:rgba(255,255,255,.06);
}
.holo-applied-list small.is-applied {
  color:#efffd8;
  background:rgba(104, 190, 92, .16);
  box-shadow:inset 0 0 0 1px rgba(167, 236, 132, .22);
}
@media(max-width:900px){ .holo-workshop{grid-template-columns:1fr} }
@media(max-width:650px){ .holo-strip{flex-direction:column;align-items:flex-start}.holo-strip__swatches img{width:72px;height:72px}.holo-workshop{padding:16px} }


/* 2026-08-08 pass: maximise sticker artwork in fullscreen.
   Important: the page image and sticker overlay must use the exact same art box.
   Do not independently cap/resize the <img>, otherwise zoom makes stickers drift. */
.sticker-book-viewer:fullscreen,
.sticker-book-viewer.is-fullscreen-fallback {
  padding: 2px !important;
  gap: 2px !important;
  border-width: 1px !important;
  border-radius: 4px !important;
  background: #160f12 !important;
  grid-template-columns: 44px minmax(0,1fr) 44px !important;
}
.sticker-book-viewer:fullscreen .sticker-book-spread,
.sticker-book-viewer.is-fullscreen-fallback .sticker-book-spread { margin:0 !important; }
.sticker-book-viewer:fullscreen .sticker-book-art > img,
.sticker-book-viewer.is-fullscreen-fallback .sticker-book-art > img {
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
}


/* Daily Coop Board */
.daily-coop-board{margin:0 0 22px;padding:18px;border:3px solid #70451f;border-radius:20px;background:linear-gradient(145deg,#7d4a25,#4a2918);box-shadow:inset 0 0 0 2px #d69a4b,0 12px 25px #5e351c35;color:#fff3d4}
.daily-coop-board__head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px}.daily-coop-board__head h3{margin:.1rem 0 0;font-size:1.7rem;color:white}.daily-coop-board__head strong{padding:8px 12px;border-radius:999px;background:#2b180f;color:#ffd879}
.daily-task-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.daily-task{position:relative;min-height:118px;padding:13px;border:2px solid #c99456;border-radius:14px;background:#fff5dc;color:#51321c;box-shadow:0 4px 10px #0002}.daily-task strong{display:block;margin-bottom:5px;color:#5d2419}.daily-task small{display:block;color:#77533a}.daily-task__reward{margin-top:10px;font-weight:900;color:#a62d27}.daily-task.is-complete{background:#e6f5c9;border-color:#78a33f}.daily-task.is-complete::after{content:'CLUCKED!';position:absolute;right:7px;top:8px;rotate:-9deg;padding:3px 6px;border:2px solid #b92f2f;border-radius:4px;color:#b92f2f;font:900 12px/1 Impact,'Arial Black',sans-serif;letter-spacing:.06em}.daily-task-note{margin:12px 2px 0;color:#f5d6a5;font-size:.82rem}
@media(max-width:1100px){.daily-task-list{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:720px){.daily-task-list{grid-template-columns:1fr 1fr}.daily-coop-board__head{align-items:flex-start;flex-direction:column}}@media(max-width:480px){.daily-task-list{grid-template-columns:1fr}}

/* Daily arcade Nest Claw ticket milestones */
.mini-game-ticket-tiers{margin-top:auto;padding:9px 10px;border:1px solid rgba(210,145,45,.42);border-radius:12px;background:rgba(255,244,208,.72);display:grid;gap:3px;color:#5e3716;font-size:.78rem}
.mini-game-ticket-tiers strong{font-size:.76rem;line-height:1.35}
.mini-game-ticket-tiers small{font-weight:800;color:#9d561e}
.mini-game-ticket-tiers small[data-claimed="3"]{color:#3a7a30}

/* ------------------------------------------------------------------ */
/* Final arcade + collection polish                                   */
/* ------------------------------------------------------------------ */

/* Collection header visual identifier. It changes with the active tab. */
.collection-context-art {
  position: relative;
  flex: 0 1 260px;
  width: min(25vw, 260px);
  min-width: 150px;
  height: 155px;
  display: grid;
  place-items: center;
  align-self: center;
  overflow: visible;
  pointer-events: none;
}
.collection-context-art > img {
  display: block;
  max-width: 100%;
  max-height: 150px;
  object-fit: contain;
  filter: drop-shadow(0 10px 13px rgba(71,38,14,.22));
  animation: collectionContextIn .28s ease both;
}
.collection-context-art[data-tab="claw-machine"] > img { max-height: 135px; }
.collection-context-art[data-tab="sticker-book"] > img { max-height: 145px; }
.collection-context-art[data-tab="packs"] > img { max-height: 150px; }
.collection-context-art.is-card-stack > img.context-card {
  position: absolute;
  left: 50%; top: 50%;
  width: 88px; max-height: 138px;
  border-radius: 8px;
  transform-origin: 50% 90%;
}
.collection-context-art.is-card-stack .context-card--1 { transform: translate(-72%,-50%) rotate(-11deg); }
.collection-context-art.is-card-stack .context-card--2 { transform: translate(-50%,-54%) rotate(0deg); z-index:2; }
.collection-context-art.is-card-stack .context-card--3 { transform: translate(-28%,-50%) rotate(11deg); }
.collection-context-art.is-card-stack.is-deck::after {
  content:''; position:absolute; left:50%; bottom:4px; width:155px; height:28px;
  translate:-50% 0; border-radius:50%; background:radial-gradient(ellipse,rgba(91,49,23,.22),transparent 72%);
}
@keyframes collectionContextIn { from { opacity:0; transform:translateY(7px) scale(.94); } to { opacity:1; transform:none; } }

/* Precision controls for a selected album/scrapbook sticker. */
.sticker-book-nudge { display:inline-grid; grid-template-columns:repeat(4, 32px); gap:4px; margin-left:2px; }
.sticker-book-nudge .sticker-book-fullscreen { min-width:32px; padding-inline:7px; font-size:1rem; }

/* Hunt hit feedback and killed-target state. */
.chicken-hunt-target.is-eliminated { opacity:0 !important; pointer-events:none !important; }
.chicken-hunt-hit-fx {
  position:absolute; z-index:30; width:150px; height:105px; translate:-50% -50%; pointer-events:none;
  display:grid; place-items:center; animation:huntHitFx .72s ease-out both;
}
.chicken-hunt-hit-fx img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.chicken-hunt-hit-fx b { position:relative; z-index:2; margin-top:-12px; color:#fff6a6; font-size:1.15rem; text-shadow:0 2px 2px #6b2100,0 0 8px #ff8a25; }
@keyframes huntHitFx { 0%{opacity:0;scale:.45} 20%{opacity:1;scale:1.08} 68%{opacity:1;translate:-50% -68%;scale:1} 100%{opacity:0;translate:-50% -88%;scale:.88} }

/* Hook-a-Cluck: larger internal playfield so tall rubber chickens keep their loops,
   but tighter left/right limits prevent targets crossing through booth walls. */
.hook-a-cluck__water {
  inset:48.5% 14.5% 27% 15.5%;
  border-radius:8px 8px 24px 24px;
  overflow:hidden;
}
.hook-a-cluck__rig { top:32.5%; width:56px; height:42%; }
.hook-a-cluck__rope { left:26px; width:5px; height:var(--drop,24px); }
.hook-a-cluck__hook {
  position:absolute; left:7px; top:calc(var(--drop,24px) - 3px);
  width:43px; height:128px; object-fit:contain; object-position:center top;
  filter:drop-shadow(0 3px 3px rgba(0,0,0,.6));
  transform:none; transition:top .4s cubic-bezier(.2,.7,.3,1);
}
.hook-a-cluck__hook::before,.hook-a-cluck__hook::after { content:none !important; }
.hook-a-cluck__target {
  width:clamp(34px,4.7vw,66px);
  height:clamp(78px,8.8vw,124px);
  aspect-ratio:auto;
  translate:-50% -50%;
}
.hook-a-cluck__target img { width:100%; height:100%; object-fit:contain; object-position:center; }
.hook-a-cluck__target.is-gold { width:clamp(35px,4.9vw,69px); height:clamp(80px,9vw,128px); }
.hook-a-cluck__target.is-goldenEgg { width:clamp(32px,4.2vw,58px); height:clamp(58px,6.5vw,90px); }
.hook-a-cluck__target.is-goldenEgg img { filter:drop-shadow(0 0 9px #ffe75c) drop-shadow(0 5px 4px rgba(0,0,0,.36)); }
.hook-a-cluck__target.is-grenade { width:clamp(27px,3.7vw,49px); height:clamp(45px,5.2vw,72px); aspect-ratio:auto; }
.hook-a-cluck__target::after { bottom:7%; width:118%; height:12%; }
.hook-a-cluck__feedback {
  position:absolute; z-index:20; width:110px; height:90px; translate:-50% -50%; pointer-events:none;
  display:grid; place-items:center; animation:hookFeedback .85s ease-out both;
}
.hook-a-cluck__feedback b { position:relative; z-index:4; color:#dffff0; font-size:1.35rem; font-weight:950; text-shadow:0 2px 3px #102519,0 0 8px #34e081; }
.hook-a-cluck__feedback.is-gold b { color:#fff09a; text-shadow:0 2px 3px #5e3500,0 0 10px #ffc400; }
.hook-a-cluck__feedback.is-boom b { color:#fff; font-size:1.45rem; text-shadow:0 2px 3px #401000,0 0 11px #ff4a16; }
.hook-a-cluck__feedback.is-boom img { position:absolute; inset:-24%; width:148%; height:148%; object-fit:contain; }
.hook-a-cluck__feedback.is-boom i { position:absolute; width:80px; height:80px; border-radius:50%; background:radial-gradient(circle,#fff7ab 0 13%,#ffbc24 14% 31%,#f34c18 32% 52%,transparent 53%); box-shadow:0 0 25px #ff7a18; }
@keyframes hookFeedback { 0%{opacity:0;scale:.45} 18%{opacity:1;scale:1.12} 70%{opacity:1;translate:-50% -75%} 100%{opacity:0;translate:-50% -110%;scale:.88} }

/* Fullscreen mini-games retain the HUD and controls rather than fullscreening only a canvas. */
.mini-game-stage:fullscreen,
.mini-game-stage.is-pseudo-fullscreen {
  margin:0 !important; padding:12px 16px !important; width:100vw; height:100vh; max-width:none;
  border:0; border-radius:0; background:#12111f; overflow:auto;
  display:grid !important; grid-template-rows:auto minmax(0,1fr) auto; gap:8px; box-sizing:border-box;
}
.mini-game-stage.is-pseudo-fullscreen { position:fixed; inset:0; z-index:15000; }
body.has-mini-game-pseudo-fullscreen { overflow:hidden; }
.mini-game-stage:fullscreen header,
.mini-game-stage.is-pseudo-fullscreen header { margin:0; padding:2px 4px; align-items:center; }
.mini-game-stage:fullscreen .mini-game-message,
.mini-game-stage.is-pseudo-fullscreen .mini-game-message { margin:.2rem 0 0; }
.mini-game-stage:fullscreen .button-row,
.mini-game-stage.is-pseudo-fullscreen .button-row { margin:0; justify-content:center; align-self:end; }
.mini-game-stage:fullscreen .egg-shy-board,
.mini-game-stage:fullscreen .egg-target-range,
.mini-game-stage:fullscreen .chicken-hunt-stage,
.mini-game-stage:fullscreen .hook-a-cluck-board,
.mini-game-stage.is-pseudo-fullscreen .egg-shy-board,
.mini-game-stage.is-pseudo-fullscreen .egg-target-range,
.mini-game-stage.is-pseudo-fullscreen .chicken-hunt-stage,
.mini-game-stage.is-pseudo-fullscreen .hook-a-cluck-board {
  width:min(100%, calc((100vh - 168px) * 1.7778)); max-height:calc(100vh - 168px); margin:auto; align-self:center;
}
.mini-game-stage[data-mini-game="target-range"]:fullscreen .egg-target-range,
.mini-game-stage[data-mini-game="hook-a-cluck"]:fullscreen .hook-a-cluck-board,
.mini-game-stage[data-mini-game="target-range"].is-pseudo-fullscreen .egg-target-range,
.mini-game-stage[data-mini-game="hook-a-cluck"].is-pseudo-fullscreen .hook-a-cluck-board { width:min(100%, calc((100vh - 168px) * 1.5)); }
.mini-game-stage:fullscreen .chicken-run-canvas,
.mini-game-stage.is-pseudo-fullscreen .chicken-run-canvas { width:min(100%, calc((100vh - 168px) * 3)); max-height:calc(100vh - 168px); margin:auto; align-self:center; }
.mini-game-stage:fullscreen .cluckman-canvas,
.mini-game-stage.is-pseudo-fullscreen .cluckman-canvas { width:min(78vh, 86vw); max-width:none; max-height:calc(100vh - 230px); align-self:center; }
.mini-game-stage:fullscreen .cluckman-controls,
.mini-game-stage.is-pseudo-fullscreen .cluckman-controls { position:absolute; right:18px; bottom:78px; opacity:.94; }

@media (max-width: 760px) {
  .collection-context-art { width:150px; height:105px; min-width:120px; align-self:flex-start; }
  .collection-context-art > img { max-height:105px; }
  .page-intro .collection-context-art { order:2; }
  .page-intro .pack-chip { order:3; }
  .sticker-book-nudge { grid-template-columns:repeat(4, 30px); }
  .mini-game-stage:fullscreen,.mini-game-stage.is-pseudo-fullscreen { padding:8px; }
  .mini-game-stage:fullscreen h3,.mini-game-stage.is-pseudo-fullscreen h3 { font-size:1.25rem; }
  .mini-game-stage:fullscreen .mini-game-message,.mini-game-stage.is-pseudo-fullscreen .mini-game-message { font-size:.8rem; }
}
.hook-a-cluck__hook { border:0 !important; border-radius:0 !important; background:none !important; box-sizing:content-box !important; }
.collection-context-art.is-card-stack.is-deck::before {
  content:''; position:absolute; left:50%; top:52%; width:190px; height:108px; translate:-50% -50%;
  border-radius:14px; background:linear-gradient(145deg,#253d2b,#16251b); border:4px solid #9b6c32;
  box-shadow:inset 0 0 0 2px #d5aa5b55,0 9px 16px rgba(66,35,16,.22); transform:rotate(-3deg);
}
.egg-target:not(.is-hidden) { cursor:pointer; }

/* 2026-08-09 final tidy pass — clearer collection context art. */
.collection-context-art.is-card-stack { position:relative; min-width:235px; }
.collection-context-art.is-card-stack > img.context-card {
  width:92px; max-height:142px;
  box-shadow:0 10px 20px rgba(59,32,16,.16);
}
.collection-context-art.is-card-stack .context-card--1 { transform:translate(-88%,-48%) rotate(-14deg); }
.collection-context-art.is-card-stack .context-card--2 { transform:translate(-50%,-56%) rotate(0deg); z-index:4; }
.collection-context-art.is-card-stack .context-card--3 { transform:translate(-12%,-48%) rotate(14deg); z-index:3; }
.collection-context-art.is-card-stack.is-deck > img.context-card { width:78px; max-height:122px; }
.collection-context-art.is-card-stack.is-deck .context-card--1 { transform:translate(-82%,-35%) rotate(-13deg); }
.collection-context-art.is-card-stack.is-deck .context-card--2 { transform:translate(-50%,-40%) rotate(0deg); z-index:5; }
.collection-context-art.is-card-stack.is-deck .context-card--3 { transform:translate(-18%,-35%) rotate(13deg); z-index:4; }
.collection-context-art .context-playmat {
  position:absolute; left:50%; top:50%; z-index:1;
  width:190px; height:108px; max-height:none !important;
  object-fit:cover; border-radius:10px;
  transform:translate(-50%,-51%) rotate(-3deg);
  border:3px solid #9f723c;
  box-shadow:0 9px 18px rgba(67,37,17,.2);
}
.collection-context-art .context-playmat.is-missing {
  display:block; opacity:.92;
  background:linear-gradient(135deg,#173d2d,#274e36);
}
.collection-context-art.is-card-stack.is-deck::after { display:none; }

/* Round-end overlay shared by every arcade game, including fullscreen mode. */
.mini-game-stage { position:relative; }
.mini-game-over {
  position:absolute; inset:0; z-index:200;
  display:grid; place-items:center; padding:20px;
  background:rgba(10,9,18,.62); backdrop-filter:blur(5px);
  border-radius:inherit;
}
.mini-game-over__card {
  width:min(430px,calc(100% - 24px)); padding:24px 22px;
  border:3px solid #e9b644; border-radius:24px;
  background:#fff8e8; color:#1d2137; text-align:center;
  box-shadow:0 24px 70px rgba(0,0,0,.48);
}
.mini-game-over__card > span { display:block; color:#bf354c; font-weight:950; letter-spacing:.15em; font-size:.76rem; }
.mini-game-over__card h4 { margin:5px 0 2px; font-size:clamp(1.55rem,4vw,2.5rem); }
.mini-game-over__card > strong { display:block; margin:4px 0; color:#c7263e; font-size:clamp(2.3rem,7vw,4rem); line-height:1; }
.mini-game-over__card p { margin:10px auto 15px; max-width:34ch; color:#62576a; font-weight:700; }
.mini-game-over__card > div { display:flex; justify-content:center; flex-wrap:wrap; gap:9px; }
.mini-game-stage:fullscreen .mini-game-over,
.mini-game-stage.is-pseudo-fullscreen .mini-game-over { position:fixed; border-radius:0; }

/* Hook-a-Cluck: keep all targets visibly above the waterline and farther from walls. */
.hook-a-cluck__target { width:clamp(32px,4.4vw,60px); height:clamp(70px,8vw,110px); }
.hook-a-cluck__target.is-gold { width:clamp(33px,4.55vw,62px); height:clamp(72px,8.2vw,114px); }
.hook-a-cluck__target.is-grenade { width:clamp(26px,3.4vw,45px); height:clamp(43px,4.9vw,66px); }


/* 2026-08-09 holo/hook/header correction pass. */
/* The moving hook lives behind the booth foreground, so the lower hook/rope
   visibly disappears into the tank instead of drawing over the front timber. */
.hook-a-cluck__water {
  inset:39% 14.5% 27% 15.5%;
  overflow:hidden;
}
.hook-a-cluck__rig { z-index:4 !important; }
.hook-a-cluck-board::before { z-index:5; }
.hook-a-cluck__cursor { z-index:6; }

/* Make both collection card identifiers unmistakably three-card fans. */
.collection-context-art[data-tab="binder"].is-card-stack,
.collection-context-art[data-tab="deck"].is-card-stack {
  min-width:270px;
  height:160px;
}
.collection-context-art[data-tab="binder"].is-card-stack > img.context-card {
  top:43%; width:88px; max-height:136px;
}
.collection-context-art[data-tab="binder"].is-card-stack .context-card--1 { transform:translate(-112%,-50%) rotate(-17deg); z-index:2; }
.collection-context-art[data-tab="binder"].is-card-stack .context-card--2 { transform:translate(-50%,-60%) rotate(0deg); z-index:4; }
.collection-context-art[data-tab="binder"].is-card-stack .context-card--3 { transform:translate(12%,-50%) rotate(17deg); z-index:3; }
.collection-context-art[data-tab="deck"].is-card-stack .context-playmat {
  left:50%; top:46%; width:205px; height:112px; z-index:1;
  transform:translate(-50%,-50%) rotate(-3deg);
}
.collection-context-art[data-tab="deck"].is-card-stack > img.context-card {
  top:57%; width:73px; max-height:116px;
}
.collection-context-art[data-tab="deck"].is-card-stack .context-card--1 { transform:translate(-105%,-45%) rotate(-15deg); z-index:3; }
.collection-context-art[data-tab="deck"].is-card-stack .context-card--2 { transform:translate(-50%,-54%) rotate(0deg); z-index:5; }
.collection-context-art[data-tab="deck"].is-card-stack .context-card--3 { transform:translate(5%,-45%) rotate(15deg); z-index:4; }
/* No fake green playmat if the real standard playmat is available. */
.collection-context-art.is-card-stack.is-deck::before { display:none !important; }


/* 2026-08-09 REALFIX3 — verified against the running collection page. */
/* Generic collection-context animation used transform and therefore flattened
   the three-card fan into one perfectly overlapping card. Cards/playmat keep
   their own transforms; only single-image tab art uses the intro animation. */
.collection-context-art.is-card-stack > img.context-card,
.collection-context-art.is-card-stack > img.context-playmat {
  animation: none !important;
}
.collection-context-art[data-tab="binder"].is-card-stack > img.context-card,
.collection-context-art[data-tab="deck"].is-card-stack > img.context-card {
  opacity: 1 !important;
}

/* Hook-a-Cluck water target layer begins at the actual water surface, not up
   in the farm backdrop. This keeps bodies/loops in the tank while the booth
   foreground still masks their lower halves. */
.hook-a-cluck__water {
  inset: 48.5% 14.5% 27% 15.5% !important;
  overflow: hidden !important;
}
.hook-a-cluck__target { transform-origin: 50% 82%; }

/* 2026-08-09 campaign-rebalance pass: Deck Builder header is cards only. */
.collection-context-art[data-tab="deck"].is-card-stack::before,
.collection-context-art[data-tab="deck"].is-card-stack .context-playmat {
  display:none !important;
}
.collection-context-art[data-tab="deck"].is-card-stack > img.context-card {
  top:44%; width:88px; max-height:136px;
}
.collection-context-art[data-tab="deck"].is-card-stack .context-card--1 { transform:translate(-112%,-50%) rotate(-17deg); z-index:2; }
.collection-context-art[data-tab="deck"].is-card-stack .context-card--2 { transform:translate(-50%,-60%) rotate(0deg); z-index:4; }
.collection-context-art[data-tab="deck"].is-card-stack .context-card--3 { transform:translate(12%,-50%) rotate(17deg); z-index:3; }

/* 2026-08-09 final alignment pass — all six arcade cards share the same rows. */
.mini-game-grid { align-items: stretch; }
.mini-game-card {
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
}
.mini-game-card__art { flex:0 0 auto; }
.mini-game-card h3 { flex:0 0 auto; margin-bottom:10px; }
.mini-game-card p {
  flex:1 1 auto;
  min-height:0 !important;
  margin-bottom:16px;
}
.mini-game-card .mini-game-ticket-tiers { flex:0 0 auto; width:100%; margin-top:auto; }
.mini-game-card > .button { align-self:flex-start; flex:0 0 auto; margin-top:10px; }

/* FLAPPY CHICKEN — FACTORY ESCAPE v0.1 */
.mini-game-card--flappy {
  border-color:#7c5c2f;
  background:linear-gradient(165deg,#1b1c24,#15120f 66%,#27160c);
  box-shadow:inset 0 0 34px rgba(255,132,34,.08),0 12px 28px rgba(0,0,0,.28);
}
.mini-game-card--flappy .mini-game-card__art {
  box-shadow:inset 0 0 0 2px rgba(255,173,66,.24);
}
.flappy-chicken-canvas {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/9;
  max-height:72vh;
  margin-inline:auto;
  border:5px solid #6a4930;
  border-radius:18px;
  background:#070b10;
  box-shadow:inset 0 0 0 3px #d58f38,0 10px 34px rgba(0,0,0,.45);
  touch-action:manipulation;
  cursor:pointer;
}
.flappy-chicken-help {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:7px;
  margin:10px 0 0;
}
.flappy-chicken-help span {
  padding:5px 9px;
  border:1px solid rgba(255,189,92,.22);
  border-radius:999px;
  background:rgba(14,12,10,.62);
  color:#f7dfb5;
  font-size:.68rem;
  font-weight:850;
  letter-spacing:.035em;
}
.mini-game-stage--flappy .mini-scoreline span:last-child b { color:#71dcff; }
.mini-game-stage--flappy:fullscreen,
.mini-game-stage--flappy.is-pseudo-fullscreen {
  background:#090b10;
}
.mini-game-stage--flappy:fullscreen .flappy-chicken-canvas,
.mini-game-stage--flappy.is-pseudo-fullscreen .flappy-chicken-canvas {
  width:min(100%, calc((100vh - 176px) * 1.7778));
  max-height:calc(100vh - 176px);
  align-self:center;
}
@media (max-width:700px) {
  .flappy-chicken-help { gap:5px; }
  .flappy-chicken-help span { font-size:.61rem; padding:4px 7px; }
  .mini-game-stage--flappy .button-row .button { flex:1 1 42%; }
}


/* 2026-08-11 Egg Arcade v0.5.1 — compact stats + full-width Flappy feature */
.mini-games-heading{display:block;margin-bottom:22px}
.mini-games-heading>div:first-child{max-width:none}
.mini-games-summary{width:100%;min-width:0;margin-top:18px;grid-template-columns:repeat(9,minmax(0,1fr));gap:9px}
.mini-games-summary span{min-width:0;padding:9px 7px;border-radius:13px;line-height:1.15}
.mini-games-summary strong{font-size:1.45rem}

.mini-game-card--flappy{
  grid-column:1/-1;min-height:0;display:grid;
  grid-template-columns:minmax(0,1fr) minmax(245px,320px);
  grid-template-areas:"art art" "title tickets" "desc tickets" "desc button";
  column-gap:24px;row-gap:0;align-items:start;
  border:2px solid #ffffffa8;background:#fffaf0;color:inherit;
  box-shadow:0 12px 28px #74451426
}
.mini-game-card--flappy .mini-game-card__art{
  grid-area:art;width:auto;height:auto;aspect-ratio:1916/821;
  margin:-18px -18px 17px;overflow:hidden;padding:0;border:0;
  border-radius:20px 20px 0 0;background:#fff4dc;box-shadow:none
}
.mini-game-card--flappy .mini-game-card__art img{width:100%;height:100%;object-fit:cover;object-position:center}
.mini-game-card--flappy h3{grid-area:title;margin:0 0 8px;color:inherit}
.mini-game-card--flappy>p{grid-area:desc;min-height:0!important;max-width:900px;margin:0;color:inherit}
.mini-game-card--flappy .mini-game-ticket-tiers{grid-area:tickets;align-self:end;margin:0}
.mini-game-card--flappy>.button{grid-area:button;justify-self:start;align-self:start;margin-top:10px}

@media(max-width:1250px){.mini-games-summary{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:900px){
  .mini-games-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mini-game-card--flappy{grid-template-columns:1fr;grid-template-areas:"art" "title" "desc" "tickets" "button";gap:0}
  .mini-game-card--flappy .mini-game-ticket-tiers{margin-top:15px}
}
@media(max-width:560px){.mini-games-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Mobile binder density: Pocket-style 3 -> 5 -> 11 columns. */
.binder-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.binder-density{display:none;align-items:center;gap:5px;color:var(--ink-soft);font-size:.72rem;font-weight:800}
.binder-density span{margin-right:2px}
.binder-density button{min-width:34px;padding:6px 8px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-weight:900;cursor:pointer}
.binder-density button[aria-pressed="true"]{border-color:#d7263d;background:#d7263d;color:#fff}
.binder-pinch-hint{display:none;margin:6px 0 10px;color:var(--ink-soft);font-size:.72rem;font-weight:750}
@media (max-width:760px){
  [data-panel="binder"] .binder-density{display:flex}
  [data-panel="binder"] .binder-pinch-hint{display:block}
  [data-role="binder-grid"].collection-grid{
    --binder-columns:3;
    grid-template-columns:repeat(var(--binder-columns),minmax(0,1fr));
    gap:7px;
    touch-action:pan-y;
  }
  [data-role="binder-grid"] .collection-card{min-width:0;border-radius:9px}
  [data-role="binder-grid"] .collection-card__body{padding:6px;gap:3px}
  [data-role="binder-grid"] .collection-card__body strong{font-size:.68rem;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  [data-role="binder-grid"] .collection-card__body span{font-size:.57rem;line-height:1.1}
  [data-role="binder-grid"] .collection-card__body .button{display:none}
  [data-role="binder-grid"][data-density="5"]{gap:4px}
  [data-role="binder-grid"][data-density="5"] .collection-card{border-radius:6px}
  [data-role="binder-grid"][data-density="5"] .collection-card__body{padding:3px 2px;gap:1px}
  [data-role="binder-grid"][data-density="5"] .collection-card__body strong{font-size:.5rem}
  [data-role="binder-grid"][data-density="5"] .collection-card__body span{display:none}
  [data-role="binder-grid"][data-density="11"]{gap:2px}
  [data-role="binder-grid"][data-density="11"] .collection-card{border-radius:3px;box-shadow:none}
  [data-role="binder-grid"][data-density="11"] .collection-card__body{display:none}
  [data-role="binder-grid"][data-density="11"] .collection-card__holo-badge{font-size:.35rem;padding:1px 2px}
  [data-role="binder-grid"][data-density="11"] .collection-card__back{filter:brightness(.86) saturate(.82)}
}

/* 2026-08-11 mobile arcade scaling pass — make fullscreen about the game,
   not giant chrome/controls, and keep touch targets compact but usable. */
@media (max-width: 760px) {
  .mini-game-stage:fullscreen,
  .mini-game-stage.is-pseudo-fullscreen {
    position:fixed;
    inset:0;
    width:100vw;
    height:100dvh;
    min-height:100dvh;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    overflow:hidden !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
    background:#10101a;
  }

  .mini-game-stage:fullscreen header,
  .mini-game-stage.is-pseudo-fullscreen header {
    position:absolute;
    z-index:40;
    top:max(2px, env(safe-area-inset-top));
    left:max(3px, env(safe-area-inset-left));
    right:max(3px, env(safe-area-inset-right));
    min-height:0;
    margin:0 !important;
    padding:3px 5px !important;
    border-radius:8px;
    background:linear-gradient(180deg,rgba(12,11,20,.78),rgba(12,11,20,.42));
    backdrop-filter:blur(3px);
    pointer-events:none;
  }
  .mini-game-stage:fullscreen header > div:first-child,
  .mini-game-stage.is-pseudo-fullscreen header > div:first-child { min-width:0; }
  .mini-game-stage:fullscreen h3,
  .mini-game-stage.is-pseudo-fullscreen h3 {
    margin:0 !important;
    font-size:clamp(.78rem,3.2vw,1rem) !important;
    line-height:1.05;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .mini-game-stage:fullscreen .mini-game-message,
  .mini-game-stage.is-pseudo-fullscreen .mini-game-message,
  .mini-game-stage:fullscreen .flappy-chicken-help,
  .mini-game-stage.is-pseudo-fullscreen .flappy-chicken-help { display:none !important; }
  .mini-game-stage:fullscreen .mini-scoreline,
  .mini-game-stage.is-pseudo-fullscreen .mini-scoreline { gap:3px; flex-wrap:nowrap; }
  .mini-game-stage:fullscreen .mini-scoreline span,
  .mini-game-stage.is-pseudo-fullscreen .mini-scoreline span {
    padding:3px 6px;
    font-size:clamp(.62rem,2.6vw,.78rem);
    line-height:1.05;
    white-space:nowrap;
    background:rgba(255,255,255,.10);
  }

  .mini-game-stage:fullscreen .button-row,
  .mini-game-stage.is-pseudo-fullscreen .button-row {
    position:absolute;
    z-index:45;
    left:max(3px, env(safe-area-inset-left));
    right:max(3px, env(safe-area-inset-right));
    bottom:max(3px, env(safe-area-inset-bottom));
    display:flex;
    flex-wrap:nowrap;
    justify-content:center;
    gap:3px;
    margin:0 !important;
    padding:3px;
    overflow-x:auto;
    scrollbar-width:none;
    border-radius:9px;
    background:rgba(12,11,20,.42);
    backdrop-filter:blur(3px);
  }
  .mini-game-stage:fullscreen .button-row::-webkit-scrollbar,
  .mini-game-stage.is-pseudo-fullscreen .button-row::-webkit-scrollbar { display:none; }
  .mini-game-stage:fullscreen .button-row .button,
  .mini-game-stage.is-pseudo-fullscreen .button-row .button {
    flex:0 0 auto !important;
    min-width:0 !important;
    min-height:30px !important;
    padding:4px 7px !important;
    border-width:1px !important;
    border-radius:8px !important;
    font-size:clamp(.62rem,2.5vw,.76rem) !important;
    line-height:1 !important;
    white-space:nowrap;
  }

  .mini-game-stage:fullscreen .egg-shy-board,
  .mini-game-stage.is-pseudo-fullscreen .egg-shy-board,
  .mini-game-stage:fullscreen .chicken-hunt-stage,
  .mini-game-stage.is-pseudo-fullscreen .chicken-hunt-stage,
  .mini-game-stage--flappy:fullscreen .flappy-chicken-canvas,
  .mini-game-stage--flappy.is-pseudo-fullscreen .flappy-chicken-canvas {
    width:min(100vw, calc(100dvh * 1.7778)) !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 auto !important;
    border-width:2px !important;
    border-radius:5px !important;
  }
  .mini-game-stage:fullscreen .egg-target-range,
  .mini-game-stage.is-pseudo-fullscreen .egg-target-range,
  .mini-game-stage:fullscreen .hook-a-cluck-board,
  .mini-game-stage.is-pseudo-fullscreen .hook-a-cluck-board {
    width:min(100vw, calc(100dvh * 1.5)) !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 auto !important;
    border-width:2px !important;
    border-radius:5px !important;
  }
  .mini-game-stage:fullscreen .chicken-run-canvas,
  .mini-game-stage.is-pseudo-fullscreen .chicken-run-canvas {
    width:min(100vw, calc(100dvh * 3)) !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 auto !important;
    border-width:2px !important;
    border-radius:5px !important;
  }
  .mini-game-stage:fullscreen .cluckman-canvas,
  .mini-game-stage.is-pseudo-fullscreen .cluckman-canvas {
    width:min(100vw, 100dvh) !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    margin:auto !important;
    border-width:2px !important;
    border-radius:5px !important;
  }
  .mini-game-stage:fullscreen .cluckman-controls,
  .mini-game-stage.is-pseudo-fullscreen .cluckman-controls {
    position:absolute;
    z-index:46;
    right:max(4px, env(safe-area-inset-right));
    bottom:42px;
    gap:3px;
    margin:0;
  }
  .mini-game-stage:fullscreen .cluckman-controls__row,
  .mini-game-stage.is-pseudo-fullscreen .cluckman-controls__row { gap:3px; }
  .mini-game-stage:fullscreen .cluckman-controls .button,
  .mini-game-stage.is-pseudo-fullscreen .cluckman-controls .button {
    min-width:34px;
    min-height:32px;
    padding:4px 7px;
    font-size:.78rem;
  }

  /* Hook-a-Cluck's production hook is very tall. Desktop size looked gigantic
     on phones, so scale the rig and hook relative to the mobile playfield. */
  .hook-a-cluck__rig { width:30px; }
  .hook-a-cluck__rope { left:14px; width:3px; }
  .hook-a-cluck__hook {
    left:4px !important;
    width:22px !important;
    height:66px !important;
    top:calc(var(--drop,24px) - 2px) !important;
  }
  .hook-a-cluck__cursor { font-size:14px; }
  .hook-a-cluck__target { width:clamp(24px,7vw,40px); height:clamp(55px,15vw,82px); }
  .hook-a-cluck__target.is-gold { width:clamp(25px,7.2vw,42px); height:clamp(57px,15.4vw,86px); }
  .hook-a-cluck__target.is-goldenEgg { width:clamp(22px,6vw,35px); height:clamp(40px,11vw,58px); }
  .hook-a-cluck__target.is-grenade { width:clamp(20px,5.5vw,31px); height:clamp(34px,9.5vw,49px); }
  .hook-a-cluck__feedback { width:76px; height:62px; }
  .hook-a-cluck__feedback b { font-size:.88rem; }

  /* Keep touch input immediate on the runner and flappy canvas/buttons. */
  .chicken-run-canvas,
  .flappy-chicken-canvas,
  [data-action="run-jump"],
  [data-action="run-duck"],
  [data-action="flappy-flap"] { touch-action:none !important; }
}


/* Bulk duplicate recycling + pack opening QoL */
.bulk-action-row,
.claw-recycler__bulk {
  display: grid;
  grid-template-columns: minmax(94px, 120px) minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
}
.bulk-action-row label,
.claw-recycler__bulk label {
  display: grid;
  gap: 5px;
  color: #654c3d;
  font-weight: 800;
  font-size: .88rem;
}
.bulk-action-row input,
.claw-recycler__bulk input {
  width: 100%;
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid rgba(91, 54, 28, .22);
  border-radius: 10px;
  background: #fffdf8;
  color: #1c2440;
  font: inherit;
  font-weight: 800;
}
.bulk-action-row__max { min-width: 58px; padding-inline: 12px; }
.sticker-pack-actions--open { display: grid; grid-template-columns: minmax(92px, 118px) minmax(0, 1fr) auto; align-items: end; }
.sticker-pack-actions--open > .button:last-child { grid-column: 1 / -1; }
@media (max-width: 640px) {
  .bulk-action-row,
  .claw-recycler__bulk,
  .sticker-pack-actions--open { grid-template-columns: minmax(88px, 110px) 1fr auto; }
  .bulk-action-row .button,
  .claw-recycler__bulk .button,
  .sticker-pack-actions--open .button { min-height: 44px; }
}


/* Captain Quackshot recovery: full-width arcade banner below Flappy Chicken. */
.mini-game-card--captain-quackshot{
  grid-column:1/-1;min-height:0;display:grid;
  grid-template-columns:minmax(0,1fr) minmax(245px,320px);
  grid-template-areas:"art art" "title button" "desc button";
  column-gap:24px;row-gap:0;align-items:start;
  border:2px solid #ffffffa8;background:#fffaf0;color:inherit;
  box-shadow:0 12px 28px #74451426
}
.mini-game-card--captain-quackshot .mini-game-card__art{
  grid-area:art;width:auto;height:auto;aspect-ratio:1916/821;
  margin:-18px -18px 17px;overflow:hidden;padding:0;border:0;
  border-radius:20px 20px 0 0;background:#fff4dc;box-shadow:none
}
.mini-game-card--captain-quackshot .mini-game-card__art img{
  width:100%;height:100%;object-fit:cover;object-position:center
}
.mini-game-card--captain-quackshot h3{grid-area:title;margin:0 0 8px}
.mini-game-card--captain-quackshot>p{grid-area:desc;margin:0}
.mini-game-card--captain-quackshot>.button{grid-area:button;align-self:end;justify-self:stretch;text-align:center}
@media(max-width:900px){
  .mini-game-card--captain-quackshot{
    grid-template-columns:1fr;grid-template-areas:"art" "title" "desc" "button";gap:0
  }
  .mini-game-card--captain-quackshot>.button{margin-top:16px}
}


/* Captain Quackshot embedded Egg Arcade shell — 2026-08-26 */
.captain-quackshot-stage{
  margin-top:18px;
  border:1px solid rgba(255,211,118,.28);
  border-radius:20px;
  padding:14px;
  background:linear-gradient(180deg,rgba(18,26,20,.96),rgba(9,14,12,.98));
  box-shadow:0 18px 50px rgba(0,0,0,.35);
}
.captain-quackshot-stage[hidden]{display:none!important}
.captain-quackshot-stage__header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:10px}
.captain-quackshot-stage__header h3{margin:.15rem 0 0;font-size:clamp(1.35rem,2.5vw,2rem)}
.captain-quackshot-stage__actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.captain-quackshot-frame-shell{
  --cq-view-scale:.8475;
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  min-height:360px;
  overflow:hidden;
  border-radius:14px;
  background:#050807;
  border:1px solid rgba(255,255,255,.12);
  isolation:isolate;
}
/* Give the Godot export a ~18% larger browser viewport, then scale it back into
   the shell. Responsive Godot exports therefore show more of the level. */
.captain-quackshot-frame{
  position:absolute;
  left:50%;top:50%;
  width:118%;height:118%;
  border:0;
  display:block;
  background:#050807;
  transform:translate(-50%,-50%) scale(var(--cq-view-scale));
  transform-origin:center;
}
.captain-quackshot-stage:fullscreen{width:100vw;height:100vh;margin:0;padding:10px;border:0;border-radius:0;background:#000;display:flex;flex-direction:column}
.captain-quackshot-stage:fullscreen .captain-quackshot-stage__header{flex:0 0 auto;margin-bottom:8px}
.captain-quackshot-stage:fullscreen .captain-quackshot-frame-shell{flex:1 1 auto;width:100%;height:auto;min-height:0;aspect-ratio:auto;border-radius:8px}
.captain-quackshot-stage:fullscreen .captain-quackshot-frame{width:118%;height:118%}
.captain-quackshot-view-note{margin:8px 2px 0;color:var(--muted,#b9b4a6);font-size:.82rem}
@media(max-width:760px){
  .captain-quackshot-stage{padding:8px;margin-inline:-8px;border-radius:14px}
  .captain-quackshot-stage__header{align-items:flex-start;flex-direction:column}
  .captain-quackshot-stage__actions{width:100%;justify-content:stretch}
  .captain-quackshot-stage__actions .button{flex:1 1 0}
  .captain-quackshot-frame-shell{--cq-view-scale:.8772;aspect-ratio:16/10;min-height:58vh}
  .captain-quackshot-frame{width:114%;height:114%}
}
