:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#111816;--panel:#121c18c2;--panel-solid:#19251f;--text:#f7eedc;--muted:#bdc6b2;--line:#f0e2be33;--gold:#f1d38c;--amber:#f0c76d;--cr:#f45f62;--en:#efad56;--vu:#e8d98a;--nt:#b7c57a;--lc:#d9d4be;font-family:Times New Roman,Songti SC,SimSun,PingFang SC,Microsoft YaHei,serif}*{box-sizing:border-box}html,body{background:var(--bg);width:100%;min-height:100%;color:var(--text);margin:0;overflow:hidden}button,input,select{font:inherit}button{cursor:pointer}.app-shell,.globe-stage{width:100%;min-height:100vh}.globe-stage{background:linear-gradient(#23525885 0%,#41483257 46%,#111816f5 100%),radial-gradient(circle at 18% 18%,#f5ce7b5c,#0000 22rem),radial-gradient(circle at 82% 28%,#60a08c42,#0000 24rem),radial-gradient(circle at 50% 52%,#d2ba7424,#0000 32rem),linear-gradient(135deg,#243f41 0%,#2d3b2d 42%,#171d18 100%);position:relative;overflow:hidden}.globe-stage:before{content:"";z-index:1;pointer-events:none;background:linear-gradient(90deg,#08100e94,#0000 18% 82%,#08100e94),linear-gradient(#ffe7a81a,#0000 26%),radial-gradient(circle at 50% 48%,#0000 0 31rem,#080e0c6b 47rem);position:absolute;inset:0}.globe-stage:after{content:"";z-index:2;pointer-events:none;opacity:.16;mix-blend-mode:screen;background-image:linear-gradient(#ffffff0b 1px,#0000 1px),linear-gradient(90deg,#ffffff0b 1px,#0000 1px);background-size:34px 34px;position:absolute;inset:0}#globeCanvas,.marker-layer{width:100%;height:100%;position:absolute;inset:0}#globeCanvas{z-index:3}.marker-layer{z-index:4;pointer-events:none}.topbar{z-index:10;pointer-events:none;text-align:left;justify-content:flex-start;align-items:flex-start;gap:18px;width:min(520px,100vw - 520px);display:flex;position:absolute;top:28px;left:30px;transform:none}.eyebrow{color:#b6a875;letter-spacing:0;text-transform:uppercase;margin:0 0 6px;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-size:.72rem;font-weight:700}h1,h2,p{margin-top:0}h1{color:#f6ebd0eb;text-shadow:0 0 24px #d6c58e1f;margin-bottom:0;font-size:clamp(1.45rem,2.45vw,2.6rem);line-height:1.05}.icon-text-button,.audio-button{border:1px solid var(--line);color:var(--text);pointer-events:auto;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#17221db8;border-radius:999px;align-items:center;gap:8px;min-height:40px;padding:0 14px;display:inline-flex;box-shadow:inset 0 1px #ffffff14}.top-actions{pointer-events:auto;gap:8px;display:flex;position:fixed;top:24px;right:26px}.topbar .icon-text-button{position:static}.icon-text-button:hover,.audio-button:hover{background:#3e3926c2;border-color:#f0d18475}.control-panel{z-index:9;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#0f1713c7;border:1px solid #efdeb224;border-radius:12px;width:min(720px,100vw - 36px);padding:12px;position:absolute;bottom:22px;left:50%;transform:translate(-50%);box-shadow:0 18px 60px #00000094}.search-wrap{min-height:38px;color:var(--muted);background:#ffffff0e;border:1px solid #efdeb21f;border-radius:999px;grid-template-columns:24px 1fr;align-items:center;padding:0 12px;font-family:PingFang SC,Microsoft YaHei,sans-serif;display:grid}.search-wrap input{width:100%;min-width:0;color:var(--text);background:0 0;border:0;outline:0}.segmented-control{flex-wrap:wrap;justify-content:center;gap:7px;margin-top:9px;display:flex}.segmented-control button{min-width:62px;min-height:30px;color:var(--muted);background:#ffffff0e;border:1px solid #efdeb221;border-radius:999px;padding:0 12px}.segmented-control button.active{color:#17120a;background:#f0d184eb;border-color:#f0d184eb}.panel-row{grid-template-columns:minmax(120px,180px) 1fr;align-items:center;gap:8px;margin-top:8px;display:grid}select{width:100%;min-height:32px;color:var(--text);background:var(--panel-solid);border:1px solid #efdeb221;border-radius:999px;padding:0 10px}.stats-line{color:var(--muted);justify-content:flex-end;gap:14px;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-size:.78rem;display:flex}.stats-line strong{color:var(--text)}.legend{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-size:.78rem;display:flex}.legend span{align-items:center;gap:5px;display:inline-flex}.legend b,.stats-line em{font-style:normal;font-weight:inherit}.animal-list-panel{z-index:9;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#0d1411db;border:1px solid #efdeb226;border-radius:12px;grid-template-rows:auto auto auto 1fr;gap:10px;width:min(340px,100vw - 52px);padding:12px;font-family:PingFang SC,Microsoft YaHei,sans-serif;display:grid;position:absolute;top:132px;bottom:160px;left:26px;box-shadow:0 22px 70px #00000080}.list-panel-head{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.list-panel-head h2{margin:0;font-size:1.08rem;line-height:1.1}.list-count{min-width:58px;color:var(--gold);text-align:center;background:#ffffff0e;border:1px solid #efdeb224;border-radius:999px;flex:none;padding:5px 9px;font-weight:800}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;display:grid}.summary-grid div{background:#ffffff0d;border:1px solid #efdeb21f;border-radius:8px;min-width:0;padding:8px}.summary-grid strong,.summary-grid span{display:block}.summary-grid strong{color:var(--text);font-size:1rem}.summary-grid span{color:var(--muted);white-space:nowrap;margin-top:2px;font-size:.68rem}.rarity-stats{gap:6px;display:grid}.rarity-stat{color:var(--muted);grid-template-columns:34px 1fr 42px;align-items:center;gap:7px;font-size:.74rem;display:grid}.rarity-stat b{color:var(--text);font-weight:800}.rarity-bar{background:#ffffff14;border-radius:999px;height:7px;overflow:hidden}.rarity-bar i{width:var(--bar-width,0%);border-radius:inherit;background:var(--bar-color,var(--gold));height:100%;display:block}.animal-list{align-content:start;gap:7px;min-height:0;padding-right:10px;display:grid;overflow:hidden auto}.animal-list-item{width:100%;min-height:56px;color:var(--text);text-align:left;background:#ffffff0d;border:1px solid #efdeb21c;border-radius:8px;grid-template-columns:minmax(0,1fr) max-content;align-items:center;gap:8px;padding:8px;display:grid}.animal-list-item>span:first-child{min-width:0;overflow:hidden}.animal-list-item:hover,.animal-list-item.active{background:#524a2c9e;border-color:#f0d18470}.animal-list-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-weight:800;line-height:1.25;display:block;overflow:hidden}.animal-list-meta{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin-top:3px;font-size:.7rem;line-height:1.25;display:block;overflow:hidden}.animal-list-badges{flex:none;justify-self:end;align-items:center;gap:5px;display:inline-flex}.media-badge,.rarity-chip{min-width:24px;height:24px;color:var(--muted);background:#ffffff0e;border:1px solid #efdeb229;border-radius:999px;place-items:center;font-size:.68rem;font-weight:800;display:inline-grid}.media-badge.on{color:#151008;background:#f0d184e0}.rarity-chip{color:#151008;background:var(--chip-color,var(--gold))}.dot{border-radius:50%;width:8px;height:8px;display:inline-block}.cr{background:var(--cr)}.en{background:var(--en)}.vu{background:var(--vu)}.nt{background:var(--nt)}.lc{background:var(--lc)}.animal-marker{width:var(--marker-size,18px);height:var(--marker-size,18px);transform:translate3d(var(--marker-x,-100px), var(--marker-y,-100px), 0) translate(-50%, -50%) rotate(var(--marker-angle,-12deg)) scale(calc(var(--marker-scale,1) * var(--marker-focus,1)));transform-origin:50%;pointer-events:auto;will-change:transform, opacity;background:0 0;border:0;padding:0;transition:opacity .12s,filter .12s;position:absolute;top:0;left:0}.animal-marker img{display:none}.animal-marker:before,.animal-marker:after{content:"";background:var(--marker-color);opacity:.92;clip-path:polygon(0 50%,100% 0,78% 56%,100% 100%);width:70%;height:42%;position:absolute;top:50%}.animal-marker:before{transform-origin:100%;left:5%;transform:translateY(-50%)rotate(-18deg)}.animal-marker:after{transform-origin:0;right:5%;transform:translateY(-50%)scaleX(-1)rotate(-18deg)}.animal-marker:hover,.animal-marker.active{--marker-focus:1.8;z-index:8;filter:drop-shadow(0 0 8px #f0d1848c)}.animal-marker.hidden{opacity:0;pointer-events:none}.animal-marker.dimmed{opacity:.32}.animal-panel{z-index:11;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#0d1411e6;border:1px solid #efdeb229;border-radius:12px;width:min(400px,100vw - 52px);transition:transform .26s;position:absolute;top:92px;bottom:22px;right:26px;overflow:hidden auto;transform:translate(calc(100% + 36px));box-shadow:0 26px 90px #00000094}.animal-panel.open{transform:translate(0)}.close-button{z-index:2;width:34px;height:34px;color:var(--text);background:#0000005c;border:1px solid #efdeb247;border-radius:50%;font-size:1.3rem;line-height:1;position:absolute;top:12px;right:12px}.animal-hero{aspect-ratio:16/10;background:radial-gradient(circle at 25% 18%,#f0d18447,#0000 34%),radial-gradient(circle at 78% 36%,#578f853d,#0000 32%),linear-gradient(135deg,#29413d,#17231e 54%,#0f1412);min-height:210px;position:relative}.animal-hero img{object-fit:cover;filter:saturate(.8)contrast(1.08);width:100%;height:100%;display:block}.animal-hero.image-failed{place-items:center;padding:24px;display:grid}.animal-hero.image-failed img{display:none}.animal-hero.image-failed:before{content:attr(data-fallback);color:#f5ebd0e6;overflow-wrap:anywhere;text-align:center;max-width:100%;font-size:clamp(1.6rem,6vw,2.6rem);font-weight:900}.rarity-badge{background:var(--badge-color);color:#130f08;border-radius:999px;padding:6px 10px;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-size:.82rem;font-weight:800;position:absolute;bottom:16px;left:16px}.animal-content{padding:18px}.animal-content h2{overflow-wrap:anywhere;margin-bottom:4px;font-size:clamp(1.38rem,2vw,1.9rem);line-height:1.04}.scientific{color:var(--muted);margin-bottom:16px;font-style:italic}.summary{color:#ddd2b8;font-family:PingFang SC,Microsoft YaHei,sans-serif;line-height:1.65}.source-link{color:#f0d184;border-bottom:1px solid #f0d18461;margin-top:-4px;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-size:.78rem;text-decoration:none;display:inline-flex}.source-link:hover{color:#ffe5a2;border-bottom-color:currentColor}.source-link[hidden]{display:none}.details-grid{gap:10px;margin:18px 0;font-family:PingFang SC,Microsoft YaHei,sans-serif;display:grid}.details-grid div{border-top:1px solid var(--line);padding-top:10px}.details-grid div[hidden]{display:none}.details-grid dt{color:var(--muted);margin-bottom:4px;font-size:.78rem}.details-grid dd{margin:0;line-height:1.45}.audio-button{color:#130f08;background:#f0d184eb;justify-content:center;width:100%;min-height:46px;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-weight:800}.toast{z-index:12;opacity:0;border:1px solid var(--line);color:var(--text);pointer-events:none;background:#080806e6;border-radius:999px;padding:10px 14px;transition:opacity .18s,transform .18s;position:absolute;bottom:24px;left:50%;transform:translate(-50%,16px)}.toast.show{opacity:1;transform:translate(-50%)}@media (width<=820px){.topbar{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(90deg,#071212ad,#07121242);border-radius:10px;width:calc(100vw - 86px);padding:8px 10px;top:18px;left:50%;right:auto;transform:translate(-50%)}h1{max-width:100%;font-size:1.08rem;line-height:1.08}.eyebrow{font-size:.62rem}.marker-layer{clip-path:inset(92px 0 184px)}.icon-text-button{justify-content:center;width:42px;min-width:42px;padding:0 10px;font-size:0;overflow:hidden}.icon-text-button span{font-size:1rem}.top-actions{display:none}.control-panel{width:calc(100vw - 24px);max-height:40vh;bottom:12px;overflow:auto}.animal-list-panel{width:auto;max-height:31vh;inset:94px 12px auto}.panel-row{grid-template-columns:1fr}.stats-line{grid-template-columns:1fr 1fr;justify-content:stretch;gap:8px;min-width:0;display:grid}.stats-line span{overflow-wrap:anywhere;min-width:0}.segmented-control{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.segmented-control button{width:100%;min-width:0;padding:0 6px}.stats-line{font-size:.72rem}.animal-panel{border-radius:12px 12px 0 0;width:100%;max-height:72vh;inset:auto 0 0;transform:translateY(calc(100% + 20px))}.animal-panel.open{transform:translateY(0)}.animal-hero{min-height:180px}}