#ox-ops-panel { margin-bottom: 24px; color: #374151; }
#ox-ops-panel [hidden] { display: none !important; }
.ox-ops-tabs { display: flex; gap: 24px; border-bottom: 1px solid #e5e7eb; margin-bottom: 24px; }
.ox-ops-tabs button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 2px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #6b7280; font: inherit; font-size: 14px; cursor: pointer; }
.ox-ops-tabs button[aria-selected="true"] { color: #0d9488; border-bottom-color: #0d9488; font-weight: 600; }
.ox-ops-tabs svg, .ox-ops-load svg { width: 18px; height: 18px; stroke-width: 1.8; }
#ox-ops-panel button:focus-visible { outline: 2px solid #3b82f6; outline-offset: 4px; }
main[data-ox-ops-tab="pelican"] > :not(#ox-ops-panel) { display: none !important; }
.ox-ops-frame { display: block; width: 100%; height: max(680px, calc(100dvh - 200px)); border: 0; background: #f9fafb; }
.ox-ops-load { display: flex; align-items: center; justify-content: center; gap: 16px; min-height: 300px; font-size: 14px; color: #6b7280; }
.ox-ops-load button { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid #d1d5db; border-radius: 6px; background: white; cursor: pointer; }
.dark #ox-ops-panel { color: #e5e7eb; }
.dark .ox-ops-tabs { border-color: #374151; }
.dark .ox-ops-tabs button { color: #9ca3af; }
.dark .ox-ops-tabs button[aria-selected="true"] { color: #60a5fa; border-color: #60a5fa; }
.dark .ox-ops-frame { background: #0a0a0a; }
.ox-ops-embedded { background: #f9fafb; }
.ox-ops-embedded main { max-width: none; padding: 0 0 20px; }
.ox-ops-embedded .topbar, .ox-ops-embedded footer { display: none; }
.ox-ops-embedded h1 { font-size: 23px; }
.ox-ops-embedded .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ox-ops-embedded.ox-ops-dark { color: #e5e7eb; background: #0a0a0a; color-scheme: dark; }
.ox-ops-dark .observation, .ox-ops-dark .icon-button, .ox-ops-dark select, .ox-ops-dark dialog { background: #171717; color: #e5e7eb; border-color: #404040; }
.ox-ops-dark .model-switch, .ox-ops-dark .test-switch, .ox-ops-dark .cache-table th { background: #262626; }
.ox-ops-dark .model-tab.active, .ox-ops-dark .test-tab.active { background: #404040; color: #93c5fd; }
.ox-ops-dark .candy-answer, .ox-ops-dark .artwork { background: #171717; }
.ox-ops-dark .candy-answer .placeholder p, .ox-ops-dark .cache-metrics > div:last-child strong { color: #e5e7eb; }
.ox-ops-dark .observation.candy-wrong { border-color: #b45353; }
.ox-ops-dark .observation.candy-wrong .item-head { background: #451a1a; }
.ox-ops-dark .observation.candy-wrong .candy-answer .placeholder p { color: #fca5a5; }
@media (min-width: 1400px) { .ox-ops-embedded .gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 650px) {
  .ox-ops-tabs { gap: 20px; margin-bottom: 20px; }
  .ox-ops-frame { height: max(660px, calc(100dvh - 170px)); }
  .ox-ops-embedded .gallery { grid-template-columns: minmax(0, 1fr); }
}
