:root {
    --sr-primary: #001a4d;
    --sr-primary-2: #0033a0;
    --sr-surface: #ffffff;
    --sr-page: #f4f6fa;
    --sr-border: #dde1e7;
    --sr-text: #1a1a2e;
    --sr-muted: #5f6b7a;
    --sr-success: #16a34a;
    --sr-danger: #dc2626;
    --sr-warning: #f59e0b;
    --sr-radius: 10px;
    --sr-shadow: 0 12px 32px rgba(0, 26, 77, 0.12);
    --sr-shadow-soft: 0 4px 14px rgba(0, 26, 77, 0.08);
    --sr-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

html {
    min-height: 100%;
    background: var(--sr-page);
}

body {
    font-family: var(--sr-font);
    color: var(--sr-text);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

button,
input {
    font: inherit;
}

button:focus-visible,
input:focus-visible,
a:focus-visible {
    outline: 3px solid rgba(0, 51, 160, 0.35);
    outline-offset: 2px;
}

.sr-brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    font-weight: 800;
    letter-spacing: 0;
}

.sr-card {
    background: var(--sr-surface);
    border: 1px solid rgba(221, 225, 231, 0.8);
    border-radius: var(--sr-radius);
    box-shadow: var(--sr-shadow-soft);
}

.sr-status-row {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--sr-muted);
    font-size: 13px;
}

.sr-status-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: currentColor;
}

.sr-empty-state {
    padding: 28px;
    text-align: center;
    color: var(--sr-muted);
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.001ms !important;
    }
}