#bestiary-panel .game-window{width:min(1080px,94vw);max-height:90dvh;overflow:auto;overflow-anchor:none;overscroll-behavior:contain;background:radial-gradient(ellipse at 50% 0,#39244188,transparent 70%),linear-gradient(130deg,#23182f,#100d18);scrollbar-color:#9d784b #1b1325}
#bestiary-panel .game-content{min-height:0;overflow:visible}
#bestiary-panel .be-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 4px 12px}
#bestiary-panel .be-intro span{font:12px/18px Txt,sans-serif;letter-spacing:1.3px;color:#d6af68}
#bestiary-panel .be-intro p{margin:3px 0;color:#b7a9c5;font:12px/17px Txt,sans-serif}
#bestiary-panel .be-collection{min-width:200px;text-align:right}
#bestiary-panel .be-collection strong{display:block;color:#f7d77a;font:13px/18px Txt,sans-serif;margin-bottom:3px}
#bestiary-panel .be-collection progress{width:100%;height:8px;accent-color:#f3c466}
#bestiary-panel .be-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:12px 0 18px}
#bestiary-panel .be-tools nav{display:flex;gap:7px;flex-wrap:wrap}
#bestiary-panel .be-tools nav button{margin:0;min-height:35px;font:12px/16px Txt,sans-serif;padding:7px 13px}
#bestiary-panel .be-tools nav button[aria-pressed=true]{border-color:#f7d77a;color:#ffe9ab;background:#49352b;box-shadow:inset 0 0 14px #e7b65822}
#bestiary-panel .be-search{display:flex;gap:8px;flex:1;min-width:270px}
#bestiary-panel .be-search input{flex:1;min-width:0}
#bestiary-panel .be-search input,#bestiary-panel .be-search select{padding:8px;background:#100c1a;color:#e3dcef;border:1px solid #655375;font:12px/18px Txt,sans-serif;min-height:36px}
#bestiary-panel .be-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(166px,1fr));gap:18px 12px;padding:5px 5px 12px;align-items:stretch}
#bestiary-panel .be-card{--accent:#dcba70;--dark:#6b422b;position:relative;isolation:isolate;min-width:0;display:flex;flex-direction:column;padding:10px;background:linear-gradient(135deg,#503327,#211520 24%,#160f1d 75%,#644626);border-radius:13px;box-shadow:0 8px 15px #0008,0 1px 0 #efc57844,inset 0 0 14px #000;transition:transform .18s ease,box-shadow .2s ease;transform:perspective(850px) rotateX(0) rotateY(0);transform-origin:50% 75%;will-change:auto}
#bestiary-panel .be-card::before{content:'';position:absolute;inset:0;border:17px solid transparent;border-image:url('/client/assets/bestiary/frame.svg') 30 stretch;pointer-events:none;z-index:3;filter:brightness(.76) saturate(.7)}
#bestiary-panel .be-card::after{content:'';position:absolute;inset:5px;border-radius:8px;box-shadow:inset 0 0 0 1px #eacb7b66;pointer-events:none;z-index:2}
#bestiary-panel .be-elite{--accent:#eea294;--dark:#672b40;background:linear-gradient(135deg,#6a3643,#23121f 24%,#1a0e1b 75%,#6c303a)}
#bestiary-panel .be-boss{--accent:#d7a2ff;--dark:#623184;background:linear-gradient(135deg,#714991,#26132d 24%,#180c25 75%,#613585)}
#bestiary-panel .be-boss::after{box-shadow:inset 0 0 0 2px #ab65cb99,inset 0 0 13px #aa58d333}
#bestiary-panel .be-ready{box-shadow:0 6px 18px #000a,0 0 0 1px #ecc96b88,inset 0 0 18px #cf9b4c22}
#bestiary-panel .be-ready::before{filter:brightness(1.1) saturate(1.05)}
#bestiary-panel .be-card-head{position:relative;text-align:center;min-height:84px;padding:21px 4px 6px;box-sizing:border-box;background:linear-gradient(#20131ef2,#241323ee);border-bottom:1px solid var(--dark);z-index:1}
#bestiary-panel .be-card-head h3{display:flex;justify-content:center;align-items:center;min-height:34px;margin:0;color:#f8e7c1;font:16px/17px Txt,sans-serif;text-shadow:1px 2px #0c0713}
#bestiary-panel .be-card-head small{color:var(--accent);font:11px/16px Txt,sans-serif;letter-spacing:1px}
#bestiary-panel .be-crest{position:absolute;display:grid;place-items:center;width:32px;height:32px;left:50%;top:-18px;transform:translateX(-50%);border:2px solid var(--accent);outline:2px solid #2a1623;border-radius:50%;background:radial-gradient(#4f3042,#190e1b);box-shadow:0 0 0 3px #a56d3e,0 3px 7px #000;z-index:4}
#bestiary-panel .be-crest svg{width:21px;height:21px}
#bestiary-panel .be-card-art{position:relative;height:176px;display:grid;place-items:center;isolation:isolate;background:#221b25;overflow:hidden;border-inline:1px solid var(--dark)}
#bestiary-panel .be-card-art::before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#0c0a1820,#0c0a1800 40%,#160d20bb),url('/client/assets/bestiary/biomes.png');background-size:100% 100%,300% 200%;background-position:center,0% 0%;image-rendering:pixelated}
#bestiary-panel [data-biome=swamp]::before{background-position:center,50% 0%}
#bestiary-panel [data-biome=snow]::before{background-position:center,100% 0%}
#bestiary-panel [data-biome=desert]::before{background-position:center,0% 100%}
#bestiary-panel [data-biome=inferno]::before{background-position:center,50% 100%}
#bestiary-panel [data-biome=dungeon]::before{background-position:center,100% 100%}
#bestiary-panel .be-card-art::after{content:'';position:absolute;bottom:21px;left:20%;width:60%;height:16px;border-radius:50%;background:#05020a80;z-index:0;filter:blur(2px)}
#bestiary-panel .be-card-art canvas{position:relative;width:100%;height:100%;max-width:180px;object-fit:contain;image-rendering:pixelated;z-index:1;filter:drop-shadow(0 3px 1px #000a)}
#bestiary-panel .be-card-copy{position:relative;padding:6px 4px;text-align:center;background:linear-gradient(#241726f5,#1b1223);border-top:1px solid var(--dark);min-height:64px;box-sizing:border-box}
#bestiary-panel .be-card-copy p{margin:0 0 4px;color:#d2c3db;font:11px/15px Txt,sans-serif;min-height:15px}
#bestiary-panel .be-card-copy b{display:block;color:#efce83;font:12px/16px Txt,sans-serif}
#bestiary-panel .be-card-copy small{display:block;color:#a798b4;font:10px/14px Txt,sans-serif}
#bestiary-panel .be-card-foot{position:relative;display:flex;align-items:center;justify-content:center;min-height:46px;margin-top:auto;padding:2px 3px 3px;z-index:4}
#bestiary-panel .be-card-foot button{position:relative;display:flex;align-items:center;justify-content:center;gap:5px;width:100%;margin:0;padding:5px 3px;border:2px solid #f2cc6c;border-image:none;border-radius:4px;background:linear-gradient(#ffe8a1,#efbd55 50%,#c78c32);box-shadow:inset 0 0 0 1px #9b5d27,0 2px 3px #0009;color:#2d180e;text-shadow:none;font:10px/12px Txt,sans-serif;min-height:37px;touch-action:manipulation;cursor:pointer}
#bestiary-panel .be-card-foot button span{display:block}
#bestiary-panel .be-card-foot button b{font-weight:bold}
#bestiary-panel .be-card-foot button svg{width:23px;height:23px;flex:0 0 23px}
#bestiary-panel .be-card-foot button:disabled{cursor:wait;filter:saturate(.5);opacity:.75}
#bestiary-panel .be-card-foot button:focus-visible{outline:2px solid white;outline-offset:3px}
#bestiary-panel .be-status{display:grid;place-items:center;min-height:30px;width:100%;font:10px/13px Txt,sans-serif;color:#9987a7;text-align:center;padding:3px;background:#261b2b;border:1px solid #65516b;border-radius:3px}
#bestiary-panel .be-received{color:#abc78f;background:#221e26;border-color:#504d42}
#bestiary-panel .be-card.locked{--accent:#93809e;--dark:#44344d;background:linear-gradient(135deg,#433149,#201627 24%,#150e1e 75%,#413148)}
#bestiary-panel .be-card.locked::before{filter:grayscale(1) brightness(.65)}
#bestiary-panel .be-card.locked .be-card-head{background:#201726}
#bestiary-panel .be-card.locked h3{color:#a99bb8}
#bestiary-panel .be-card.locked .be-card-art::before{filter:grayscale(1) brightness(.24)}
#bestiary-panel .be-card.locked canvas{filter:brightness(.04) drop-shadow(0 0 2px #d0b3df33)}
#bestiary-panel .be-card.locked .be-card-copy b{color:#bbaacb}
#bestiary-panel .be-card.locked .be-crest{box-shadow:0 0 0 3px #59445f,0 3px 7px #000}
#bestiary-panel .be-lock{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);width:32px;height:32px;z-index:2;padding:5px;border:1px solid #9d83b2;border-radius:50%;background:#201526e8}
#bestiary-panel .be-lock svg{width:100%;height:100%}
#bestiary-panel .be-milestones{color:#cbb991;font:12px/17px Txt,sans-serif;margin:0 0 9px}
#bestiary-panel .be-milestones summary{cursor:pointer;touch-action:manipulation;padding:3px 2px}
#bestiary-panel .be-milestones details>div{display:flex;gap:8px;flex-wrap:wrap;padding:6px 0}
#bestiary-panel .be-milestones button{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:1;min-width:145px;min-height:40px;margin:0;padding:5px 9px;background:#38273c;border:1px solid #c09b5f;border-image:none;font:12px/16px Txt,sans-serif;color:#ffe1a2}
#bestiary-panel .be-milestones button:disabled{color:#aa99b5;background:#211827;border-color:#65516b;opacity:1;cursor:default}
#bestiary-panel .be-milestones b{display:flex;align-items:center;gap:3px;font-weight:normal;white-space:nowrap}
#bestiary-panel .be-milestones svg{width:17px;height:17px}
#bestiary-panel .be-note{font:11px/16px Txt,sans-serif;color:#a99bb5;padding:10px 3px;margin:0}
#bestiary-panel .be-feedback{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;padding:0;margin:0;border:0}
#bestiary-panel .be-empty{color:#c4bccf;grid-column:1/-1}
#bestiary-panel .be-rivals{margin:0 0 10px;padding:7px 10px;border:1px solid #8d654b;background:#2b1625aa;font:12px/18px Txt,sans-serif}
#bestiary-panel .be-rivals summary{cursor:pointer;color:#edc777;font-weight:bold;touch-action:manipulation}
#bestiary-panel .be-rival-active{display:flex;gap:12px;margin-top:10px}
#bestiary-panel .be-rival-active canvas{width:80px;height:80px;image-rendering:pixelated;flex:0 0 80px;align-self:flex-start;background:#27182f;border:1px solid #896253}
#bestiary-panel .be-rival-active strong{font:17px/21px Txt,sans-serif;color:#f5cf91}
#bestiary-panel .be-rival-active p{margin:4px 0}
#bestiary-panel .be-rival-active small{display:block;color:#bca4bc}
#bestiary-panel .be-rival-weak{color:#a9d5b2}
#bestiary-panel .be-rival-history{margin-top:9px}
#bestiary-panel .be-rival-history p{padding:5px;border-bottom:1px solid #654553}
@media(hover:hover) and (pointer:fine){#bestiary-panel .be-card:hover,#bestiary-panel .be-card:focus-within{z-index:5;transform:perspective(850px) translateY(-7px) rotateX(var(--rx,1deg)) rotateY(var(--ry,-1.5deg));box-shadow:0 12px 22px #000a,0 0 15px #eac56b44}#bestiary-panel .be-ready:hover::before,#bestiary-panel .be-ready:focus-within::before{filter:brightness(1.45);animation:be-edge-glow 1.8s ease-in-out infinite}#bestiary-panel .be-card-foot button:hover{background:linear-gradient(#fff4cd,#ffd674 60%,#e4a242)}}
#bestiary-panel .be-claimed-flash{animation:be-card-claim .9s ease-out both}
#bestiary-panel .be-discovered{animation:be-card-reveal .65s ease-out both}
.be-celebration{position:fixed;inset:0;z-index:2147000000;pointer-events:none!important;isolation:isolate;contain:layout style;overflow:hidden}
.be-celebration *{pointer-events:none!important}
.be-reward-float{position:absolute;left:50%;top:10px;white-space:nowrap;font:20px/26px Pix,monospace;color:#ffe9a3;text-shadow:0 2px #4b2c20,0 0 9px #f3c15c;animation:be-reward-label 1.3s ease-out both}
.be-particle{position:absolute;display:block;opacity:0;animation:be-particle-flight 1.1s var(--delay) ease-out both;will-change:transform,opacity}
.be-bone{width:20px;height:20px;filter:drop-shadow(0 0 3px #ffdf78)}.be-bone svg{width:100%;height:100%}
.be-spark{width:5px;height:5px;background:#ffdf7e;box-shadow:0 0 5px #ffd77b}
.be-flying-bone{left:0;top:0;animation:none;will-change:transform,opacity}
.be-wallet-glint{position:absolute;width:34px;height:34px;margin:-17px;border:2px solid #ffe2a1;border-radius:50%;box-sizing:border-box;box-shadow:0 0 13px #ffdc8b,inset 0 0 8px #ffdc8b;animation:be-wallet-glint .35s ease-out both}
.be-wallet-receiver{position:absolute;left:0;top:0;display:flex;align-items:center;gap:7px;min-width:105px;padding:4px 7px;border:2px solid #dfbc73;border-radius:4px;background:#171020f5;color:#fff0c0;font:16px/22px Pix,monospace;box-sizing:border-box;box-shadow:0 0 10px #d4a65350}
.be-wallet-receiver[hidden]{display:none}.be-wallet-receiver svg{width:22px;height:22px}
#wallet.be-wallet-collected{animation:be-wallet-pulse .5s ease-out}
@keyframes be-wallet-glint{from{opacity:1;transform:scale(.5)}to{opacity:0;transform:scale(1.8)}}
@keyframes be-wallet-pulse{25%{filter:brightness(1.75);box-shadow:0 0 14px #ffe2a1}100%{filter:brightness(1)}}
.be-reduced .be-reward-float{animation:none;transform:translateX(-50%);font-size:16px}.be-reduced .be-wallet-glint{animation:none;opacity:.65;box-shadow:0 0 5px #ffdc8b}
@keyframes be-edge-glow{50%{filter:brightness(1.1)}}
@keyframes be-card-claim{0%,25%{box-shadow:0 0 23px #ffdf7c,0 0 0 2px #ffe4a4}100%{box-shadow:0 8px 15px #0008}}
@keyframes be-card-reveal{from{transform:perspective(800px) rotateY(65deg);opacity:.2}to{transform:perspective(800px) rotateY(0);opacity:1}}
@keyframes be-reward-label{0%{opacity:0;transform:translate(-50%,10px) scale(.9)}15%,65%{opacity:1;transform:translate(-50%,-8px) scale(1)}100%{opacity:0;transform:translate(-50%,-25px)}}
@keyframes be-particle-flight{0%{opacity:0;transform:translate(0,15px) scale(.4)}12%{opacity:1}75%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--spin)) scale(.7)}}
html.touch-device #bestiary-panel .game-window{width:calc(var(--mobile-vw) - 20px)!important;max-height:calc(var(--mobile-vh) - 20px)!important;zoom:1!important;padding:12px}
html.touch-device #bestiary-panel .be-grid{grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:17px 10px;padding-inline:2px}
html.touch-device #bestiary-panel .be-card-head h3{font-size:15px;line-height:17px}
html.touch-device #bestiary-panel .be-card-head{min-height:81px}
html.touch-device #bestiary-panel .be-card-art{height:156px}
html.touch-device #bestiary-panel .be-card-foot button{min-height:42px}
html.touch-device #bestiary-panel .be-tools{gap:9px;margin-bottom:15px}
html.touch-device #bestiary-panel .be-tools nav button{min-height:36px;padding:6px 10px}
html.touch-device #bestiary-panel .be-search{min-width:0;flex-basis:100%}
html.touch-device #bestiary-panel .be-search select{max-width:46%}
html.touch-device #bestiary-panel .be-intro{gap:8px;flex-wrap:wrap;padding-bottom:7px}
html.touch-device #bestiary-panel .be-intro p{display:none}
html.touch-device #bestiary-panel .be-collection{min-width:160px;flex:1}
html.touch-device #bestiary-panel .be-card-copy small{font-size:11px}
html.touch-device #bestiary-panel .be-card-foot button span{font-size:11px;line-height:13px}
@media(max-height:500px){html.touch-device #bestiary-panel .game-window{padding:8px}html.touch-device #bestiary-panel .game-window>header{padding-bottom:5px;margin-bottom:5px;gap:8px}html.touch-device #bestiary-panel h2{font-size:20px}html.touch-device #bestiary-panel .game-window>header button{margin:0;padding:4px 8px;min-height:32px}html.touch-device #bestiary-panel .be-tools{flex-wrap:nowrap}html.touch-device #bestiary-panel .be-search{flex-basis:auto}html.touch-device #bestiary-panel .be-tools nav{gap:4px;flex-wrap:nowrap}html.touch-device #bestiary-panel .be-tools nav button{padding:5px 8px;font-size:11px;min-height:32px}html.touch-device #bestiary-panel .be-search input,html.touch-device #bestiary-panel .be-search select{padding:5px;font-size:11px;min-height:32px}html.touch-device #bestiary-panel .be-card-art{height:144px}}
@media(max-width:370px){html.touch-device #bestiary-panel .be-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 8px}html.touch-device #bestiary-panel .be-card{padding:9px}html.touch-device #bestiary-panel .be-card-head h3{font-size:14px}html.touch-device #bestiary-panel .be-card-foot button{gap:2px}html.touch-device #bestiary-panel .be-card-foot button svg{width:19px;flex-basis:19px}html.touch-device #bestiary-panel .be-card-foot button b{display:block}}
@media(max-height:500px){html.touch-device #bestiary-panel .be-intro{padding:0 2px 4px;min-height:18px}html.touch-device #bestiary-panel .be-intro>div:first-child{display:none}html.touch-device #bestiary-panel .be-collection{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0}html.touch-device #bestiary-panel .be-collection strong{font-size:11px;line-height:16px;margin:0;white-space:nowrap}html.touch-device #bestiary-panel .be-collection progress{width:125px;height:6px}html.touch-device #bestiary-panel .be-milestones{margin-bottom:4px;font-size:11px;line-height:15px}html.touch-device #bestiary-panel .be-milestones summary{padding-block:2px}html.touch-device #bestiary-panel .be-rivals{padding:4px 8px;margin-bottom:5px;font-size:11px;line-height:16px}html.touch-device #bestiary-panel .be-tools{gap:6px;margin:4px 0 13px}html.touch-device #bestiary-panel .be-search select{max-width:48%;width:90px}html.touch-device #bestiary-panel .be-grid{padding-top:5px}}
@media(prefers-reduced-motion:reduce){#bestiary-panel .be-card,#bestiary-panel .be-card::before,#bestiary-panel .be-card::after,#bestiary-panel .be-card-art canvas{transition:none!important;animation:none!important;transform:none!important}.be-particle{display:none}.be-reward-float{animation:none;transform:translateX(-50%)}#wallet.be-wallet-collected{animation:none}}
@media(max-height:350px){html.touch-device #bestiary-panel .be-card-head{padding:10px 4px 4px;min-height:60px}html.touch-device #bestiary-panel .be-card-head h3{font-size:14px;line-height:15px;min-height:30px}html.touch-device #bestiary-panel .be-card-art{height:98px}html.touch-device #bestiary-panel .be-card-copy{padding:4px;min-height:52px}html.touch-device #bestiary-panel .be-card-copy p{font-size:11px;line-height:13px;min-height:13px;margin-bottom:2px}html.touch-device #bestiary-panel .be-card-copy b{font-size:11px;line-height:14px}html.touch-device #bestiary-panel .be-card-copy small{font-size:10px;line-height:12px}}