/*
 * SICR Gaming - "Arcade Night" theme. See BRAND.md for the rules behind these values.
 * Loaded after Bootstrap 5.3.2; base.html sets data-bs-theme="dark".
 */

/* ---- Brand tokens ---- */
:root {
    --sicr-bg: #0F0B1E;
    --sicr-surface: #181230;
    --sicr-surface-2: #241B45;
    --sicr-border: #4A3F7A;
    --sicr-input-border: #8478C0;
    --sicr-text: #EDE9FE;
    --sicr-muted: #B4AED4;
    --sicr-magenta: #FF2E88;
    --sicr-magenta-hover: #FF5FA2;
    --sicr-magenta-active: #FF8AB9;
    /* Primary button fills: deeper magenta so white labels stay crisp (dark-on-neon looked blurry). */
    --sicr-btn-fill: #C8106A;          /* white 5.62:1 */
    --sicr-btn-fill-hover: #D81B76;    /* white 4.84:1 */
    --sicr-btn-fill-active: #A30D57;   /* white 7.63:1 */
    --sicr-cyan: #22D3EE;
    --sicr-cyan-hover: #67E8F9;
    --sicr-cyan-active: #A5F3FC;
    --sicr-green: #34D399;
    --sicr-amber: #FBBF24;
    --sicr-red: #F87171;
    --sicr-slate: #4B4570;

    --sicr-font-display: "Press Start 2P", "Courier New", monospace;
    --sicr-font-ui: "Quantico", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --sicr-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --sicr-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* ---- Map tokens onto Bootstrap 5.3 (dark mode) ---- */
[data-bs-theme=dark] {
    --bs-body-bg: var(--sicr-bg);
    --bs-body-bg-rgb: 15, 11, 30;
    --bs-body-color: var(--sicr-text);
    --bs-body-color-rgb: 237, 233, 254;
    --bs-body-font-family: var(--sicr-font-body);
    --bs-emphasis-color: #FFFFFF;
    --bs-secondary-color: var(--sicr-muted);
    --bs-secondary-color-rgb: 180, 174, 212;
    --bs-secondary-bg: var(--sicr-surface-2);
    --bs-tertiary-bg: var(--sicr-surface);
    --bs-border-color: var(--sicr-border);
    --bs-border-color-translucent: rgba(74, 63, 122, 0.6);

    --bs-primary: var(--sicr-magenta);
    --bs-primary-rgb: 255, 46, 136;
    --bs-secondary: var(--sicr-slate);
    --bs-secondary-rgb: 75, 69, 112;
    --bs-success: var(--sicr-green);
    --bs-success-rgb: 52, 211, 153;
    --bs-info: var(--sicr-cyan);
    --bs-info-rgb: 34, 211, 238;
    --bs-warning: var(--sicr-amber);
    --bs-warning-rgb: 251, 191, 36;
    --bs-danger: var(--sicr-red);
    --bs-danger-rgb: 248, 113, 113;

    --bs-link-color: var(--sicr-cyan);
    --bs-link-color-rgb: 34, 211, 238;
    --bs-link-hover-color: var(--sicr-cyan-hover);
    --bs-link-hover-color-rgb: 103, 232, 249;

    --bs-focus-ring-color: rgba(34, 211, 238, 0.45);
    --bs-heading-color: #FFFFFF;
    --bs-code-color: var(--sicr-magenta-hover);
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: var(--sicr-bg);
    font-family: var(--sicr-font-body);
}

main {
    flex: 1 0 auto;
}

a {
    text-underline-offset: 0.2em;
}

/* Visible focus for everything interactive: cyan ring (>= 3:1 on all surfaces). */
:focus-visible {
    outline: 2px solid var(--sicr-cyan);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(34, 211, 238, 0.25);
}

::selection {
    background: var(--sicr-magenta);
    color: var(--sicr-bg);
}

/* ---- Wordmark and display type (Press Start 2P: logo/hero only) ---- */
.sicr-wordmark,
.sicr-display {
    font-family: var(--sicr-font-display);
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.4;
}

.sicr-wordmark {
    font-size: 1rem;
    line-height: 1;
    text-decoration: none;
    color: var(--sicr-magenta);
    background: linear-gradient(90deg, var(--sicr-magenta), var(--sicr-cyan));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 6px rgba(255, 46, 136, 0.45));
    transition: filter 0.15s ease-in-out;
}

