.o01-panel { margin: 0 0 8px; padding: 9px 12px; border: 1px solid var(--border, #d8cec0); border-radius: 8px; background: var(--surface, #fffaf2); }
.o01-controls, .o01-legend { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.o01-controls button[aria-pressed="true"] { background: #e3eeeb; border-color: #55877d; color: #214d45; }
.o01-panel p { margin: 7px 0; }
.o01-legend { gap: 18px; font-size: 12px; }
.o01-realRay { color: #a64e20; }
.o01-virtualExtension { color: #805ba0; }
.o01-analyticReference { color: #697c7e; }
.o01-legend span::before { content: ''; display: inline-block; width: 23px; margin-right: 6px; vertical-align: middle; border-top: 2px solid currentColor; }
.o01-legend .o01-virtualExtension::before { border-top-style: dashed; }
.o01-legend .o01-analyticReference::before { border-top-width: 7px; opacity: .4; }
.o01-plots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
.o01-plots[hidden], .o01-panel[hidden], .o01-selection[hidden] { display: none; }
.o01-plot { border: 1px solid var(--border, #d8cec0); border-radius: 6px; background: var(--surface, #fffaf2); min-width: 0; overflow: hidden; }
.o01-plot h3 { font-size: 13px; margin: 8px 10px 0; font-weight: 600; }
.o01-plot svg { display: block; width: 100%; max-height: 176px; }
.o01-plot svg:focus, .o01-plot [tabindex]:focus { outline: 2px solid #55877d; }
.o01-readings { display: grid; grid-template-columns: minmax(85px, 1fr) minmax(105px, 1fr); gap: 6px 10px; font-size: 12px; }
.o01-readings dt { color: var(--muted, #68635b); }
.o01-readings dd { margin: 0; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.o01-toggle { display: flex; gap: 7px; align-items: center; margin: 9px 0; }
.o01-selection { margin-top: 8px; }
.o01-selection select { max-width: 100%; }
.o01-selection p { margin: 6px 0; }
.o01-active #canvasWrap { height: 310px; min-height: 250px; }
.o01-active #properties h3 { font-size: 13px; margin: 16px 0 6px; }
.o01-active #properties .param-field { margin: 8px 0; }
.o01-handle { cursor: grab; touch-action: none; background: #fffaf2; border: 1px solid #b6a58c; border-radius: 5px; padding: 3px 6px; }
.o01-handle:active { cursor: grabbing; }
.o01-handle:focus-visible { outline: 2px solid #55877d; outline-offset: 2px; }
.o01-active .o01-domain-note { font-size: 12px; color: #625c53; }
@media(max-width: 720px) { .o01-plots { grid-template-columns: 1fr; } }