/* Shared RSIL foundations. Load before module styles; keep scientific palettes local. */
:root {
    --rsil-font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --rsil-font-serif: Georgia, "Times New Roman", serif;
    --rsil-font-mono: ui-monospace, "Cascadia Code", Consolas, monospace;
    --rsil-brand: #c8102e;
    --rsil-brand-hover: #a30d26;
    --rsil-brand-soft: #fff1f3;
    --rsil-gold: #f1be48;
    --rsil-canvas: #f6f7f9;
    --rsil-surface: #fff;
    --rsil-text: #202a35;
    --rsil-muted: #586575;
    --rsil-border: #dce1e7;
    --rsil-success: #18794e;
    --rsil-success-hover: #12633f;
    --rsil-danger: #b42318;
    --rsil-danger-hover: #911f16;
    --rsil-warning-text: #3a2a05;
    --rsil-space-xs: 0.25rem;
    --rsil-space-sm: 0.5rem;
    --rsil-space-md: 0.75rem;
    --rsil-space-lg: 1rem;
    --rsil-space-xl: 1.5rem;
    --rsil-radius-sm: 0.375rem;
    --rsil-radius-md: 0.625rem;
    --rsil-radius-lg: 1rem;
    --rsil-shadow-sm: 0 1px 3px rgb(24 39 55 / 6%);
    --rsil-shadow-md: 0 8px 24px rgb(24 39 55 / 8%);
    --rsil-focus: #a30d26;
    --rsil-control-height: 2.75rem;
    --rsil-control-compact: 2rem;
}

.rsil-theme-dark {
    --rsil-canvas: #1e1e1e;
    --rsil-surface: #2d2d30;
    --rsil-text: #e6e6e6;
    --rsil-muted: #b2bac5;
    --rsil-border: #454545;
    --rsil-brand-soft: #3a2027;
    --rsil-focus: #f1be48;
    --rsil-shadow-sm: 0 1px 3px rgb(0 0 0 / 20%);
    --rsil-shadow-md: 0 8px 24px rgb(0 0 0 / 35%);
    color-scheme: dark;
    background: var(--rsil-canvas);
    color: var(--rsil-text);
}

:where(*, *::before, *::after) {
    box-sizing: border-box;
}

:where(body) {
    margin: 0;
    font-family: var(--rsil-font-sans);
    line-height: 1.5;
}

:where(button, input, select, textarea) {
    font: inherit;
}

/* Root-qualified components take ownership over unscoped framework defaults. */
:root .rsil-button {
    --rsil-button-bg: var(--rsil-brand);
    --rsil-button-hover: var(--rsil-brand-hover);
    --rsil-button-color: #fff;
    --rsil-button-border: var(--rsil-brand);
    --bs-btn-active-bg: var(--rsil-button-hover);
    --bs-btn-active-border-color: var(--rsil-button-border);
    --bs-btn-active-color: var(--rsil-button-color);
    --bs-btn-focus-shadow-rgb: 200, 16, 46;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--rsil-space-sm);
    min-height: var(--rsil-control-height);
    padding: 0.6rem 1rem;
    border: 1px solid var(--rsil-button-border);
    border-radius: var(--rsil-radius-sm);
    background: var(--rsil-button-bg);
    color: var(--rsil-button-color);
    font: 600 0.875rem/1.4 var(--rsil-font-sans);
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
}

:root .rsil-button:hover {
    background: var(--rsil-button-hover);
    color: var(--rsil-button-color);
    border-color: var(--rsil-button-border);
}

:root .rsil-button-secondary {
    --rsil-button-bg: var(--rsil-surface);
    --rsil-button-hover: var(--rsil-brand-soft);
    --rsil-button-color: var(--rsil-text);
    --rsil-button-border: var(--rsil-border);
}

:root .rsil-button-danger {
    --rsil-button-bg: var(--rsil-danger);
    --rsil-button-hover: var(--rsil-danger-hover);
    --rsil-button-border: var(--rsil-danger);
}

:root .rsil-button-warning {
    --rsil-button-bg: var(--rsil-gold);
    --rsil-button-hover: var(--rsil-gold);
    --rsil-button-color: var(--rsil-warning-text);
    --rsil-button-border: var(--rsil-gold);
}

:root .rsil-button[hidden] {
    display: none;
}

:root .rsil-button:disabled {
    opacity: 0.5;
    cursor: default;
}

:root .rsil-button-icon {
    flex-shrink: 0;
    min-height: var(--rsil-control-compact);
    width: var(--rsil-control-compact);
    height: var(--rsil-control-compact);
    padding: 0;
}

:root .rsil-field {
    width: 100%;
    min-width: 0;
    min-height: var(--rsil-control-height);
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--rsil-border);
    border-radius: var(--rsil-radius-sm);
    background-color: var(--rsil-surface);
    color: var(--rsil-text);
    font: 1rem/1.4 var(--rsil-font-sans);
    transition: border-color 0.15s;
}

:root .rsil-field::placeholder { color: var(--rsil-muted); }
:root .rsil-field:focus {
    border-color: var(--rsil-brand);
    box-shadow: none;
}

:root .rsil-button:focus-visible,
:root .rsil-field:focus-visible {
    outline: 2px solid var(--rsil-focus);
    outline-offset: 3px;
}

.rsil-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    flex-shrink: 0;
}

.rsil-icon-spin {
    animation: rsil-spin 0.9s linear infinite;
}

@keyframes rsil-spin {
    to { transform: rotate(360deg); }
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 2px solid var(--rsil-focus);
    outline-offset: 3px;
}

/* Honor the OS preference even when a module defines its own animation. */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}