.sicr-wordmark:hover,
.sicr-wordmark:focus-visible {
    filter: drop-shadow(0 0 8px rgba(34, 211, 238, 0.7));
}

.sicr-display {
    font-size: clamp(1.25rem, 4vw, 2rem);
    color: var(--sicr-text);
    text-shadow: 0 0 14px rgba(255, 46, 136, 0.55);
}

.sicr-display .accent {
    color: var(--sicr-cyan);
    text-shadow: 0 0 14px rgba(34, 211, 238, 0.5);
}

/* ---- UI type (Quantico: headings, names, navigation, buttons, table headers) ---- */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.card-title,
.card-header,
.navbar .nav-link,
.navbar .btn,
.btn,
.badge,
.table > thead th,
.page-link,
.dropdown-item,
.nav-tabs .nav-link,
.nav-pills .nav-link,
.sicr-name {
    font-family: var(--sicr-font-ui);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.card-title {
    font-weight: 700;
    overflow-wrap: anywhere;
}

/* Type scale (BRAND.md): set on the elements so templates need no .h3/.h4 overrides. */
h1, .h1 {
    font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.25rem);
    line-height: 1.15;
    letter-spacing: 0;
}

h2, .h2 {
    font-size: clamp(1.3rem, 1.1rem + 0.6vw, 1.5rem);
    line-height: 1.2;
    letter-spacing: 0;
}

h3, .h3, .card-title {
    font-size: 1.125rem;
    line-height: 1.25;
    letter-spacing: 0.01em;
}

h4, h5, h6, .h4, .h5, .h6 {
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: 0.02em;
}

@media (min-width: 768px) {
    h3, .h3, .card-title {
        font-size: 1.1875rem;
    }
}

.lead {
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.55;
}

@media (min-width: 768px) {
    .lead {
        font-size: 1.1875rem;
    }
}

small, .small {
    font-size: 0.875rem;
    line-height: 1.45;
}

label, .form-label {
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.4;
}

