:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;color:#233e36;background:#fafbf9;--line:#dce4de;--muted:#52665b;--text:13px;--heading:17px;--title:22px}*{box-sizing:border-box}html,body{height:100%;overflow:hidden}body{margin:0;font-size:var(--text)}button,select,input,textarea{font:inherit}button,select,summary{cursor:pointer}button,select{color:inherit}button{min-height:34px;padding:6px 12px;border:0;border-radius:8px;background:transparent;transition:background .12s,color .12s}button:hover{background:#e7eee7}button:disabled{opacity:.4;cursor:default}select{border:0;border-radius:8px;background:#edf1eb;padding:7px 28px 7px 10px;max-width:100%}input[type=range]{accent-color:#2b6853;cursor:pointer}a{color:#285f49;text-underline-offset:3px}:focus-visible{outline:2px solid #327c60;outline-offset:3px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h2,h3{font-size:var(--heading);font-weight:600;letter-spacing:-.3px}.lab-skip{position:absolute;top:-100px;padding:10px;background:#fff;z-index:100}.lab-skip:focus{top:0}.lab-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}ecology-lab{height:100dvh;display:flex;flex-direction:column;--eco-accent:#287cac}.lab-top{height:52px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--line)}.lab-title{font-size:var(--title);font-weight:650;letter-spacing:-.8px}.lab-title b{font-weight:400}.lab-top nav{display:flex;align-items:center;gap:8px}.lab-info-button{display:flex;align-items:center;gap:7px}.lab-menu{position:relative}.lab-menu>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;min-height:34px;padding:6px 12px;border-radius:8px;background:#edf1eb;white-space:nowrap}.lab-menu>summary::-webkit-details-marker{display:none}.lab-menu[open]>summary,.lab-menu>summary:hover{background:#e2eae0}.lab-menu-items{position:absolute;right:0;top:calc(100% + 7px);z-index:20;min-width:240px;padding:6px;border:1px solid #d6ded6;background:#fbfcf9f5;backdrop-filter:blur(18px);border-radius:12px;box-shadow:0 10px 30px #183a2525;display:grid;gap:2px}.lab-menu-items>a,.lab-menu-items>button{display:block;text-align:left;text-decoration:none;padding:9px 12px;min-height:36px;border-radius:7px;white-space:nowrap;font-size:var(--text)}.lab-menu-items>a:hover{background:#e7eee7}.lab-menu-items [aria-pressed=true]{background:#dceadf}.lab-menu-items [aria-pressed=true]:after{content:"✓";float:right;margin-left:16px}.lab-shell{flex:1;min-height:0;display:grid;grid-template-rows:minmax(230px,1.15fr) minmax(252px,1fr);padding:0 20px 12px;gap:0}.lab-experiment{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);min-height:0;position:relative}.lab-habitat-panel,.lab-web-panel{display:flex;flex-direction:column;min-width:0;min-height:0;padding:10px 16px 8px 0}.lab-web-panel{padding:10px 0 8px 16px;border-left:1px solid var(--line)}.lab-habitat-heading,.lab-web-title{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px;margin-bottom:8px}.lab-scene-select{font-size:var(--heading);font-weight:600;letter-spacing:-.3px;background:transparent;padding-left:0;max-width:calc(100% - 86px)}.lab-motion{background:#edf1eb;white-space:nowrap}.lab-toggle[aria-pressed=true]{background:#dceadf;color:#214b36}.lab-toggle[aria-pressed=true]:before{content:"✓";margin-right:6px}.lab-habitat{position:relative;flex:1;min-height:0;background-color:#266981;background-size:cover;background-position:center;border-radius:9px;overflow:hidden}.lab-habitat canvas{position:absolute;inset:0;width:100%;height:100%}.lab-habitat:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 -20px 35px #142f421c}.lab-environment{padding-top:7px;min-height:35px;display:flex;align-items:center}.lab-environment label{display:flex;align-items:center;gap:12px;width:100%;white-space:nowrap}.lab-environment input{flex:1;min-width:35px;max-width:280px;height:20px}.lab-environment output{font-variant-numeric:tabular-nums;min-width:38px}.lab-web-title select{max-width:175px}.lab-web{position:relative;flex:1;min-height:0;width:100%}.lab-web>svg{position:absolute;inset:0;width:100%;height:100%}.lab-node{position:absolute;transform:translate(-50%,-50%);width:32%;min-height:0;padding:0;border:0;background:none;line-height:1.15;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:var(--text)}.lab-node:hover{background:none}.lab-node .lab-portrait{width:clamp(28px,6dvh,46px);height:clamp(28px,6dvh,46px);background-color:#f3f6f0;border:1px solid color-mix(in srgb,var(--species-color),transparent 64%);border-radius:50%}.lab-node:hover .lab-portrait,.lab-node[aria-expanded=true] .lab-portrait{outline:2px solid var(--eco-accent);outline-offset:2px}.lab-node.is-off{opacity:.4}.lab-node.is-extinct .lab-portrait{border-style:dashed;filter:grayscale(1)}.lab-node>span:last-child{display:flex;align-items:center;gap:4px;padding:2px 4px;border-radius:4px;background:#fafbf9ed}.lab-node>span:last-child:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--species-color);flex-shrink:0}.lab-portrait{display:inline-block;background-size:300% 300%;background-repeat:no-repeat;flex-shrink:0}.lab-web-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:35px;padding-top:5px}.lab-button-group{display:flex;background:#edf1eb;border-radius:8px}.lab-button-group button{min-height:30px;padding:5px 10px}.lab-web-bottom>button{min-height:30px;padding:5px 8px}.lab-inspector{position:absolute;z-index:12;top:9px;right:0;width:min(330px,44%);max-height:calc(100% - 17px);overflow:auto;padding:14px;background:#fafcf8f7;backdrop-filter:blur(18px);border:1px solid #d2ded1;border-radius:12px;box-shadow:0 12px 32px #1c3b2624}.lab-close{position:absolute;right:7px;top:6px;min-height:30px;width:30px;height:30px;padding:0;font-size:var(--title)}.lab-inspector-heading{display:flex;align-items:center;gap:10px;padding-right:24px;min-height:42px}.lab-inspector-heading .lab-portrait{width:40px;height:40px;border-radius:50%;background-color:#edf2eb}.lab-inspector-heading h3{line-height:1.15}.lab-choice{border:1px solid #d8e0d6;background:#eef2eb;min-height:33px;padding:5px 10px;display:inline-flex;align-items:center;gap:7px}.lab-choice:before{content:"+";width:12px}.lab-choice[aria-pressed=true]{background:#d5e9d9;border-color:#a8c8af;color:#204a2f}.lab-choice[aria-pressed=true]:before{content:"✓"}.lab-include{margin:10px 0;width:100%;justify-content:center}.lab-inspector fieldset{border:0;padding:0;margin:0}.lab-inspector legend{font-size:var(--text);font-weight:600;margin-bottom:7px;padding:0}.lab-inspector [data-diet-options]{display:flex;flex-wrap:wrap;gap:6px}.lab-species-info{border-top:1px solid var(--line);margin-top:12px;padding-top:9px}.lab-species-info summary{width:fit-content;color:#36563e}.lab-species-info p{margin:9px 0;line-height:1.45}.lab-species-info [data-scientific]{font-style:italic}.lab-species-info a{display:inline-block;margin-top:3px}.lab-graph-panel{display:flex;flex-direction:column;min-height:0;border-top:1px solid var(--line);padding-top:9px;position:relative}.lab-graph-heading,.lab-graph-name,.lab-graph-actions{display:flex;align-items:center;gap:18px}.lab-graph-heading{justify-content:space-between;min-height:38px;margin-bottom:4px}.lab-graph-name{gap:15px;white-space:nowrap}.lab-step-count{font-variant-numeric:tabular-nums}.lab-step-count strong{font-weight:600}.lab-controls{display:flex;align-items:center;gap:3px}.lab-controls button{display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap}.lab-controls svg{width:13px;height:13px}button.lab-run{background:#275d49;color:#fff;min-width:90px}button.lab-run:hover{background:#194734}.lab-graph-actions{gap:12px}.lab-graph-layout{flex:1;min-height:0;display:grid;grid-template-columns:168px minmax(0,1fr);gap:14px}.lab-legend{display:grid;align-content:stretch;gap:0;min-height:0;padding:3px 0 29px}.lab-legend-row{display:grid;grid-template-columns:12px minmax(0,1fr) 38px;gap:6px;align-items:center;font-size:var(--text);min-height:0}.lab-legend-name{min-width:0}.lab-legend-full{display:none}.lab-legend-short{display:inline}.lab-legend-row i{height:0;border-top:2px var(--line-style) var(--species-color)}.lab-legend-row strong{text-align:right;font-weight:500;font-variant-numeric:tabular-nums}.lab-legend-row.is-zero{color:#657369}.lab-plot{display:grid;grid-template-rows:minmax(0,1fr) 30px;min-width:0;min-height:0}.lab-plot svg{display:block;width:100%;height:100%;min-height:0;touch-action:pan-y}.lab-plot-controls{display:flex;align-items:center;gap:10px;min-width:0}.lab-plot-controls label{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.lab-plot-controls output{min-width:30px;font-variant-numeric:tabular-nums}.lab-plot-controls input{flex:1;min-width:0}.lab-notice{position:absolute;left:50%;bottom:36px;transform:translate(-50%);max-width:90%;padding:8px 13px;border:1px solid #cedbcd;background:#f9fcf5f5;box-shadow:0 4px 16px #263e2515;border-radius:8px;pointer-events:none;white-space:normal;text-align:center}.lab-data-table{width:100%;border-collapse:collapse;font-size:var(--text)}.lab-data-table th,.lab-data-table td{text-align:right;padding:7px 12px;border-bottom:1px solid var(--line)}.lab-data-table th:first-child{text-align:left}dialog{color:#294536;background:#fafbf9;border:1px solid var(--line);border-radius:14px;padding:26px;max-width:min(620px,calc(100vw - 30px));max-height:85dvh;line-height:1.6;box-shadow:0 20px 70px #12382530;font-size:var(--text)}dialog::backdrop{background:#12302660}dialog h2{font-size:var(--title);letter-spacing:-.5px;margin-bottom:12px}dialog h3{font-size:var(--heading);margin-top:18px}dialog p{margin-block:12px}dialog ol{padding-left:22px}dialog li{margin-bottom:9px}.lab-dialog-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:20px}.lab-noscript{position:absolute;inset:60px 15px auto;padding:20px;background:#fff}.lab-mobile-views{display:none}@media(max-width:950px){.lab-top,.lab-shell{padding-inline:14px}.lab-experiment{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}.lab-habitat-panel{padding-right:12px}.lab-web-panel{padding-left:12px}.lab-graph-heading{gap:8px}.lab-graph-name{gap:10px}.lab-graph-actions{gap:5px}.lab-controls button{padding-inline:8px}.lab-menu>summary{padding-inline:9px}.lab-web-title{gap:7px}.lab-web-title select{max-width:150px}.lab-inspector{width:min(330px,48%)}.lab-graph-layout{grid-template-columns:150px minmax(0,1fr);gap:10px}}@media(max-width:650px){.lab-top{height:48px;padding-inline:12px}.lab-shell{padding:0 12px 8px;grid-template-rows:36px minmax(200px,1.05fr) minmax(260px,1fr)}.lab-mobile-views{display:flex;gap:3px;background:#edf1eb;border-radius:8px;margin:5px 0 0;justify-self:start;align-self:start}.lab-mobile-views button{min-height:28px;padding:3px 14px}.lab-mobile-views [aria-pressed=true]{background:#d6e5d7}.lab-experiment{display:block}.lab-habitat-panel,.lab-web-panel{height:100%;padding:6px 0;border:0}.lab-experiment:not(.show-web) .lab-web-panel{display:none}.lab-experiment.show-web .lab-habitat-panel{display:none}.lab-inspector{width:min(340px,100%);max-height:calc(100% - 12px);top:6px}.lab-graph-heading{align-items:start;flex-wrap:wrap;gap:5px}.lab-graph-name{justify-content:space-between;width:100%;height:24px}.lab-graph-actions{justify-content:space-between;width:100%}.lab-graph-menu>summary{min-height:32px}.lab-graph-menu .lab-menu-items{top:auto;bottom:calc(100% + 7px)}.lab-controls button{min-height:32px}.lab-graph-layout{grid-template-columns:125px minmax(0,1fr);gap:6px}.lab-legend{padding-bottom:28px}.lab-legend-row{grid-template-columns:8px minmax(0,1fr) 34px;gap:4px}.lab-node .lab-portrait{width:38px;height:38px}.lab-environment input{max-width:none}.lab-graph-menu .lab-menu-items{min-width:210px}}@media(max-height:620px)and (min-width:651px){.lab-top{height:42px}.lab-shell{grid-template-rows:minmax(175px,1fr) minmax(220px,1fr);padding-bottom:5px}.lab-habitat-panel,.lab-web-panel{padding-top:4px;padding-bottom:4px}.lab-habitat-heading,.lab-web-title{min-height:30px;margin-bottom:3px}.lab-node .lab-portrait{width:26px;height:26px}.lab-web-bottom,.lab-environment{min-height:30px}.lab-graph-heading{min-height:32px}.lab-legend{padding-bottom:26px}.lab-inspector{max-height:calc(100dvh - 80px)}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}@media print{html,body{overflow:visible;height:auto}ecology-lab{height:auto}.lab-top nav,.lab-controls,.lab-inspector,.lab-graph-menu,.lab-plot-controls,.lab-environment,.lab-mobile-views{display:none!important}.lab-shell{display:block}.lab-experiment{height:360px}.lab-graph-panel{height:300px}.lab-habitat{print-color-adjust:exact}}.lab-ecosystem-menu{max-width:calc(100% - 86px)}.lab-ecosystem-menu>summary{font-size:var(--heading);font-weight:600;letter-spacing:-.3px;background:#edf1eb;white-space:normal}.lab-ecosystem-menu .lab-menu-items{left:0;right:auto;min-width:230px}.lab-menu>summary:empty{display:none}select{appearance:none;padding-right:10px}summary{list-style:none}summary::-webkit-details-marker{display:none}.lab-portrait{background-origin:content-box;background-clip:content-box;padding:3px}.lab-habitat{background:#f1f4ee;isolation:isolate}.lab-habitat:before{content:"";position:absolute;inset:0;background-image:var(--habitat-image);background-size:100% 100%;background-position:center;pointer-events:none;z-index:0}.lab-habitat canvas{z-index:1}.lab-habitat:after{display:none}.lab-node .lab-portrait,.lab-inspector-heading .lab-portrait{border:0;border-radius:0;background-color:transparent}.lab-node.is-extinct .lab-portrait{opacity:.5}.lab-node{width:max-content;min-width:64px;max-width:32%;min-height:44px;border-radius:10px;-webkit-tap-highlight-color:transparent}.lab-node .lab-portrait,.lab-node:hover .lab-portrait,.lab-node[aria-expanded=true] .lab-portrait{outline:none;transition:transform .14s ease,opacity .14s ease}.lab-node>span:last-child{padding:4px 7px;border-radius:7px;transition:background-color .14s ease,color .14s ease,box-shadow .14s ease;box-shadow:inset 0 0 0 1px transparent}@media(hover:hover)and (pointer:fine){.lab-node:hover .lab-portrait{transform:translateY(-2px)}.lab-node:hover>span:last-child{background:#e8eee8;box-shadow:inset 0 0 0 1px #d9e3db}}.lab-node[aria-expanded=true]>span:last-child,.lab-node[aria-expanded=true]:hover>span:last-child{background:#dcebe2;color:#173f2d;box-shadow:inset 0 0 0 1px #8bad9a}.lab-node:active .lab-portrait{transform:scale(.96)}.lab-node:active>span:last-child{background:#cddfd3}.lab-node:focus-visible{outline:none}.lab-node:focus-visible>span:last-child{outline:2px solid #327c60;outline-offset:3px}.lab-choice{transition:background-color .14s ease,border-color .14s ease,transform .1s ease}@media(hover:hover)and (pointer:fine){.lab-choice:hover{background:#e3ece4;border-color:#aac2b0}.lab-choice[aria-pressed=true]:hover{background:#c9e1d0}}.lab-choice:active{transform:scale(.98);background:#c3d9ca}@media(prefers-reduced-motion:reduce){.lab-node .lab-portrait,.lab-node>span:last-child,.lab-choice{transition:none}.lab-node:hover .lab-portrait,.lab-node:active .lab-portrait,.lab-choice:active{transform:none}}.lab-loading{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);max-width:90%;padding:9px 14px;border-radius:9px;background:#fafbf9f5;box-shadow:0 3px 18px #173b2920;text-align:center;pointer-events:none}.lab-pattern-button{background:#e5eee7;padding:4px 9px;min-height:28px;white-space:nowrap}.lab-support-options{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.lab-pattern-list section{padding:12px 0;border-top:1px solid var(--line)}.lab-pattern-list h3{font-size:var(--text);margin:0;font-weight:600}.lab-pattern-list p{margin:5px 0 0}[data-pattern-dialog],[data-teacher-dialog]{width:580px}@media(min-width:651px)and (max-width:900px){.lab-graph-name{gap:6px}.lab-pattern-button{padding-inline:6px}.lab-controls .lab-run{min-width:65px}.lab-graph-actions{gap:3px}}.lab-pattern-list section{padding:8px 0}.lab-pattern-list p{line-height:1.4;margin-top:3px}
