:root {
    color-scheme: light;
    --streamtools-icon-background: #0b1220;
    --streamtools-background-start: #dbeafe;
    --streamtools-background-end: #f8fafc;
}
[data-bs-theme='dark'] {
    color-scheme: dark;
    --streamtools-background-start: #172554;
    --streamtools-background-end: var(--streamtools-icon-background);
}
body { min-height: 100vh; background: radial-gradient(circle at top, var(--streamtools-background-start) 0, var(--streamtools-background-end) 42rem); }
.app-header { position: relative; z-index: 1030; }
.theme-toggle { width: 2.5rem; height: 2.5rem; display: inline-flex; align-items: center; justify-content: center; }
.theme-icon-dark,
[data-bs-theme='dark'] .theme-icon-light { display: none; }
[data-bs-theme='dark'] .theme-icon-dark { display: inline-block; }
.content-card { max-width: 44rem; margin-inline: auto; }
.widget-stage { min-height: 16rem; border: 1px dashed var(--bs-border-color); border-radius: 1rem; background: rgba(0, 0, 0, .18); }
.table > :not(caption) > * > * { vertical-align: middle; }
.widget-preview-frame { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--bs-border-color); border-radius: .75rem; background: repeating-conic-gradient(#334155 0 25%, #1e293b 0 50%) 50% / 24px 24px; }
.widget-preview-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.widget-config-scroll { scrollbar-gutter: stable; }
.widget-color-control .clr-field { display: block; width: 100%; }
.widget-color-control .clr-field input { width: 100%; padding-right: 3rem; font-family: var(--bs-font-monospace); }
.widget-color-control .clr-field button { width: 2.5rem; border-left: 1px solid var(--bs-border-color); border-radius: 0 var(--bs-border-radius) var(--bs-border-radius) 0; pointer-events: auto; }
.message-inbox-message { min-width: 18rem; max-width: 52rem; overflow-wrap: anywhere; white-space: normal; }
.card[data-widget-error-target].is-invalid { border-color: var(--bs-form-invalid-border-color); box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--bs-form-invalid-border-color) 24%, transparent); }
.local-time--compact { white-space: pre-line; }
.email-preview-stage { width: 100%; min-height: 30rem; aspect-ratio: 4 / 3; background: #f5f7fa; }
.email-plain-text-preview { min-height: 30rem; max-height: 46rem; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--bs-body-color); background: var(--bs-tertiary-bg); }
.clr-picker { z-index: 1090; font-family: var(--bs-body-font-family); }
.clr-picker.clr-dark { border: 1px solid var(--bs-border-color); background-color: var(--bs-tertiary-bg); }
.clr-picker input.clr-color { font-family: var(--bs-font-monospace); }
@media (min-width: 992px) {
    .widget-editor-preview { position: sticky; top: 1rem; }
    .widget-config-scroll { max-height: calc(100vh - 7rem); overflow-y: auto; padding-right: .4rem; }
}
