.ecology-viewer{background:var(--paper,#fffdf8);border:1px solid var(--line,#ddd3c0);border-radius:14px;padding:14px;color:var(--ink,#0f2238);font:15px/1.5 var(--sans,system-ui,sans-serif)}
.ecology-viewer *{box-sizing:border-box}
.ev-badges{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px;padding:0;list-style:none}
.ev-badge{font:700 .72rem var(--sans,system-ui,sans-serif);padding:3px 10px;border-radius:99px;border:1px solid var(--line,#ddd3c0);background:#f3ede0}
.ev-badge.actual{background:#e3f1f1;border-color:var(--teal,#0e7c86);color:var(--teal-d,#0a5961)}
.ev-badge.warn{background:#fdf0d8;border-color:#c99a2e;color:#6b4b00}
.ev-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(320px,1fr);gap:16px;align-items:start}
@media (max-width:900px){.ev-grid{grid-template-columns:minmax(0,1fr)}}
.ev-stage{position:relative;aspect-ratio:16/10;min-height:300px;max-height:78vh;background:linear-gradient(#b0c6d8,#e2e9ee);border-radius:10px;overflow:hidden;touch-action:none}
.ev-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab}
.ev-note{position:absolute;inset:auto 10px 10px 10px;background:rgba(15,34,56,.86);color:#fff;border-radius:8px;padding:8px 10px;font-size:.88rem}
.ev-note[data-state=unavailable]{inset:10px;background:#fdf0d8;color:#4a3500;border:1px solid #c99a2e}
.ev-bar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0}
.ev-bar button,.ev-fish button{font:600 .82rem var(--sans,system-ui,sans-serif);cursor:pointer;border:1px solid var(--teal-d,#0a5961);background:transparent;color:var(--teal-d,#0a5961);border-radius:8px;padding:5px 10px}
.ev-bar button[aria-pressed=true]{background:#e3f1f1}
.ev-bar button:disabled,.ev-bar select:disabled{opacity:.5;cursor:default}
.ev-chk{display:flex;align-items:center;gap:4px;font-size:.85rem}
.ev-side input[type=range]{width:100%}
.ev-clock,.ev-mode{margin:.2em 0;font-size:.85rem}
.ev-mode[data-mode=interp]{color:#6b4b00;font-weight:700}
.ev-fish{list-style:none;margin:6px 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:4px}
.ev-fish li{display:flex;align-items:center;gap:6px;border:1px solid var(--line,#ddd3c0);border-radius:8px;padding:2px 6px;font-size:.78rem}
.ev-fish li[aria-current=true]{background:#e3f1f1;border-color:var(--teal,#0e7c86)}
.ev-sw{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.ev-fs{color:var(--dim,#3e4f63);overflow-wrap:anywhere}
.ev-readout{font-size:.82rem;max-height:300px;overflow:auto}
.ev-readout h4,.ev-receipt h4{margin:.3em 0;font:700 .78rem var(--sans,system-ui,sans-serif);text-transform:uppercase;letter-spacing:.05em}
.ev-readout table{border-collapse:collapse;width:100%;table-layout:fixed}
.ev-readout th,.ev-readout td{border-top:1px solid var(--line,#ddd3c0);padding:2px 5px;text-align:left;vertical-align:top;overflow-wrap:anywhere;font-weight:400}
.ev-readout th{font-weight:600;width:42%;overflow-wrap:anywhere}
.ev-warn{background:#fdf0d8;border-left:4px solid #c99a2e;padding:4px 8px;margin:4px 0}
.ev-chart{width:100%;height:auto;border:1px solid var(--line,#ddd3c0);border-radius:8px;background:#fff}
.ev-receipt p{margin:.2em 0;font-size:.8rem;overflow-wrap:anywhere}
.ev-links{margin:.4em 0;padding-left:1.1em;font-size:.8rem}
.ev-links li{margin:.25em 0;overflow-wrap:anywhere}
.ev-disclosure{font-size:.8rem;color:var(--dim,#3e4f63);border-top:1px solid var(--line,#ddd3c0);padding-top:6px}
.ecology-viewer .faint{color:var(--faint,#566579)}
.ev-status{margin:6px 0;padding:6px 10px;border-radius:8px;font-size:.86rem;border-left:4px solid var(--teal,#0e7c86);background:#eef5f5}
.ev-status[data-state=warn]{border-left-color:#9a1b1b;background:#fbeaea;color:#5a1010}
.ev-false{color:#9a1b1b;font-weight:700}
.ev-rcpt{margin:.4em 0;font-size:.8rem}
.ev-rcpt summary{cursor:pointer;font-weight:600}