:root{--bg0: #030f14;--bg1: #061a21;--panel: #0a2028;--panel2: #0d2730;--line: #123540;--line2: #1d4a57;--ink: #dcf4f0;--mut: #7fa9ae;--faint: #4f7f88;--cyan: #3fe0c5;--amber: #ffb454;--coral: #ff6b7a;--sky: #6db3ff;--mint: #7ef0b2;--lilac: #b795ff;--f-disp: "Unbounded", "IBM Plex Sans", sans-serif;--f-body: "IBM Plex Sans", "Segoe UI", sans-serif;--f-mono: "IBM Plex Mono", "Consolas", monospace}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{background:radial-gradient(1100px 600px at 78% -10%,rgba(63,224,197,.05),transparent 60%),radial-gradient(900px 700px at -10% 110%,rgba(255,180,84,.045),transparent 55%),var(--bg0);color:var(--ink);font-family:var(--f-body);font-size:13px;-webkit-font-smoothing:antialiased;overflow:hidden}::selection{background:#3fe0c547}.app{display:grid;height:100dvh;grid-template-columns:1fr 344px;grid-template-rows:auto 1fr 172px;grid-template-areas:"header header" "stage  side" "charts side"}.hdr{grid-area:header;display:flex;align-items:center;gap:18px;padding:9px 16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#0d2730bf,#061a2166);position:relative;z-index:5}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{flex:none;filter:drop-shadow(0 0 8px rgba(63,224,197,.35))}.brand-word{font-family:var(--f-disp);font-weight:900;font-size:15px;letter-spacing:.22em;color:var(--ink);line-height:1;white-space:nowrap}.brand-sub{font-family:var(--f-mono);font-size:8.5px;letter-spacing:.3em;color:var(--faint);text-transform:uppercase;margin-top:4px;white-space:nowrap}.hdr-status{display:flex;align-items:center;gap:10px;margin-left:6px;padding:6px 12px;border:1px solid var(--line);background:#0a202899;border-radius:6px}.led{width:9px;height:9px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px #ffb454b3;flex:none}.led.on{background:var(--mint);box-shadow:0 0 10px #7ef0b2cc;animation:led-pulse 1.5s ease-in-out infinite}@keyframes led-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(.72);opacity:.65}}.status-label{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut)}.status-label b{color:var(--ink);font-weight:600}.clock{font-family:var(--f-mono);font-size:12px;font-weight:600;color:var(--cyan);letter-spacing:.06em;font-variant-numeric:tabular-nums}.hdr-spacer{flex:1}.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--panel2);border:1px solid var(--line2);border-radius:6px;padding:8px 15px;cursor:pointer;transition:transform .15s ease,background .18s ease,border-color .18s ease,box-shadow .2s ease;-webkit-user-select:none;user-select:none}.btn:hover{background:#123641;border-color:#2a6373;transform:translateY(-1px)}.btn:active{transform:translateY(0) scale(.98)}.btn svg{flex:none}.btn-primary{background:var(--cyan);border-color:transparent;color:#032019}.btn-primary:hover{background:#5cecd3;border-color:transparent;box-shadow:0 0 20px #3fe0c559}.btn-primary.amber{background:var(--amber);color:#2b1a02}.btn-primary.amber:hover{background:#ffc573;box-shadow:0 0 20px #ffb45459}.ctl-speed{display:flex;align-items:center;gap:10px;padding:6px 12px;border:1px solid var(--line);background:#0a202899;border-radius:6px}.ctl-speed .lbl{font-family:var(--f-mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint)}.speed-val{font-family:var(--f-mono);font-size:12px;font-weight:600;color:var(--amber);min-width:44px;text-align:right;font-variant-numeric:tabular-nums}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:3px;border-radius:2px;background:var(--line);outline:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:13px;height:13px;border-radius:50%;background:var(--ink);border:2px solid #0a2028;box-shadow:0 0 0 1px var(--line2),0 2px 6px #00000080;transition:transform .15s ease,box-shadow .15s ease}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.25);box-shadow:0 0 0 1px var(--cyan),0 0 12px #3fe0c566}input[type=range]::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:var(--ink);border:2px solid #0a2028;box-shadow:0 0 0 1px var(--line2)}input[type=range]::-moz-range-track{height:3px;border-radius:2px;background:var(--line)}.stage-wrap{grid-area:stage;position:relative;margin:12px 10px 10px 14px;border:1px solid var(--line);border-radius:8px;background:#04141a;overflow:hidden;box-shadow:inset 0 0 60px #00000073,0 10px 40px #00000059;transition:border-color .4s ease}.stage-wrap.paused{border-color:#ffb45473}.stage-wrap canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;cursor:crosshair}.corner{position:absolute;width:15px;height:15px;border:1px solid rgba(63,224,197,.4);pointer-events:none;z-index:3}.corner.tl{top:8px;left:8px;border-right:0;border-bottom:0}.corner.tr{top:8px;right:8px;border-left:0;border-bottom:0}.corner.bl{bottom:8px;left:8px;border-right:0;border-top:0}.corner.br{bottom:8px;right:8px;border-left:0;border-top:0}.stage-hint{position:absolute;left:14px;bottom:12px;z-index:3;display:flex;align-items:center;gap:14px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.08em;color:var(--mut);background:#041218c7;border:1px solid var(--line);border-radius:5px;padding:6px 11px;pointer-events:none}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;vertical-align:0}.dot.food{background:var(--amber);box-shadow:0 0 6px #ffb454cc}.dot.critter{background:conic-gradient(from 0deg,#ff6b7a,#ffb454,#7ef0b2,#6db3ff,#b795ff,#ff6b7a);box-shadow:0 0 6px #7ef0b299}.dot.pred{background:#ff6b7a;border-radius:0;clip-path:polygon(50% 0,61% 32%,98% 35%,70% 57%,79% 92%,50% 72%,21% 92%,30% 57%,2% 35%,39% 32%);box-shadow:0 0 7px #ff6b7ad9}.scale-bar{position:absolute;right:16px;bottom:14px;z-index:3;width:100px;height:5px;border:1px solid rgba(127,169,174,.55);border-top:0;pointer-events:none}.scale-bar span{position:absolute;right:0;top:-15px;font-family:var(--f-mono);font-size:8.5px;letter-spacing:.12em;color:var(--faint)}.extinct{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:none;align-items:center;justify-content:center;background:#030b0f8c;-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px)}.extinct.show{display:flex}.extinct-card{text-align:center;animation:rise .5s ease both}.extinct-word{font-family:var(--f-disp);font-weight:900;font-size:30px;letter-spacing:.24em;color:var(--coral);text-shadow:0 0 30px rgba(255,107,122,.45)}.extinct-sub{margin-top:10px;font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;color:var(--mut)}.side{grid-area:side;border-left:1px solid var(--line);background:linear-gradient(180deg,#071b22,#05141a);overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:12px}.side::-webkit-scrollbar{width:8px}.side::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}.side::-webkit-scrollbar-thumb:hover{background:var(--line2)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:7px;box-shadow:inset 0 1px #ffffff08;animation:rise .55s ease both}.panel-h{display:flex;align-items:center;gap:8px;padding:9px 12px 8px;border-bottom:1px solid rgba(18,53,64,.7);font-family:var(--f-mono);font-size:9.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--mut)}.panel-h:before{content:"";width:12px;height:2px;background:var(--tick, var(--cyan));flex:none}.panel-b{padding:12px}.param{margin-bottom:13px}.param:last-child{margin-bottom:2px}.param-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px}.param-name{font-size:12px;font-weight:500;color:var(--ink)}.param-name .tag{font-family:var(--f-mono);font-size:8px;letter-spacing:.1em;color:var(--faint);margin-left:6px;text-transform:uppercase}.param-val{font-family:var(--f-mono);font-size:12px;font-weight:600;color:var(--cyan);font-variant-numeric:tabular-nums}.param input[type=range]{width:100%}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.tile{background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:7px 8px 6px;transition:border-color .2s ease,transform .2s ease}.tile:hover{border-color:var(--line2);transform:translateY(-1px)}.tile .k{font-family:var(--f-mono);font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-bottom:4px}.tile .v{font-family:var(--f-mono);font-size:15px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums;transition:color .3s ease}.v-cyan{color:var(--cyan)}.v-mint{color:var(--mint)}.v-amber{color:var(--amber)}.v-coral{color:var(--coral)}.v-sky{color:var(--sky)}.v-ink{color:var(--ink)}.gene-row{margin-bottom:10px}.gene-row:last-child{margin-bottom:2px}.gene-top{display:flex;justify-content:space-between;margin-bottom:4px}.gene-name{font-size:11.5px;color:var(--mut)}.gene-val{font-family:var(--f-mono);font-size:11px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}.gene-sec{display:flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:8.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;margin:2px 0 10px}.gene-sec:after{content:"";flex:1;height:1px;background:var(--line)}.gene-sec:not(:first-child){margin-top:14px}.gene-none{font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;color:var(--faint);text-align:center;padding:4px 0 2px}.bar{height:4px;border-radius:2px;background:#0e2c35;overflow:hidden}.bar i{display:block;height:100%;border-radius:2px;width:0%;transition:width .5s cubic-bezier(.22,1,.36,1)}.ins-empty{text-align:center;padding:16px 8px 14px;color:var(--faint)}.ins-empty svg{opacity:.5;margin-bottom:8px}.ins-empty p{font-size:11.5px;line-height:1.5}.ins-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}.swatch{width:16px;height:16px;border-radius:50%;flex:none}.ins-title{font-family:var(--f-disp);font-weight:700;font-size:12.5px;letter-spacing:.08em}.gen-chip{font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;color:var(--cyan);border:1px solid rgba(63,224,197,.35);border-radius:4px;padding:2px 6px}.ins-close{margin-left:auto;background:none;border:1px solid var(--line);border-radius:5px;color:var(--mut);width:22px;height:22px;cursor:pointer;font-size:11px;line-height:1;transition:all .15s ease}.ins-close:hover{color:var(--coral);border-color:var(--coral)}.ins-meta{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;margin-bottom:12px}.ins-meta div{background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:6px 8px}.ins-meta .k{font-family:var(--f-mono);font-size:7.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}.ins-meta .v{font-family:var(--f-mono);font-size:12px;font-weight:600;margin-top:2px;font-variant-numeric:tabular-nums}.state-ok{color:var(--mint)}.state-mid{color:var(--amber)}.state-bad{color:var(--coral)}.charts{grid-area:charts;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 10px 12px 14px;min-height:0}.chart-card{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:8px 10px 6px;display:flex;flex-direction:column;min-height:0;animation:rise .55s ease both;transition:border-color .2s ease}.chart-card:hover{border-color:var(--line2)}.chart-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:4px}.chart-label{display:flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}.chart-label i{width:6px;height:6px;border-radius:50%;flex:none}.chart-val{font-family:var(--f-mono);font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.chart-card canvas{width:100%;height:clamp(78px,13vh,118px)}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.side .panel:nth-child(1){animation-delay:.05s}.side .panel:nth-child(2){animation-delay:.12s}.side .panel:nth-child(3){animation-delay:.19s}.side .panel:nth-child(4){animation-delay:.26s}.charts .chart-card:nth-child(1){animation-delay:.1s}.charts .chart-card:nth-child(2){animation-delay:.17s}.charts .chart-card:nth-child(3){animation-delay:.24s}.charts .chart-card:nth-child(4){animation-delay:.31s}@media(max-width:1150px){body{overflow:auto}.app{height:auto;grid-template-columns:1fr;grid-template-rows:auto auto auto auto;grid-template-areas:"header" "stage" "charts" "side"}.stage-wrap{min-height:56vh;margin:12px}.side{border-left:0;border-top:1px solid var(--line);overflow:visible}.charts{grid-template-columns:repeat(2,1fr);padding:0 12px}.brand-sub{display:none}}@media(max-width:640px){.hdr{flex-wrap:wrap;gap:10px}.hdr-status{display:none}.charts{grid-template-columns:1fr 1fr}}
