/* Animal Album: bright book cover, illustrated pages, and peelable stickers. */
#animalAlbumButton {
  background: linear-gradient(145deg, #ffe395, #ffad36 55%, #f17616);
  overflow: visible;
}
#animalAlbumButton .album-launcher-label {
  position: absolute; bottom: 1px; left: 0; right: 0;
  color: #fff; font: bold 16px/1 var(--font-heavy);
}
#animalAlbumButton > img { transform: translateY(-7px); }
#animalAlbumButton .collection-menu-badge[hidden] { display: none; }
#animalAlbumBadge { display: flex; align-items: center; justify-content: center; text-align: center; line-height: 1; letter-spacing: 0; padding: 1px 5px 0; min-width: 26px; height: 26px; font-size: 14px; transform: none; background: linear-gradient(#a6ff76, #35cf54); box-shadow: 0 2px 0 rgba(25, 91, 43, .38); }
.animal-album {
  --album-ink: #152641;
  width: min(1020px, calc(100vw - 32px)); max-width: none;
  height: auto;
  max-height: min(720px, calc(100dvh - 32px)); padding: 0; margin: auto;
  color: white; background: #513322; border: 5px solid #2b1a12;
  border-radius: 20px; overflow: hidden;
  font-family: GameHeavy, Arial, sans-serif;
  box-shadow: 0 8px 0 #24150e, 0 22px 70px #24150e88;
}
.animal-album::after {
  content: ''; position: absolute; inset: 0; z-index: 30;
  border-radius: 15px; box-shadow: inset 0 0 0 3px #ffbd66;
  pointer-events: none;
}
.animal-album[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.album-layout { display: grid; grid-template-columns: 180px minmax(0, 1fr); min-height: 0; }
.album-biome-sidebar { position: relative; min-height: 0; contain: size; border-right: 2px solid #5a3015; background: #38201066; }
.album-biome-scroll { height: 100%; padding: 12px 12px 12px 7px; overflow-y: auto; overflow-x: hidden; scrollbar-width: none; overscroll-behavior: contain; touch-action: pan-y; }
.album-biome-scroll::-webkit-scrollbar { display: none; }
.album-scroll-shell { position: relative; min-width: 0; min-height: 0; overflow: hidden; }
.album-scroll-content {
  height: 100%; overflow-y: auto; overflow-x: hidden; padding-right: 22px;
  scrollbar-width: none; overscroll-behavior: contain; touch-action: pan-y;
}
.album-scroll-content::-webkit-scrollbar { display: none; width: 0; height: 0; }
.animal-album .album-scrollbar {
  top: 12px; bottom: 12px; right: 6px; width: 13px;
  border-color: #54280e;
  background: linear-gradient(90deg, #ffffff14, transparent 42%), linear-gradient(#874215, #48230f);
  box-shadow: inset 0 1px 3px #00000085, 0 1px 0 #ffd59a38;
}
.animal-album .album-scrollbar .leaderboard-scrollbar-thumb {
  border-color: #9a4a12;
  background: linear-gradient(90deg, #ffffffb8 0 22%, transparent 24%), linear-gradient(#ffe3aa 0%, #ffc16c 42%, #f58b23 70%, #ce5c13 100%);
  box-shadow: inset 0 2px 0 #ffffffad, inset 0 -2px 0 #8f3d0c61, 0 1px 2px #2b130980;
}
.album-scrollbar:focus-visible { outline: 2px solid #ffe4b5; outline-offset: 2px; }
.animal-album::backdrop { background: #081c3e99; backdrop-filter: blur(5px); }
.animal-album *, .animal-album *::before, .animal-album *::after { box-sizing: border-box; }
.animal-album button { font-family: inherit; cursor: pointer; touch-action: manipulation; }
.animal-album button:disabled { cursor: default; }
.animal-album button:focus-visible { outline: 4px solid white; outline-offset: 3px; }
.animal-album h2, .animal-album h3, .animal-album h4, .animal-album p { margin: 0; }
.album-header {
  display: flex; align-items: center; gap: 12px; min-height: 80px; padding: 8px 16px;
  border-bottom: 4px solid #5a3015;
  background: repeating-linear-gradient(130deg, transparent 0 42px, #ffffff16 42px 76px), linear-gradient(#ffc16c, #f58b23);
  box-shadow: inset 0 5px #ffe4b588;
}
.album-header > img { width: 58px; height: 58px; object-fit: contain; }
.album-title-copy { position: relative; min-width: 0; }
.album-subtitle { position: absolute; top: 100%; left: 0; white-space: nowrap; font: italic 700 clamp(9px, 1.2vw, 12px)/1 Arial, sans-serif; letter-spacing: .2px; color: #65330f; -webkit-text-stroke: 0; text-shadow: none; }
.album-header h2 { font-size: clamp(26px, 3.2vw, 40px); -webkit-text-stroke: 5px #12314b; paint-order: stroke fill; letter-spacing: .2px; }
.album-header p { margin-top: 4px; color: #103452; font-size: 14px; }
.album-close { flex: 0 0 52px; width: 52px; height: 52px; padding: 0; margin-left: 0; border: 0; background: transparent; }
.album-close img { width: 100%; height: 100%; object-fit: contain; }
.album-close:hover { transform: scale(1.08); }
.album-body { display: grid; grid-template-columns: minmax(0, 1fr) 272px; gap: 12px; padding: 12px; align-items: stretch; }
.album-tabs { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: 12px; padding: 3px; }
.album-tab {
  position: relative; display: flex; flex-direction: column; align-items: start; gap: 9px;
  min-height: 104px; padding: 12px; gap: 7px; border: 3px solid #0c1c30; border-radius: 10px;
  background: linear-gradient(90deg, #10233988, #10233900), var(--biome-image), var(--tab-color);
  background-size: cover; background-position: center 46%;
  color: #fff; text-align: left; box-shadow: inset 0 3px #ffffff80, 0 4px #0c1c30;
  transition: transform 140ms;
}
.album-tab[data-page="forest"] { background-image: linear-gradient(90deg, #163b2877, #163b2800), url('../assets/game/album/forest-ai.webp'); border-color: #1b4825; }
.album-tab[data-page="savanna"] { background-image: linear-gradient(90deg, #66390588, #66390500), url('../assets/game/album/savanna-ai.webp'); border-color: #644512; }
.album-tab[data-page="special"] { background: radial-gradient(ellipse at top right, #c1b4ff, #685cc4 65%, #423984); border-color: #392565; }
.album-tab strong { max-width: 100%; overflow-wrap: anywhere; font-size: 21px; -webkit-text-stroke: 3px #152b35; paint-order: stroke fill; }
.album-tab[data-page="sky-kingdom"] strong, .album-tab[data-page="crystal-caverns"] strong { font-size: 18px; }
.album-tab span { margin-top: auto; margin-bottom: -3px; padding: 2px 4px; border-radius: 4px; background: #102339bb; font: 700 11px Arial, sans-serif; white-space: nowrap; }
.album-tab .album-biome-badge { top: -7px; right: -6px; z-index: 2; min-width: 23px; height: 23px; padding: 1px 5px 0; font-size: 12px; line-height: 1; letter-spacing: 0; text-align: center; }
.album-tab i {
  position: relative; width: 100%; height: 12px; flex-shrink: 0;
  background: rgba(22, 14, 25, .72); border: 2px solid rgba(8, 7, 10, .86);
  border-radius: 6px; overflow: hidden;
  box-shadow: inset 0 1px 0 #ffffff2e, 0 2px 0 #00000047;
}
.album-tab i::before {
  content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit;
  background: linear-gradient(180deg, #ffffff8c 0%, #ffffff33 42%, transparent 50%, #0000001a 100%);
  box-shadow: inset 0 1px 0 #ffffff80; pointer-events: none;
}
.album-tab i::after {
  display: block; content: ''; width: var(--progress); height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, #35ee62, #ffe95f, #ff932e, #ff4dd2);
}
.album-tab.is-active { outline: 3px solid #eaffff; outline-offset: 0; }
.album-tab:hover { filter: brightness(1.08); }
.album-details[hidden] { display: none; }
.album-biome-sidebar:has(.album-biome-scrollbar:not([hidden])) .album-biome-scroll { padding-right: 22px; }
.album-page { display: flex; flex-direction: column; min-width: 0; background: #fff8d9; border: 3px solid #0c1c30; border-radius: 12px; overflow: hidden; }
.album-scene { flex: 1; min-height: 350px; padding: 12px; background-image: var(--biome-image); background-size: cover; background-position: center; }
[data-scene="forest"] .album-scene { background-image: url('../assets/game/album/forest-ai.webp'); }
[data-scene="savanna"] .album-scene { background-image: url('../assets/game/album/savanna-ai.webp'); }
[data-scene="special"] .album-scene { background: radial-gradient(ellipse at top, #c1b4ff, #685cc4 65%, #423984); }
.album-page-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.album-page-heading h3 { min-width: 0; font-size: var(--fitted-name-size, 31px); -webkit-text-stroke: 4px #18351f; paint-order: stroke fill; }
.album-page-heading > b { background: #193222c9; border: 2px solid #f1ffe8; border-radius: 10px; padding: 4px 7px; font-size: 19px; white-space: nowrap; }
.album-sticker-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 8px 10px; }
.album-sticker {
  --rarity-color: #e6f4ff;
  position: relative; display: flex; flex-direction: column; align-items: center; min-width: 0;
  padding: 4px 6px 5px; border: 3px solid #fff; border-radius: 10px;
  background: linear-gradient(150deg, #fff, var(--rarity-color)); color: #17304b;
  box-shadow: 0 3px 0 #14274066;
  transition: transform 140ms, box-shadow 140ms;
}
.album-sticker:hover { transform: translateY(-2px); z-index: 2; }
.album-sticker.is-selected { border-color: #ffe931; outline: 2px solid #544e19; box-shadow: 0 3px 0 #544e19; }
.album-sticker.is-missing { background: linear-gradient(150deg, color-mix(in srgb, var(--rarity-color) 45%, white), var(--rarity-color)); border: 3px dashed #f8ffe49c; color: white; box-shadow: inset 0 2px 10px #14312555; }
.album-sticker.is-missing.is-selected { border-color: #ffe931; }
.album-sticker-art { position: relative; display: grid; place-items: center; width: 100%; min-width: 0; height: 104px; padding: 8px; overflow: hidden; contain: paint; flex-shrink: 0; }
.album-sticker-art img { position: absolute; inset: 8px; width: calc(100% - 16px); height: calc(100% - 16px); max-width: 100%; max-height: 100%; object-fit: contain; object-position: center; opacity: 0; filter: drop-shadow(2px 0 white) drop-shadow(-2px 0 white) drop-shadow(0 2px white); }
.album-sticker-art img.is-loaded { opacity: 1; }
.album-sticker-art i { position: absolute; font: 40px GameHeavy, sans-serif; color: #fff; -webkit-text-stroke: 3px #263443; paint-order: stroke fill; }
.is-found .album-sticker-art img.is-loaded + i { display: none; }
.is-missing .album-sticker-art img { filter: brightness(0); opacity: .5; }
.album-sticker strong { position: relative; z-index: 1; display: grid; place-items: center; min-height: 28px; width: 100%; font-size: var(--fitted-name-size, 19px); color: #fff; -webkit-text-stroke: 3px #000; paint-order: stroke fill; line-height: 1.18; text-align: center; }
[data-album-name] > span { display: inline-block; width: max-content; white-space: nowrap; }
.album-sticker-status { display: grid; place-items: center; height: 26px; min-height: 26px; flex-shrink: 0; margin-top: 2px; font: 800 11px Arial, sans-serif; letter-spacing: .2px; }
.is-found .album-sticker-status {
  position: relative; z-index: 1; padding: 3px 10px;
  border: 3px solid rgba(20, 11, 8, .7); border-radius: 11px;
  background:
    radial-gradient(circle at 27% 18%, rgba(255, 255, 255, .72) 0 8%, rgba(255, 255, 255, .24) 18%, transparent 31%),
    linear-gradient(145deg, #dfffa6 0%, #69ef49 50%, #20b83d 100%);
  box-shadow: inset 0 5px 0 rgba(255, 255, 255, .38), 0 4px 0 rgba(0, 0, 0, .3), 0 7px 14px rgba(0, 0, 0, .18), 0 0 18px rgba(105, 255, 91, .42);
  color: #fff; font: 1000 14px/1 var(--font-heavy); letter-spacing: 0;
  -webkit-text-stroke: 2px #000; paint-order: stroke fill;
  text-shadow: 0 2px 0 rgba(5, 3, 6, .42);
}
.is-found .album-sticker-status::before {
  content: ""; position: absolute; inset: 6px; pointer-events: none;
  border: 1px solid rgba(255, 255, 255, .26); border-radius: 7px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .18), transparent 48%), repeating-linear-gradient(135deg, rgba(255, 255, 255, .18) 0 6px, rgba(40, 166, 60, .2) 6px 12px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 rgba(25, 22, 91, .1);
  opacity: .34;
}
.is-found.is-collected .album-sticker-status {
  background:
    radial-gradient(circle at 27% 18%, rgba(255, 255, 255, .72) 0 8%, rgba(255, 255, 255, .24) 18%, transparent 31%),
    linear-gradient(145deg, #b9f4ff 0%, #49bfff 50%, #2079df 100%);
  box-shadow: inset 0 5px 0 rgba(255, 255, 255, .38), 0 4px 0 rgba(0, 0, 0, .3), 0 7px 14px rgba(0, 0, 0, .18), 0 0 18px rgba(73, 191, 255, .42);
}
.is-found.is-collected .album-sticker-status::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, .18), transparent 48%), repeating-linear-gradient(135deg, rgba(255, 255, 255, .18) 0 6px, rgba(32, 121, 223, .2) 6px 12px);
}
.album-sticker-status > span { position: relative; z-index: 1; }
.album-sticker-status .album-card-rarity { font-size: 15px; }
.album-claim-punctuation { display: inline-block; margin-left: -2px; }
.album-page-reward { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 14px; padding: 3px 18px; border-top: 3px solid #224327; color: #21324b; background: linear-gradient(#fdfbd3, #fff0aa); }
.album-page-reward > div:first-child { grid-column: 1 / -1; }
.album-page-reward div > span { font: 700 16px Arial, sans-serif; }
.album-page-reward > div:first-child > span { font-size: 15px; }
.album-page-reward button { position: relative; top: -3px; min-height: 36px; padding: 4px 16px; color: #fff; border: 3px solid #143927; border-radius: 10px; background: linear-gradient(#affd80, #54d83c); font: 900 18px var(--font-heavy); -webkit-text-stroke: 3px #000; paint-order: stroke fill; box-shadow: 0 3px #29442b; }
.album-page-reward button:disabled { opacity: 1; background: linear-gradient(#cbfba0, #90e269); border-color: #667d43; box-shadow: none; }
.album-page-reward.is-complete { background: linear-gradient(#d0ffab, #9bed7e); }
.album-page-prizes { display: flex; flex-wrap: wrap; gap: 10px; transform: translate(-8px, 3px); }
.album-page-prizes > span { display: inline-flex; align-items: center; gap: 1px; }
.album-page-prizes b { font: 22px GameHeavy, Arial, sans-serif; }
.album-page-prizes img { width: 38px; height: 38px; object-fit: contain; }
.album-page-prizes > span:first-child img { transform: translateY(-3px); }
.album-details { display: flex; flex-direction: column; align-self: start; min-width: 0; background: #eefbff; border: 3px solid #0b1c33; border-radius: 12px; padding: 10px; color: #19334c; }
.album-details .album-reward-box { margin-top: 8px; }
.album-feature { position: relative; text-align: center; border: 3px solid #182641; border-radius: 12px; padding: 10px 7px 12px; background: radial-gradient(ellipse at 50% 35%, #fff, #b9e8ff 75%); overflow: hidden; }
[data-rarity="rare"] .album-feature { background: radial-gradient(ellipse at 50% 35%, #e3ffff, #4ec9ed 75%); }
[data-rarity="epic"] .album-feature { background: radial-gradient(ellipse at 50% 35%, #f2d9ff, #b56de1 75%); }
.album-details:not([data-rarity="common"]):not([data-rarity="rare"]):not([data-rarity="epic"]) .album-feature {
  background: radial-gradient(ellipse at 50% 35%, color-mix(in srgb, var(--album-feature-color) 20%, white), var(--album-feature-color) 75%);
}
.album-feature .album-rarity { display: inline-block; padding: 4px 13px; font-size: 22px; }
/* Keep the outline behind the entire gradient, including on small stickers. */
.animal-album .pet-world-rarity {
  display: inline-grid;
  text-shadow: none;
  -webkit-text-stroke: 0;
  filter: none;
}
.animal-album .pet-world-rarity::before { content: none; }
.animal-album .pet-world-rarity > span {
  grid-area: 1 / 1;
  -webkit-text-stroke: 0;
  text-shadow: none;
}
.animal-album .pet-world-rarity > .album-rarity-outline {
  z-index: 0;
  background: none;
  color: var(--pet-rarity-outline);
  -webkit-text-fill-color: var(--pet-rarity-outline);
  -webkit-text-stroke: 2px var(--pet-rarity-outline);
  pointer-events: none;
}
.animal-album .pet-world-rarity > .album-rarity-fill {
  z-index: 1;
  background-image: var(--rarity-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.album-model-preview { position: relative; display: grid; place-items: center; width: 100%; min-width: 0; height: clamp(120px, 22vh, 190px); min-height: 0; margin: auto; overflow: hidden; contain: paint; }
.album-model-preview canvas, .album-model-preview img { position: absolute; inset: 12px; display: block; width: calc(100% - 24px); height: calc(100% - 24px); max-width: 100%; max-height: 100%; object-fit: contain; object-position: center; }
.album-preview-loading { font: 700 14px Arial, sans-serif; }
.is-undiscovered .album-preview-loading { position: absolute; z-index: 1; font: 56px/1 GameHeavy, sans-serif; color: white; -webkit-text-stroke: 4px #18304d; paint-order: stroke fill; }
.album-mystery-model { filter: brightness(0); opacity: .5; }
.album-feature h3 { margin-bottom: 9px; font-size: var(--fitted-name-size, 28px); color: #fff; -webkit-text-stroke: 4px #000; paint-order: stroke fill; line-height: 1.2; }
.album-feature p { margin-top: 6px; font-size: 17px; color: #126234; }
.album-feature .album-income { display: flex; align-items: center; justify-content: center; gap: 6px; color: #ffed70; -webkit-text-stroke: 3px #000; paint-order: stroke fill; }
.album-income img { width: 1.5em; height: 1.5em; object-fit: contain; flex-shrink: 0; transform: translateY(-3px); }
.is-undiscovered p { font: 700 13px Arial, sans-serif; color: #283b54; }
.album-found-date { padding: 6px 1px 0; font: 700 12px/1.4 Arial, sans-serif; text-align: center; }
.album-reward-box { padding: 9px; border-radius: 10px; border: 2px solid #a1bacb; background: white; }
.album-reward-box h4 { font-size: 14px; text-align: center; }
.album-rewards { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; }
.album-rewards > span { display: flex; align-items: center; justify-content: center; min-width: 0; gap: 3px; padding: 4px; border-radius: 8px; background: #e3f3ff; }
.album-rewards img { width: clamp(24px, 3.2vw, 32px); height: clamp(24px, 3.2vw, 32px); object-fit: contain; flex-shrink: 0; }
.album-rewards b { font-size: clamp(12px, 1.6vw, 17px); white-space: nowrap; }
.album-reward-coins, .album-reward-speed {
  color: var(--reward-neon);
  -webkit-text-stroke: 3px #000;
  paint-order: stroke fill;
  text-shadow: 0 0 3px color-mix(in srgb, var(--reward-neon) 40%, transparent);
}
.album-reward-coins { --reward-neon: #ffed70; }
.album-reward-speed { --reward-neon: #9beaff; }
.album-claim { width: 100%; min-height: 47px; margin-top: 8px; padding: 8px; border: 3px solid #153e2d; border-radius: 10px; color: #103326; background: linear-gradient(#b6ff76, #48d340); font-size: 16px; box-shadow: inset 0 3px #e3ffbba6, 0 3px #143d2b; }
.album-claim:enabled:hover, .album-page-reward button:enabled:hover { filter: brightness(1.08); }
.album-claim:enabled:active { transform: translateY(2px); box-shadow: none; }
.album-claim:disabled { color: #516779; background: #d7e2ea; border-color: #91a3b0; box-shadow: none; }
.album-claim:enabled { color: #fff; -webkit-text-stroke: 3px #103326; paint-order: stroke fill; }
.is-found:not(.is-collected) .album-sticker-status,
.album-claim:enabled,
.album-page-reward button:enabled {
  position: relative;
  animation: album-claim-bob 2.6s ease-in-out infinite;
  transition: transform 140ms ease, filter 140ms ease;
}
.is-found:not(.is-collected) .album-sticker-status::after,
.album-claim:enabled::after,
.album-page-reward button:enabled::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(110deg, transparent 35%, #fff8 48%, transparent 61%);
  background-size: 300% 100%;
  animation: album-claim-shine 3.8s ease-in-out infinite;
}
.album-sticker.is-found:not(.is-collected):is(:hover, :focus-visible) .album-sticker-status,
.album-claim:enabled:is(:hover, :focus-visible),
.album-page-reward button:enabled:is(:hover, :focus-visible) {
  animation: none; transform: translateY(-2px) scale(1.05); filter: brightness(1.12);
}
.album-sticker.is-found:not(.is-collected):active .album-sticker-status,
.album-claim:enabled:active,
.album-page-reward button:enabled:active {
  animation: none; transform: translateY(2px) scale(.95); filter: brightness(1.02);
}
@keyframes album-claim-bob {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-2px) scale(1.025); }
}
@keyframes album-claim-shine {
  0%, 60% { background-position: 150% 0; opacity: 0; }
  65% { opacity: .8; }
  90%, 100% { background-position: -50% 0; opacity: 0; }
}
.album-confetti-layer { position: absolute; inset: 0; z-index: 20; overflow: hidden; pointer-events: none; border-radius: inherit; }
.album-confetti-layer i { position: absolute; top: 50%; left: 50%; box-shadow: 0 1px 2px #0003; }
.album-total {
  flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 2px;
  margin-left: auto; padding: 2px 6px; border: 3px solid #102d50; border-radius: 9px;
  background: linear-gradient(145deg, #22598e, #12395f); color: white;
  box-shadow: inset 0 2px 0 #a2edff66, 0 3px 0 #0b2745;
  transform: translateX(-20px);
}
.album-total b { font-size: 18px; line-height: 1; color: #fff; -webkit-text-stroke: 3.5px #000; paint-order: stroke fill; transform: translate(-3px, 5px); }
.album-total span { font: 900 13px/1.15 GameHeavy, Arial, sans-serif; color: #fff; -webkit-text-stroke: 4px #000; paint-order: stroke fill; text-align: center; transform: translateY(2px); }
/* Announce reward claims without restoring the removed bottom bar. */
.album-announcement { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.album-discovery-toast { z-index: 200; white-space: normal; line-height: 1.25; }
.album-discovery-toast[hidden] { display: none; }
.album-discovery-punctuation { display: inline-block; margin-left: -0.24em; }
#placementMessage .placement-message-full { color: #ff4545; }
@media (min-width: 761px) {
  .album-page .album-scene { padding-block: 8px; }
  .album-page-heading { margin-bottom: 8px; }
  .album-details { align-self: stretch; min-height: 0; contain: size; }
  .album-feature { display: flex; flex-direction: column; flex: 1; min-height: 0; }
  .album-feature > :not(.album-model-preview) { flex-shrink: 0; }
  .album-feature .album-rarity { align-self: center; }
  .album-model-preview { flex: 0 1 auto; }
  .album-details > .album-reward-box, .album-details > .album-claim { flex-shrink: 0; }
}
@media (max-width: 950px) {
.album-layout { grid-template-columns: 144px minmax(0, 1fr); }
  .album-body { grid-template-columns: minmax(0, 1fr) 228px; gap: 10px; padding: 10px; }
  .album-tab { padding: 12px 8px; }
  .album-tab strong { font-size: 21px; }
  .album-sticker-art { height: 92px; }
  .album-scene { padding: 12px; }
  .album-sticker-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 10px; }
  .album-rewards b { font-size: 14px; }
}
@media (max-width: 760px) {
  .album-layout { grid-template-columns: 132px minmax(0, 1fr); }
  .album-body { grid-template-columns: minmax(0, 1fr); }
  .album-tabs { gap: 9px; padding: 3px; }
  .album-tab { flex: 1; min-height: 94px; padding: 8px 10px; gap: 5px; }
  .album-tab span { font-size: 10px; }
  .album-tab i { height: 10px; }
  .album-header { min-height: 76px; }
  .album-header > img { width: 52px; height: 52px; }
  .album-header h2 { font-size: 29px; }
  .album-sticker strong { font-size: var(--fitted-name-size, 16px); }
  .album-sticker-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .album-page-reward { grid-template-columns: 1fr; padding: 3px 14px; }
  .album-page-reward button { width: 100%; }
  .album-page-heading h3 { font-size: 25px; }
  .album-total { padding: 2px 5px; }
  .album-total b { font-size: 16px; }
}
@media (max-width: 560px) {
  .animal-album { width: calc(100vw - 16px); height: auto; max-height: min(720px, calc(100dvh - 16px)); border-width: 3px; border-radius: 18px; }
  .album-scroll-content { padding-right: 18px; }
  .animal-album .album-scrollbar { right: 3px; width: 12px; }
  .album-body { grid-template-columns: 1fr; }
  .album-layout { grid-template-columns: 104px minmax(0, 1fr); }
  .album-biome-scroll { padding: 10px 9px 10px 4px; }
  .album-sticker-grid { grid-template-columns: minmax(0, 1fr); }
  .album-header { padding: 8px; gap: 7px; }
  .album-header h2 { font-size: clamp(17px, 4.7vw, 24px); -webkit-text-stroke-width: 3px; }
  .album-header p { display: none; }
  .album-header > img { width: 32px; height: 40px; }
  .album-close { flex-basis: 32px; width: 32px; height: 32px; }
  .album-total { max-width: 94px; padding: 2px 4px; border-width: 2px; border-radius: 7px; }
  .album-total b { font-size: 14px; -webkit-text-stroke-width: 3px; }
  .album-total span { font-size: 10px; -webkit-text-stroke-width: 3px; }
  .album-scene { min-height: 335px; padding: 10px; }
  .album-sticker-art { height: 96px; }
  .album-tab { padding: 6px 4px; }
  .album-tab strong { font-size: 14px; }
  .album-tab span { font-size: 9px; padding: 2px 3px; }
  .album-page-heading { margin-bottom: 13px; }
  .album-details { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px 10px; }
  .album-details .album-reward-box { margin-top: 0; }
  .album-feature { grid-row: auto; padding: 5px; }
  .album-feature h3 { font-size: var(--fitted-name-size, 20px); -webkit-text-stroke-width: 3px; }
  .album-feature p { font-size: 13px; }
  .album-feature .album-rarity { font-size: 18px; padding: 3px 8px; }
  .album-found-date { min-height: 0; padding: 0; font-size: 11px; }
  .album-reward-box { padding: 6px; }
  .album-reward-box h4 { font-size: 12px; }
  .album-rewards { gap: 3px; margin-top: 5px; }
  .album-rewards > span { gap: 2px; padding: 3px; }
  .album-rewards img { width: 24px; height: 24px; }
  .album-rewards b { font-size: 13px; }
  .album-claim { margin: 0; min-height: 44px; font-size: 13px; }
}
@media (max-width: 400px) {
  .album-details { grid-template-columns: 1fr; }
  .album-feature { grid-row: auto; }
}
@media (max-height: 570px) and (min-width: 561px) {
  .animal-album { max-height: calc(100dvh - 12px); }
  .album-header { min-height: 62px; padding-block: 5px; }
  .album-header > img { width: 46px; height: 46px; }
  .album-header h2 { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .animal-album *, .animal-album *::before, .animal-album *::after, .album-discovery-toast { transition: none !important; animation: none !important; }
  .album-sticker-status::after, .album-claim::after, .album-page-reward button::after { display: none; }
}

.album-model-preview.is-rotatable { cursor: grab; touch-action: pan-y; user-select: none; }
.album-model-preview.is-rotatable canvas { pointer-events: auto; }
.album-model-preview.is-dragging { cursor: grabbing; }
.album-model-preview.is-rotatable:focus-visible { outline: 2px solid #225dac; outline-offset: -3px; }

/* Let the card/reward content set the book height; the biome list scrolls alone. */
.animal-album {position:fixed;inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;}
.album-body {align-items:start;}
.album-page {align-self:start;}
.album-scroll-content {height:100%;}

:where(html.has-touch-controls) #animalAlbumButton .album-launcher-label { font-size: 6px; }

.album-header-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; flex: 0 0 auto; }
.album-header-actions .album-total { margin-left: 0; transform: none; }
.album-header-actions > .album-total,
.album-header-actions > .album-claim-all { box-sizing: border-box; height: 48px; min-height: 48px; }
.album-claim-all {
  position: relative; left: -8px;
  display: flex; align-items: center; justify-content: center; gap: 5px;
  flex-shrink: 0; padding: 2px 5px 2px 10px;
  border: 3px solid #123c19; border-radius: 12px;
  background: linear-gradient(#aeff64, #40dc45 55%, #19ad32);
  box-shadow: inset 0 3px #eaffaf99, 0 3px #103c1c;
  color: white; cursor: pointer;
}
.album-claim-all span { transform: translate(-2px, 2px); white-space: nowrap; font: 900 18px/1.05 GameHeavy, Arial, sans-serif; -webkit-text-stroke: 3px #000; paint-order: stroke fill; }
.album-claim-all img { flex: 0 0 38px; width: 38px; height: 38px; object-fit: contain; transform: translateY(2px) scale(1.15); }
.album-claim-all:enabled:hover { filter: brightness(1.12); }
.album-claim-all:enabled:active { transform: translateY(2px); }
.album-claim-all:disabled { opacity: .6; cursor: default; }
@media (max-width: 760px) {
  .album-header { flex-wrap: wrap; }
  .album-title-copy { flex: 1; }
  .album-header-actions { order: 1; width: 100%; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  .album-claim-all span { font-size: 15px; -webkit-text-stroke-width: 2.5px; }
  .album-claim-all img { flex-basis: 36px; width: 36px; height: 36px; }
}

/* Keep the book bounded and scroll its pages, without stretching the preview. */
.animal-album {box-sizing:border-box;}
.album-layout,.album-scroll-shell {min-height:0;min-width:0;}
.album-model-preview {aspect-ratio:1;height:auto;min-height:0;max-height:240px;flex:none;}
.album-model-preview canvas {object-fit:contain;}
@media (max-width:950px), (max-height:650px) {
  .animal-album {height:min(680px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);}
  .album-details {contain:none;align-self:start;}
  .album-layout {grid-template-columns:156px minmax(0,1fr);}
  .album-body {grid-template-columns:minmax(0,1fr);}
  .album-sticker-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
  .album-sticker-art {height:90px;}
  .album-details {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;}
  .album-feature {grid-row:span 2;}
  .album-model-preview {width:100%;max-width:200px;margin-inline:auto;}
  .album-header {min-height:60px;gap:8px;padding:7px 10px;}
  .album-header > img {width:36px;height:40px;}
  .album-header h2 {font-size:24px;}
  .album-header-actions {gap:8px;}
  .album-tab {min-height:78px;padding:6px;}
  .album-tab strong {font-size:16px;}
}
@media (max-width:560px) {
  .album-layout {grid-template-columns:116px minmax(0,1fr);}
  .album-body {padding:6px;gap:8px;}
  .album-scene {padding:7px;min-height:0;}
  .album-sticker-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 5px;}
  .album-sticker-art {height:72px;}
  .album-tab strong {font-size:12px;}
  .album-tab span {font-size:9px;}
  .album-header h2 {font-size:20px;}
  .album-header-actions {justify-content:center;}
  .album-header-actions > .album-total,.album-header-actions > .album-claim-all {height:40px;min-height:40px;}
  .album-details {grid-template-columns:minmax(0,1fr);}
  .album-feature {grid-row:auto;}
  .album-page-heading {flex-wrap:wrap;gap:5px;}
  .album-page-heading h3 {font-size:20px;}
  .album-page-reward {padding:6px;}
}

@media (max-width:950px), (max-height:650px) {
  .album-biome-scroll {padding:8px 18px 8px 4px;}
  .album-tab {padding:6px;}
  .album-tab strong {font-size:13px;overflow-wrap:normal;}
  .album-tab[data-page="sky-kingdom"] strong,.album-tab[data-page="crystal-caverns"] strong {font-size:11px;}
}
@media (max-width:560px) {.album-tab strong {font-size:11px;}}
@media (max-width:360px) {
  .album-sticker-grid {grid-template-columns:minmax(0,1fr);}
}
@media (min-width:361px) and (max-width:560px) {
  .album-sticker-status .album-card-rarity {font-size:12px;}
}
