.fish-parade-debug-panel { --debug-accent: #6be2cf; }
.fish-parade-debug-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fish-parade-debug-panel > header > div { display: grid; gap: 1px; }
.fish-parade-debug-panel > header span { color: #a9c8ca; font-size: 10px; }
.fish-parade-debug-panel > header button { width: 30px; height: 30px; border-radius: 8px; }
.fish-parade-event-card { margin: 10px; padding: 10px; border: 1px solid rgba(107, 226, 207, .22); border-radius: 10px; background: rgba(5, 18, 21, .56); }
.fish-parade-event-card > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.fish-parade-event-card > div:first-child strong { color: #9cf5e3; font-size: 13px; }
.fish-parade-event-card > div:first-child span { color: #89a9ad; font-size: 8px; }
.fish-parade-event-card > div:first-child[data-state="paused"] strong { color: #ffd37e; }
.fish-parade-event-card > div:first-child[data-state="completed"] strong { color: #b7c6c9; }
.fish-parade-event-card p, .fish-parade-next-run { margin: 7px 0; color: #91adb1; font-size: 9px; line-height: 1.4; }
.fish-parade-species { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.fish-parade-species span { overflow: hidden; padding: 5px 3px; border-radius: 6px; background: rgba(107, 226, 207, .07); color: #c7e8e5; font-size: 8px; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.fish-parade-actions { display: grid; grid-template-columns: 1fr auto; gap: 6px; margin-top: 9px; }
.fish-parade-actions button { min-height: 30px; border-radius: 7px; font-size: 10px; font-weight: 850; }
.fish-parade-runtime { display: grid; gap: 2px; margin: 0 10px 8px; padding: 8px 10px; border: 1px solid rgba(107, 226, 207, .18); border-radius: 9px; background: rgba(255,255,255,.035); }
.fish-parade-runtime strong { color: #b7f4e9; font-size: 11px; }
.fish-parade-runtime span { color: #8faeb2; font-size: 8px; }
.fish-parade-runtime[data-state="paused"] { border-color: rgba(255, 203, 104, .35); }
.fish-parade-next-run { margin: 0 10px 8px; padding: 6px 8px; border-left: 2px solid rgba(255, 204, 104, .55); background: rgba(255, 196, 81, .05); }
.fish-parade-controls { display: grid; gap: 9px; padding: 0 10px 10px; }
.fish-parade-controls label { display: grid; gap: 4px; }
.fish-parade-controls label > span { display: flex; justify-content: space-between; gap: 8px; font-size: 10px; }
.fish-parade-controls output { color: #aaf2e5; font-weight: 850; }
.fish-parade-controls input { width: 100%; }
.fish-parade-controls small { color: #78989c; font-size: 8px; line-height: 1.3; }
.fish-parade-debug-panel > footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.fish-parade-debug-panel > footer > div { display: flex; gap: 6px; }
.fish-parade-debug-panel > footer button { padding: 6px 8px; border-radius: 7px; font-size: 9px; font-weight: 800; }
.fish-parade-debug-panel [data-state="error"] { color: #ff806e; }
.fish-parade-debug-panel [data-state="saved"] { color: #83eda5; }

.fish-parade-select-control select { width: 100%; min-height: 32px; padding: 6px 8px; border: 1px solid rgba(107, 226, 207, .28); border-radius: 7px; background: rgba(5, 18, 21, .9); color: #d8f8f2; font: 800 10px/1.2 Arial, sans-serif; }
.fish-parade-select-control select:focus-visible { outline: 2px solid rgba(107, 226, 207, .65); outline-offset: 1px; }