.sicr-name {
    font-weight: 700;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

/* Names inside running text sit slightly smaller so Quantico and Inter feel matched. */
p .sicr-name,
.activity-item .sicr-name,
.sicr-meta .sicr-name {
    font-size: 0.95em;
    letter-spacing: 0;
}

.btn,
.nav-link {
    letter-spacing: 0.02em;
}

.btn {
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 700;
    --bs-btn-line-height: 1.25;
}

.btn-lg {
    --bs-btn-font-size: 1.125rem;
}

.btn-sm {
    --bs-btn-font-size: 0.875rem;
}

.nav-link {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
}

.nav-link.active {
    font-weight: 700;
}

.badge {
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.03em;
}

.table > thead th {
    font-size: 0.8125rem;
    line-height: 1.3;
    letter-spacing: 0.04em;
}

/* Prose measure: long user text is capped at a readable line length. */
.sicr-prose {
    max-width: 68ch;
    line-height: 1.6;
}

.sicr-prose p {
    margin-bottom: 1rem;
}

/* Error pages: the status code is the one place the pixel font is used outside the wordmark/hero. */
.sicr-error-code {
    font-family: var(--sicr-font-display);
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
    color: var(--sicr-magenta-hover);
    text-shadow: 0 0 14px rgba(255, 46, 136, 0.55);
}

@media (min-width: 768px) {
    .sicr-error-code {
        font-size: 3.5rem;
    }
}

/* Moderator counters */
.sicr-counter {
    font-family: var(--sicr-font-ui);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
}

/* Press Start 2P stays on the wordmark and hero display text. */
.sicr-wordmark,
.sicr-display {
    font-family: var(--sicr-font-display);
    letter-spacing: 0;
}

@media (max-width: 359.98px) {
    .sicr-wordmark {
        font-size: 0.75rem;
    }
}

/* Times and metric values */
.sicr-metric {
    font-family: var(--sicr-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 0.9375em;
    font-weight: 400;
}

/* ---- Navbar and footer ---- */
.sicr-navbar {
    --bs-navbar-color: var(--sicr-muted);
    --bs-navbar-hover-color: var(--sicr-cyan-hover);
    --bs-navbar-active-color: var(--sicr-cyan);
    --bs-navbar-brand-color: var(--sicr-text);
    --bs-navbar-brand-hover-color: var(--sicr-text);
    --bs-navbar-toggler-border-color: var(--sicr-border);
    background-color: var(--sicr-surface);
    border-bottom: 1px solid var(--sicr-magenta);
    box-shadow: 0 1px 14px rgba(255, 46, 136, 0.25);
}

.sicr-navbar .nav-link.active {
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.35em;
}

.sicr-navbar .btn.btn-link.nav-link {
    --bs-btn-font-weight: 400;
    color: var(--bs-nav-link-color);
    text-decoration: none;
    padding-top: var(--bs-nav-link-padding-y);
    padding-bottom: var(--bs-nav-link-padding-y);
}

.sicr-navbar .btn.btn-link.nav-link:hover {
    color: var(--bs-nav-link-hover-color);
}

.sicr-footer {
    background-color: var(--sicr-surface);
    border-top: 1px solid var(--sicr-border);
}

/* ---- Buttons (Bootstrap compiles colours, so set its button variables) ---- */
.btn-primary {
    --bs-btn-color: #FFFFFF;
    --bs-btn-bg: var(--sicr-btn-fill);
    --bs-btn-border-color: var(--sicr-magenta);
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: var(--sicr-btn-fill-hover);
    --bs-btn-hover-border-color: var(--sicr-magenta-hover);
    --bs-btn-focus-shadow-rgb: 34, 211, 238;
    --bs-btn-active-color: #FFFFFF;
    --bs-btn-active-bg: var(--sicr-btn-fill-active);
    --bs-btn-active-border-color: var(--sicr-magenta);
    --bs-btn-disabled-color: #FFFFFF;
    --bs-btn-disabled-bg: var(--sicr-btn-fill);
    --bs-btn-disabled-border-color: var(--sicr-btn-fill);
}

.btn-primary:hover,
.btn-primary:focus-visible {
    box-shadow: 0 0 14px rgba(255, 46, 136, 0.6);
}

.btn-info,
.btn-success {
    --bs-btn-color: var(--sicr-bg);
    --bs-btn-hover-color: var(--sicr-bg);
    --bs-btn-active-color: var(--sicr-bg);
    --bs-btn-disabled-color: var(--sicr-bg);
    --bs-btn-focus-shadow-rgb: 34, 211, 238;
}

.btn-info {
    --bs-btn-bg: var(--sicr-cyan);
    --bs-btn-border-color: var(--sicr-cyan);
    --bs-btn-hover-bg: var(--sicr-cyan-hover);
    --bs-btn-hover-border-color: var(--sicr-cyan-hover);
    --bs-btn-active-bg: var(--sicr-cyan-active);
    --bs-btn-active-border-color: var(--sicr-cyan-active);
    --bs-btn-disabled-bg: var(--sicr-cyan);
    --bs-btn-disabled-border-color: var(--sicr-cyan);
}

.btn-success {
    --bs-btn-bg: var(--sicr-green);
    --bs-btn-border-color: var(--sicr-green);
    --bs-btn-hover-bg: #6EE7B7;
    --bs-btn-hover-border-color: #6EE7B7;
    --bs-btn-active-bg: #A7F3D0;
    --bs-btn-active-border-color: #A7F3D0;
    --bs-btn-disabled-bg: var(--sicr-green);
    --bs-btn-disabled-border-color: var(--sicr-green);
}

.btn-danger {
    --bs-btn-color: var(--sicr-bg);
    --bs-btn-bg: var(--sicr-red);
    --bs-btn-border-color: var(--sicr-red);
    --bs-btn-hover-color: var(--sicr-bg);
    --bs-btn-hover-bg: #FCA5A5;
    --bs-btn-hover-border-color: #FCA5A5;
    --bs-btn-active-color: var(--sicr-bg);
    --bs-btn-active-bg: #FECACA;
    --bs-btn-active-border-color: #FECACA;
    --bs-btn-disabled-color: var(--sicr-bg);
    --bs-btn-disabled-bg: var(--sicr-red);
    --bs-btn-disabled-border-color: var(--sicr-red);
    --bs-btn-focus-shadow-rgb: 248, 113, 113;
}

/* Outline buttons: cyan by default, magenta for outline-primary. */
.btn-outline-secondary,
.btn-outline-info {
    --bs-btn-color: var(--sicr-cyan);
    --bs-btn-border-color: var(--sicr-cyan);
    --bs-btn-hover-color: var(--sicr-bg);
    --bs-btn-hover-bg: var(--sicr-cyan);
    --bs-btn-hover-border-color: var(--sicr-cyan);
    --bs-btn-focus-shadow-rgb: 34, 211, 238;
    --bs-btn-active-color: var(--sicr-bg);
    --bs-btn-active-bg: var(--sicr-cyan-hover);
    --bs-btn-active-border-color: var(--sicr-cyan-hover);
    --bs-btn-disabled-color: var(--sicr-muted);
    --bs-btn-disabled-border-color: var(--sicr-border);
}

.btn-outline-primary {
    --bs-btn-color: var(--sicr-magenta-hover);
    --bs-btn-border-color: var(--sicr-magenta);
    --bs-btn-hover-color: var(--sicr-bg);
    --bs-btn-hover-bg: var(--sicr-magenta);
    --bs-btn-hover-border-color: var(--sicr-magenta);
    --bs-btn-focus-shadow-rgb: 34, 211, 238;
    --bs-btn-active-color: var(--sicr-bg);
    --bs-btn-active-bg: var(--sicr-magenta-hover);
    --bs-btn-active-border-color: var(--sicr-magenta-hover);
    --bs-btn-disabled-color: var(--sicr-muted);
    --bs-btn-disabled-border-color: var(--sicr-border);
}

.btn-outline-success {
    --bs-btn-color: var(--sicr-green);
    --bs-btn-border-color: var(--sicr-green);
    --bs-btn-hover-color: var(--sicr-bg);
    --bs-btn-hover-bg: var(--sicr-green);
    --bs-btn-hover-border-color: var(--sicr-green);
    --bs-btn-active-color: var(--sicr-bg);
    --bs-btn-active-bg: #6EE7B7;
    --bs-btn-active-border-color: #6EE7B7;
}

.btn-outline-danger {
    --bs-btn-color: var(--sicr-red);
    --bs-btn-border-color: var(--sicr-red);
    --bs-btn-hover-color: var(--sicr-bg);
    --bs-btn-hover-bg: var(--sicr-red);
    --bs-btn-hover-border-color: var(--sicr-red);
    --bs-btn-active-color: var(--sicr-bg);
    --bs-btn-active-bg: #FCA5A5;
    --bs-btn-active-border-color: #FCA5A5;
}

.btn-link {
    --bs-btn-color: var(--sicr-cyan);
    --bs-btn-hover-color: var(--sicr-cyan-hover);
}

/* ---- Badges: dark text on bright fills; the label always states the status ---- */
.badge {
    color: var(--sicr-bg);
}

.badge.bg-secondary {
    color: #FFFFFF;
}

.badge.bg-warning,
.badge.bg-info {
    color: var(--sicr-bg) !important;
}

/* ---- Cards, lists, tables ---- */
.card {
    --bs-card-bg: var(--sicr-surface);
    --bs-card-cap-bg: var(--sicr-surface-2);
    --bs-card-border-color: var(--sicr-border);
}

.card-title a {
    color: var(--bs-heading-color);
    text-decoration: none;
}

.card-title a:hover,
.card-title a:focus-visible {
    color: var(--sicr-cyan-hover);
    text-decoration: underline;
}

/* Only cards that are wholly clickable (stretched link) get the cyan hover border. */
.card-link-hover:hover,
.card-link-hover:focus-within {
    border-color: var(--sicr-cyan);
}

/* Links inside a stretched-link card stay clickable above the overlay. */
.card-link-hover .card-text a {
    position: relative;
    z-index: 2;
}

.list-group {
    --bs-list-group-bg: var(--sicr-surface);
    --bs-list-group-border-color: var(--sicr-border);
    --bs-list-group-action-hover-bg: var(--sicr-surface-2);
    --bs-list-group-action-hover-color: var(--sicr-text);
    --bs-list-group-action-active-bg: var(--sicr-surface-2);
    --bs-list-group-action-active-color: var(--sicr-text);
}

.table {
    --bs-table-color: var(--sicr-text);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--sicr-border);
    --bs-table-striped-bg: rgba(237, 233, 254, 0.04);
    --bs-table-hover-bg: rgba(34, 211, 238, 0.08);
}

.table > thead th {
    color: var(--sicr-muted);
    font-weight: 700;
}

/* ---- Forms ---- */
/* Control borders use --sicr-input-border (>= 3:1 for UI components); --sicr-border stays decorative. */
.form-control,
.form-select {
    background-color: var(--sicr-surface-2);
    border-color: var(--sicr-input-border);
    color: var(--sicr-text);
}

.form-control:focus,
.form-select:focus {
    background-color: var(--sicr-surface-2);
    color: var(--sicr-text);
    border-color: var(--sicr-cyan);
    box-shadow: 0 0 0 0.25rem var(--bs-focus-ring-color);
}

/* Bootstrap sets outline:0 plus a blue glow on these; keep our cyan ring (WCAG 2.4.7). */
.nav-link:focus-visible,
.btn:focus-visible,
.page-link:focus-visible,
.dropdown-item:focus-visible {
    outline: 2px solid var(--sicr-cyan);
    outline-offset: 2px;
}

.form-check-input:focus {
    border-color: var(--sicr-cyan);
    outline: 2px solid var(--sicr-cyan);
    outline-offset: 2px;
    box-shadow: 0 0 0 0.25rem var(--bs-focus-ring-color);
}

.form-control:focus,
.form-select:focus {
    outline: 2px solid var(--sicr-cyan);
    outline-offset: 0;
}

/* Skip link: hidden until focused. */
.sicr-skip-link:focus {
    position: fixed;
    top: 0.5rem;
    left: 0.5rem;
    z-index: 2000;
    padding: 0.5rem 1rem;
    background: var(--sicr-cyan);
    color: #0F0B1E;
    font-weight: 700;
    border-radius: 0.375rem;
    text-decoration: none;
}

main:focus {
    outline: none;
}

.form-control::placeholder {
    color: var(--sicr-muted);
    opacity: 1;
}

.form-control:disabled,
.form-select:disabled {
    background-color: var(--sicr-surface);
    color: var(--sicr-muted);
}

.form-check-input {
    background-color: var(--sicr-surface-2);
    border-color: var(--sicr-input-border);
}

.form-check-input:checked {
    background-color: var(--sicr-magenta);
    border-color: var(--sicr-magenta);
}

.input-group-text {
    background-color: var(--sicr-surface);
    border-color: var(--sicr-border);
    color: var(--sicr-muted);
}

/* ---- Dropdowns, pagination, modals ---- */
.dropdown-menu {
    --bs-dropdown-bg: var(--sicr-surface-2);
    --bs-dropdown-border-color: var(--sicr-border);
    --bs-dropdown-link-color: var(--sicr-text);
    --bs-dropdown-link-hover-color: var(--sicr-text);
    --bs-dropdown-link-hover-bg: var(--sicr-surface);
    --bs-dropdown-link-active-color: var(--sicr-bg);
    --bs-dropdown-link-active-bg: var(--sicr-magenta);
}

.pagination {
    --bs-pagination-bg: var(--sicr-surface);
    --bs-pagination-color: var(--sicr-cyan);
    --bs-pagination-border-color: var(--sicr-border);
    --bs-pagination-hover-bg: var(--sicr-surface-2);
    --bs-pagination-hover-color: var(--sicr-cyan-hover);
    --bs-pagination-hover-border-color: var(--sicr-cyan);
    --bs-pagination-focus-bg: var(--sicr-surface-2);
    --bs-pagination-focus-color: var(--sicr-cyan-hover);
    --bs-pagination-active-bg: var(--sicr-magenta);
    --bs-pagination-active-color: var(--sicr-bg);
    --bs-pagination-active-border-color: var(--sicr-magenta);
    --bs-pagination-disabled-bg: var(--sicr-surface);
    --bs-pagination-disabled-color: var(--sicr-muted);
    --bs-pagination-disabled-border-color: var(--sicr-border);
}

.modal-content {
    background-color: var(--sicr-surface);
    border-color: var(--sicr-border);
}

/* Embedded players keep a neon frame so they sit well on the dark page. */
.ratio > iframe {
    border: 1px solid var(--sicr-border);
    border-radius: 0.375rem;
    background: #000;
}

hr {
    border-color: var(--sicr-border);
    opacity: 1;
}

/* ---- Landing page "stream overlay" touches (pure CSS, static) ---- */
.sicr-hero {
    position: relative;
    border: 1px solid var(--sicr-border);
    border-radius: 0.75rem;
    background-color: var(--sicr-surface);
    background-image:
        radial-gradient(ellipse at 20% 0%, rgba(255, 46, 136, 0.22), transparent 55%),
        radial-gradient(ellipse at 85% 100%, rgba(34, 211, 238, 0.18), transparent 55%),
        repeating-linear-gradient(0deg, rgba(237, 233, 254, 0.035) 0, rgba(237, 233, 254, 0.035) 1px, transparent 1px, transparent 4px);
    box-shadow: 0 0 32px rgba(255, 46, 136, 0.15), inset 0 0 0 1px rgba(34, 211, 238, 0.12);
}

.sicr-hero .lead {
    max-width: 40rem;
    margin-left: auto;
    margin-right: auto;
}

.sicr-live-tag {
    display: inline-block;
    font-family: var(--sicr-font-mono);
    font-size: 0.75rem;
    line-height: 1.3;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--sicr-bg);
    background: var(--sicr-cyan);
    border-radius: 0.25rem;
    padding: 0.15rem 0.5rem;
}

.sicr-step-number {
    font-family: var(--sicr-font-display);
    font-size: 1rem;
    line-height: 1;
    color: var(--sicr-magenta-hover);
    text-shadow: 0 0 10px rgba(255, 46, 136, 0.6);
}

/* Mobile: bigger tap targets */
@media (max-width: 767.98px) {
    .btn-sm {
        min-height: 2.75rem;
        padding: 0.5rem 0.875rem;
    }

    .navbar-collapse .nav-link {
        padding-block: 0.625rem;
    }
}

/* Anything that animates or fades is switched off for reduced-motion users. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition: none !important;
        animation: none !important;
        scroll-behavior: auto !important;
    }

    .sicr-wordmark,
    .sicr-display,
    .sicr-step-number,
    .btn-primary:hover {
        text-shadow: none;
    }
}

/* Windows high-contrast: gradient text would vanish, so use system colours. */
@media (forced-colors: active) {
    .sicr-wordmark {
        -webkit-text-fill-color: currentColor;
        background: none;
        filter: none;
        color: LinkText;
    }
}