/* EVOLVE 021 / Spectral Flow Observatory */
.spectral-lab{margin:24px 0;padding:20px;border:1px solid #31516a;border-radius:15px;background:linear-gradient(135deg,#102437,#0a1625);color:#e0edf4;min-width:0}
.spectral-head{display:flex;justify-content:space-between;gap:16px;align-items:start}
.spectral-head h2{font-size:clamp(22px,3vw,30px);letter-spacing:-.035em;margin:5px 0 8px}
.spectral-head p{max-width:820px;color:#b0c4d1;margin:0 0 16px}
#spectral-state{border:1px solid #3d6675;color:#7de7d9;padding:6px 10px;border-radius:6px;font:11px ui-monospace,monospace}
.spectral-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.spectral-controls label{display:grid;gap:5px;color:#b6cfdb;font-size:12px;min-width:0}
.spectral-controls input:not([type=checkbox]),.spectral-controls select{width:100%;min-height:38px;border:1px solid #36556c;background:#071522;color:#edf7fb;border-radius:7px;padding:8px;font:inherit}
.spectral-controls .spectral-check{display:flex;align-items:center;gap:9px}
.spectral-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.spectral-actions button{min-height:38px;border:1px solid #35576e;background:#152f43;color:#d9e9f0;border-radius:7px;padding:8px 12px;font:600 11px ui-monospace,monospace;cursor:pointer}
.spectral-actions button.primary{background:#207e82;color:white;border-color:#3caca8}
.spectral-actions button:disabled{opacity:.4;cursor:not-allowed}
.spectral-actions button:focus-visible,.spectral-lab canvas:focus-visible,.spectral-controls :focus-visible{outline:3px solid #ffd18a;outline-offset:2px}
.spectral-progress{display:flex;align-items:center;gap:10px;font:12px ui-monospace,monospace}
.spectral-progress progress{flex:1;min-width:0;height:9px;accent-color:#76e8d9}
.spectral-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:14px;margin-top:16px}
.spectral-layout>div{min-width:0}
.spectral-layout h3{font-size:14px;margin:5px 0 10px}
.spectral-layout h3 small{font:10px ui-monospace,monospace;color:#86acbe}
.spectral-lab canvas{display:block;width:100%;height:auto;border:1px solid #32536b;border-radius:9px;background:#071522;margin:0 0 10px}
#spectral-map{touch-action:none;cursor:crosshair;aspect-ratio:16/9}
.spectral-readout{padding:12px;background:#0b1d2c;border-left:3px solid #71dfd0;font:12px/1.8 ui-monospace,monospace;overflow-wrap:anywhere}
.spectral-lab .quiet{color:#b1c5d2;font-size:12px}
@media(max-width:900px){.spectral-layout{grid-template-columns:1fr}}
@media(max-width:600px){.spectral-lab{padding:12px}.spectral-head{display:block}.spectral-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.spectral-actions button{flex:1 1 125px}.spectral-layout h3 small{display:block}}
@media(max-width:350px){.spectral-controls{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.spectral-lab *{scroll-behavior:auto}}