@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #0f0f1a;--bg-secondary: #1a1a2e;--bg-tertiary: #16213e;--text-primary: #ffffff;--text-secondary: rgba(255, 255, 255, .7);--text-muted: rgba(255, 255, 255, .4);--accent-primary: #8b5cf6;--accent-secondary: #6366f1;--accent-green: #22c55e;--accent-red: #ef4444;--accent-yellow: #fbbf24;--glass-bg: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1);--shadow: 0 8px 32px rgba(0, 0, 0, .3)}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-primary);color:var(--text-primary);overflow:hidden;height:100vh;width:100vw}#simulation-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1}.ui-panel{position:fixed;top:20px;right:20px;width:340px;max-height:calc(100vh - 40px);overflow-y:auto;background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px;padding:24px;z-index:100;box-shadow:var(--shadow)}.ui-panel::-webkit-scrollbar{width:6px}.ui-panel::-webkit-scrollbar-track{background:transparent}.ui-panel::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:3px}.ui-panel.hidden{transform:translate(calc(100% + 20px));opacity:0;pointer-events:none}.ui-panel{transition:transform .3s ease,opacity .3s ease}.floating-toggle-btn{position:fixed;top:20px;right:20px;width:56px;height:56px;background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));border:none;border-radius:50%;font-size:24px;cursor:pointer;display:none;align-items:center;justify-content:center;z-index:100;box-shadow:0 4px 20px #8b5cf680;transition:all .3s ease;animation:fadeIn .3s ease-out}.floating-toggle-btn:hover{transform:scale(1.1) rotate(90deg);box-shadow:0 6px 30px #8b5cf6b3}.ui-header{text-align:center;margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--glass-border)}.ui-header h1{font-size:28px;font-weight:700;background:linear-gradient(135deg,var(--accent-red),var(--accent-green));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px}.ui-subtitle{color:var(--text-secondary);font-size:12px;font-weight:400;letter-spacing:.5px}.ui-header-actions{display:flex;gap:8px;margin-top:12px;justify-content:center}.ui-btn-icon{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:10px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px;transition:all .2s ease}.ui-btn-icon:hover{background:#ffffff1a;transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.ui-section{margin-bottom:20px}.ui-section h2{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:12px}.ui-controls{display:flex;flex-direction:column;gap:12px}.ui-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border:none;border-radius:12px;font-family:inherit;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.ui-btn-primary{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff}.ui-btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 20px #8b5cf666}.ui-btn-primary.paused{background:linear-gradient(135deg,var(--accent-green),#16a34a)}.speed-control{display:flex;align-items:center;gap:12px;padding:8px 0}.speed-control label{font-size:13px;color:var(--text-secondary);min-width:45px}.speed-control input[type=range]{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:var(--glass-border);border-radius:3px;outline:none}.speed-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:var(--accent-primary);border-radius:50%;cursor:pointer;transition:transform .2s}.speed-control input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}#speed-value{font-size:13px;font-weight:500;color:var(--accent-primary);min-width:30px;text-align:right}.zoom-controls{display:flex;gap:8px;padding:8px 0;justify-content:center}.ui-btn-small{flex:1;padding:8px 12px;font-size:12px;background:var(--glass-bg);color:var(--text-secondary);border:1px solid var(--glass-border)}.ui-btn-small:hover{background:#ffffff1a;color:var(--text-primary);transform:translateY(-1px)}.population-grid{grid-template-columns:1fr 1fr}.stat-item.predator{background:linear-gradient(135deg,#ef444426,#dc26261a);border-color:#ef44444d}.stat-item.predator .stat-value{color:var(--accent-red)}.stat-item.herbivore{background:linear-gradient(135deg,#22c55e26,#16a34a1a);border-color:#22c55e4d}.stat-item.herbivore .stat-value{color:var(--accent-green)}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat-item{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;padding:12px;text-align:center}.stat-item.highlight{background:linear-gradient(135deg,#8b5cf61a,#6366f11a);border-color:#8b5cf64d}.stat-label{display:block;font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);margin-bottom:4px}.stat-value{display:block;font-size:20px;font-weight:600;color:var(--text-primary)}.stat-item.highlight .stat-value{background:linear-gradient(135deg,var(--accent-primary),var(--accent-green));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}#chart-canvas{width:100%;height:120px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px}.log-filters{display:flex;gap:6px;margin-bottom:10px}.log-filter{flex:1;padding:6px 8px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:8px;color:var(--text-muted);font-size:11px;cursor:pointer;transition:all .2s ease}.log-filter:hover{background:#ffffff14}.log-filter.active{background:var(--accent-primary);border-color:var(--accent-primary);color:#fff}.evolution-log{max-height:200px;overflow-y:auto;background:#0003;border:1px solid var(--glass-border);border-radius:12px;padding:8px}.evolution-log::-webkit-scrollbar{width:4px}.evolution-log::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:2px}.log-entry{display:flex;align-items:center;gap:8px;padding:6px 8px;margin-bottom:4px;background:var(--glass-bg);border-radius:8px;font-size:11px;animation:fadeInLog .3s ease-out}.log-entry:last-child{margin-bottom:0}.log-entry.placeholder{justify-content:center;color:var(--text-muted)}.log-icon{font-size:14px}.log-text{flex:1;color:var(--text-secondary)}.log-entry.elite{border-left:3px solid #ffd700}.log-entry.birth{border-left:3px solid var(--accent-green)}.log-entry.death{border-left:3px solid var(--text-muted)}.log-entry.kill{border-left:3px solid var(--accent-red)}.log-entry.generation{border-left:3px solid var(--accent-primary);background:#8b5cf61a}@keyframes fadeInLog{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.ui-toggles{display:flex;flex-direction:column;gap:10px}.toggle{display:flex;align-items:center;gap:10px;cursor:pointer;padding:8px 12px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:10px;transition:all .2s ease}.toggle:hover{background:#ffffff14}.toggle input[type=checkbox]{-webkit-appearance:none;appearance:none;width:40px;height:22px;background:var(--glass-border);border-radius:11px;position:relative;cursor:pointer;transition:all .3s ease}.toggle input[type=checkbox]:before{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;background:#fff;border-radius:50%;transition:all .3s ease}.toggle input[type=checkbox]:checked{background:var(--accent-primary)}.toggle input[type=checkbox]:checked:before{transform:translate(18px)}.toggle span{font-size:13px;color:var(--text-secondary)}.ui-footer{text-align:center;padding-top:16px;border-top:1px solid var(--glass-border)}.ui-footer p{font-size:11px;color:var(--text-muted);line-height:1.6}@media(max-width:768px){.ui-panel{width:calc(100% - 40px);max-width:340px;right:50%;transform:translate(50%);top:auto;bottom:20px;max-height:50vh}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.ui-panel{animation:fadeIn .5s ease-out}.ui-section{animation:fadeIn .5s ease-out;animation-fill-mode:both}.ui-section:nth-child(1){animation-delay:.1s}.ui-section:nth-child(2){animation-delay:.15s}.ui-section:nth-child(3){animation-delay:.2s}.ui-section:nth-child(4){animation-delay:.25s}.ui-section:nth-child(5){animation-delay:.3s}.ui-section:nth-child(6){animation-delay:.35s}.ui-section:nth-child(7){animation-delay:.4s}.section-header-toggle{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.section-header-toggle h2{margin-bottom:0}.toggle-btn{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-secondary);width:28px;height:28px;border-radius:6px;cursor:pointer;font-size:10px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.toggle-btn:hover{background:#ffffff1a;color:var(--text-primary)}.survivor-log{background:#0003;border:1px solid var(--glass-border);border-radius:12px;padding:12px;max-height:300px;overflow-y:auto;transition:all .3s ease}.survivor-log.collapsed{max-height:0;padding:0;border:none;overflow:hidden}.survivor-placeholder{color:var(--text-muted);font-size:12px;text-align:center;padding:20px 0}.survivor-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--glass-border)}.survivor-gen{font-weight:600;color:var(--accent-primary);font-size:13px}.survivor-stats{font-size:11px;color:var(--text-secondary)}.survivor-summary{display:flex;gap:16px;font-size:12px;color:var(--text-secondary);margin-bottom:12px}.survivor-section-title{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.survivor-elites{margin-bottom:12px}.survivor-elite-entry{display:flex;align-items:center;gap:8px;padding:6px 8px;background:var(--glass-bg);border-radius:6px;margin-bottom:4px;font-size:11px}.survivor-elite-entry.predator{border-left:3px solid var(--accent-red)}.survivor-elite-entry.herbivore{border-left:3px solid var(--accent-green)}.elite-rank{font-weight:600;color:gold;min-width:24px}.elite-type{font-size:12px}.elite-fitness{color:var(--text-secondary)}.trait-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.trait-item{display:flex;justify-content:space-between;align-items:center;padding:4px 8px;background:var(--glass-bg);border-radius:4px;font-size:10px}.trait-label{color:var(--text-secondary)}.trait-value{font-weight:500;color:var(--text-primary)}.records-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.record-item{background:linear-gradient(135deg,#fbbf241a,#f59e0b0d);border:1px solid rgba(251,191,36,.2);border-radius:10px;padding:10px;text-align:center}.record-label{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);margin-bottom:4px}.record-value{display:block;font-size:18px;font-weight:700;color:#fbbf24;margin-bottom:2px}.record-gen{display:block;font-size:9px;color:var(--text-muted)}.branding-badge{position:fixed;bottom:20px;left:20px;display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:50px;z-index:1000;box-shadow:0 8px 32px #0003;transition:all .3s ease;animation:slideUp .5s ease-out}.branding-badge:hover{background:#ffffff14;transform:translateY(-2px);box-shadow:0 12px 40px #0000004d}.branding-link{text-decoration:none;color:var(--text-primary);font-size:13px;font-weight:400;transition:color .2s ease}.branding-text{opacity:.9}.branding-text .highlight{font-weight:700;background:linear-gradient(135deg,#fff,#e0e7ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.branding-link:hover .branding-text{opacity:1}.branding-separator{width:1px;height:16px;background:var(--glass-border)}.branding-github{color:var(--text-secondary);display:flex;align-items:center;transition:all .2s ease;opacity:.7}.branding-github:hover{color:#fff;opacity:1;transform:scale(1.1)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:600px){.branding-badge{bottom:10px;left:50%;transform:translate(-50%);width:auto;white-space:nowrap;animation:slideUpCenter .5s ease-out}.branding-badge:hover{transform:translate(-50%) translateY(-2px)}@keyframes slideUpCenter{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000c;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;z-index:200;opacity:0;transition:opacity .3s ease}.modal-overlay.visible{display:flex;opacity:1}.modal-dialog{background:linear-gradient(145deg,#2a2a3e,#1f1f2e);border:2px solid rgba(139,92,246,.3);border-radius:20px;max-width:600px;width:calc(100% - 40px);max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #8b5cf64d,0 0 0 1px #ffffff1a;transform:scale(.9);transition:transform .3s ease}.modal-overlay.visible .modal-dialog{transform:scale(1)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:1px solid var(--glass-border)}.modal-header h2{font-size:20px;font-weight:600;color:var(--text-primary);margin:0}.modal-close{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:8px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;color:var(--text-secondary);transition:all .2s ease}.modal-close:hover{background:#ffffff1a;color:var(--text-primary)}.modal-body{padding:24px}.config-grid{display:grid;gap:20px}.config-item{display:flex;flex-direction:column;gap:8px}.config-item label{font-size:13px;font-weight:500;color:var(--text-secondary)}.slider-container{display:flex;align-items:center;gap:12px}.slider-container input[type=range]{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:var(--glass-border);border-radius:3px;outline:none}.slider-container input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:var(--accent-primary);border-radius:50%;cursor:pointer;transition:transform .2s}.slider-container input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-container input[type=range]::-moz-range-thumb{width:18px;height:18px;background:var(--accent-primary);border:none;border-radius:50%;cursor:pointer;transition:transform .2s}.slider-container input[type=range]::-moz-range-thumb:hover{transform:scale(1.2)}.slider-value{font-size:14px;font-weight:600;color:var(--accent-primary);min-width:60px;text-align:right}.modal-footer{display:flex;gap:12px;padding:24px;border-top:1px solid var(--glass-border);justify-content:flex-end}.ui-btn-secondary{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-secondary)}.ui-btn-secondary:hover{background:#ffffff1a;color:var(--text-primary);transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.modal-dialog::-webkit-scrollbar{width:6px}.modal-dialog::-webkit-scrollbar-track{background:transparent}.modal-dialog::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:3px}