:root{--bg-dark: #050508;--bg-panel: rgba(20, 20, 25, .7);--bg-panel-hover: rgba(30, 30, 40, .8);--border-color: rgba(255, 255, 255, .08);--text-primary: #ffffff;--text-secondary: #94a3b8;--text-muted: #64748b;--accent-gradient: linear-gradient(135deg, #6366f1 0%, #a855f7 50%, #ec4899 100%);--accent-glow: rgba(168, 85, 247, .5);--savannah-tint: rgba(255, 165, 0, .15);--jungle-tint: rgba(34, 197, 94, .15);--ocean-tint: rgba(6, 182, 212, .15);--arctic-tint: rgba(147, 197, 253, .15);--font-heading: "Outfit", sans-serif;--font-body: "Plus Jakarta Sans", sans-serif;--radius-sm: 8px;--radius-md: 16px;--radius-lg: 24px;--radius-pill: 9999px;--blur-md: 12px;--shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .5);--transition: all .3s cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-dark);color:var(--text-primary);min-height:100vh;overflow:hidden;line-height:1.5}#app{display:flex;flex-direction:column;height:100vh;position:relative;z-index:1}.bg-gradient-1,.bg-gradient-2{position:fixed;width:600px;height:600px;border-radius:50%;filter:blur(100px);z-index:-1;opacity:.15;animation:float 10s ease-in-out infinite alternate}.bg-gradient-1{background:#6366f1;top:-100px;left:-100px}.bg-gradient-2{background:#ec4899;bottom:-100px;right:-100px;animation-delay:-5s}@keyframes float{0%{transform:translate(0)}to{transform:translate(50px,50px)}}.header{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background:#0a0a0f99;-webkit-backdrop-filter:blur(var(--blur-md));backdrop-filter:blur(var(--blur-md));border-bottom:1px solid var(--border-color);z-index:50}.header-left{display:flex;align-items:center}.icon-btn{background:transparent;border:1px solid var(--border-color);color:var(--text-secondary);border-radius:var(--radius-md);width:40px;height:40px;padding:0;cursor:pointer;transition:var(--transition);display:flex;align-items:center;justify-content:center;font-size:1.2rem}.icon-btn:hover,.icon-btn.active{background:#ffffff1a;color:var(--text-primary);border-color:#fff3}.logo{display:flex;align-items:center;gap:1rem}.logo-icon{font-size:2rem;filter:drop-shadow(0 0 10px rgba(255,255,255,.2))}.logo h1{font-family:var(--font-heading);font-weight:800;font-size:1.5rem;letter-spacing:-.02em;background:linear-gradient(to right,#fff,#94a3b8);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.ai-badge{background:var(--accent-gradient);padding:.25rem .75rem;border-radius:var(--radius-pill);font-size:.75rem;font-weight:700;color:#fff;margin-left:.5rem;box-shadow:0 0 15px var(--accent-glow);vertical-align:middle;-webkit-text-fill-color:white}.biome-nav{display:flex;gap:.75rem;background:#ffffff08;padding:.5rem;border-radius:var(--radius-lg);border:1px solid var(--border-color)}.biome-btn{display:flex;align-items:center;gap:.75rem;padding:.6rem 1.25rem;background:transparent;border:1px solid transparent;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;transition:var(--transition);font-family:var(--font-heading);font-weight:600;font-size:.9rem}.biome-btn:hover{background:#ffffff0d;color:var(--text-primary)}.biome-btn.active{background:#ffffff1a;border-color:#ffffff1a;color:var(--text-primary);box-shadow:0 0 20px #0003}.biome-btn[data-biome=savannah].active{border-bottom:2px solid #ffa500}.biome-btn[data-biome=jungle].active{border-bottom:2px solid #22c55e}.biome-btn[data-biome=ocean].active{border-bottom:2px solid #06b6d4}.biome-btn[data-biome=arctic].active{border-bottom:2px solid #38bdf8}.biome-icon{font-size:1.25rem}.main-content{display:grid;grid-template-columns:auto 1fr auto;flex:1;overflow:hidden;gap:1px}.sidebar{background:var(--bg-panel);-webkit-backdrop-filter:blur(var(--blur-md));backdrop-filter:blur(var(--blur-md));border-right:1px solid var(--border-color);display:flex;flex-direction:column;transition:width .3s cubic-bezier(.4,0,.2,1),min-width .3s ease,opacity .3s ease;overflow:hidden;white-space:nowrap}.sidebar.animal-list-sidebar{width:260px;min-width:260px}.sidebar.collapsed{width:0!important;min-width:0!important;opacity:0;border:none}.sidebar-header{padding:1.5rem;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.sidebar-header h2{font-family:var(--font-heading);font-weight:600;font-size:1rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.animal-count{background:#ffffff1a;padding:.25rem .75rem;border-radius:var(--radius-pill);font-size:.8rem;font-weight:700;color:var(--text-primary)}.animal-list{padding:1rem;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.animal-list-item{display:flex;align-items:center;gap:1rem;padding:.75rem;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);border:1px solid transparent;background:#ffffff05}.animal-list-item:hover{background:var(--bg-panel-hover);transform:translate(4px)}.animal-list-item.active{background:linear-gradient(90deg,rgba(99,102,241,.1),transparent);border-left:3px solid #6366f1}.animal-emoji{font-size:1.5rem;background:#0003;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm)}.animal-name{font-family:var(--font-heading);font-weight:600;color:var(--text-primary)}.animal-species{font-size:.8rem;color:var(--text-muted)}.biome-viewport{position:relative;background:transparent;overflow:hidden}.biome-scene{width:100%;height:100%}.biome-info{position:absolute;top:2rem;left:50%;transform:translate(-50%);z-index:10;pointer-events:none}.biome-label{font-family:var(--font-heading);font-weight:800;font-size:1rem;text-transform:uppercase;letter-spacing:.2em;color:#fffc;background:#0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.75rem 2rem;border-radius:var(--radius-pill);border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 30px #0000004d}.stats-panel{width:320px;min-width:320px;background:var(--bg-panel);-webkit-backdrop-filter:blur(var(--blur-md));backdrop-filter:blur(var(--blur-md));border-left:1px solid var(--border-color);display:flex;flex-direction:column}.stats-header{padding:1.5rem;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.stats-header h2{font-family:var(--font-heading);font-weight:600;font-size:1rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.close-btn{background:none;border:none;color:var(--text-muted);font-size:1.5rem;cursor:pointer;transition:var(--transition)}.close-btn:hover{color:var(--text-primary)}.stats-content{padding:1.5rem;overflow-y:auto;flex:1}.stats-placeholder{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-muted);gap:1rem;text-align:center;opacity:.5}.placeholder-icon{font-size:4rem;margin-bottom:1rem}.stats-card{animation:slideIn .4s cubic-bezier(.2,.8,.2,1)}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.stats-avatar{display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem;background:linear-gradient(180deg,#ffffff0d,#ffffff03);border-radius:var(--radius-lg);border:1px solid var(--border-color);margin-bottom:2rem;position:relative;overflow:hidden}.stats-avatar:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent-gradient)}.stats-emoji{font-size:5rem;margin-bottom:1rem;filter:drop-shadow(0 10px 20px rgba(0,0,0,.3));animation:float 6s ease-in-out infinite}.stats-name{font-family:var(--font-heading);font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:.25rem}.stats-species{font-size:.9rem;color:var(--text-secondary);font-weight:500;letter-spacing:.05em;text-transform:uppercase}.stats-bio{font-size:.7rem;color:#888;margin-top:4px;font-style:italic}.stats-trait{margin-top:1rem;display:inline-block;background:#ffffff1a;padding:.4rem 1rem;border-radius:var(--radius-pill);font-size:.8rem;color:var(--text-primary);border:1px solid rgba(255,255,255,.1)}.stats-section-title{font-family:var(--font-heading);font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--text-muted);margin-bottom:1rem;letter-spacing:.1em}.stat-row{display:flex;align-items:center;margin-bottom:1rem;gap:1rem}.stat-label{width:80px;font-size:.85rem;color:var(--text-secondary);font-weight:500}.stat-bar{flex:1;height:8px;background:#ffffff1a;border-radius:var(--radius-pill);overflow:hidden}.stat-fill{height:100%;border-radius:var(--radius-pill);position:relative}.stat-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff0,#ffffff4d)}.stat-fill.health{background:linear-gradient(90deg,#10b981,#34d399);box-shadow:0 0 10px #34d3994d}.stat-fill.hunger{background:linear-gradient(90deg,#f59e0b,#fbbf24);box-shadow:0 0 10px #fbbf244d}.stat-fill.energy{background:linear-gradient(90deg,#3b82f6,#60a5fa);box-shadow:0 0 10px #60a5fa4d}.stat-fill.happiness{background:linear-gradient(90deg,#ec4899,#f472b6);box-shadow:0 0 10px #f472b64d}.stat-value{width:40px;text-align:right;font-weight:700;font-size:.85rem;color:var(--text-primary)}.behavior-box{background:#ffffff08;padding:1rem;border-radius:var(--radius-md);border:1px solid var(--border-color);margin-top:.5rem}.behavior-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem}.behavior-status{font-size:.95rem;color:var(--text-primary);font-style:italic}.action-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:2rem}.action-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:1rem .5rem;background:#ffffff08;border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;transition:var(--transition)}.action-btn:hover{background:var(--bg-panel-hover);border-color:#fff3;color:var(--text-primary);transform:translateY(-2px)}.action-btn:active{transform:translateY(0) scale(.95)}.action-icon{font-size:1.5rem}.action-label{font-size:.75rem;font-weight:600;text-transform:uppercase}@media(max-width:1024px){.main-content{grid-template-columns:200px 1fr 280px}}@media(max-width:768px){.header{flex-direction:column;gap:1rem;padding:1rem}.biome-nav{width:100%;overflow-x:auto;justify-content:space-between}.main-content{grid-template-columns:1fr;grid-template-rows:1fr}.sidebar.animal-list-sidebar{display:none}.stats-panel{position:fixed;top:0;right:0;bottom:0;width:85%;max-width:320px;z-index:100;transform:translate(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);box-shadow:-10px 0 30px #00000080}.stats-panel.open{transform:translate(0)}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#fff3}