/* Inline geometry has no image canvas for a browser to tint in forced dark mode. */
.opsmeca-wordmark {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
    background: transparent;
    color: #162a44;
    --opsmeca-outline: #f7f9fc;
    --opsmeca-metal: #87919c;
    --opsmeca-accent: #801f34;
}
.opsmeca-wordmark path {
    stroke: var(--opsmeca-outline);
    stroke-width: 1.5px;
    stroke-linejoin: round;
    paint-order: stroke fill;
    vector-effect: non-scaling-stroke;
}
.opsmeca-ink { fill: currentColor; }
.opsmeca-metal { fill: var(--opsmeca-metal); }
.opsmeca-accent { fill: var(--opsmeca-accent); }
.logo-box .opsmeca-login-brand {
    display: flex;
    align-items: center;
    width: 168px;
    height: 34px;
    background: transparent;
}
/* The contrasting outline also keeps the mark legible when a browser forces
   a dark surface without exposing that preference to the page. */
@media (prefers-color-scheme: dark) {
    .opsmeca-wordmark {
        color: #eef2f7;
        --opsmeca-outline: #162a44;
        --opsmeca-metal: #bcc5d0;
        --opsmeca-accent: #e67b94;
    }
}
@media (forced-colors: active) {
    .opsmeca-wordmark { color: CanvasText; --opsmeca-outline: Canvas; }
    .opsmeca-metal, .opsmeca-accent { fill: currentColor; }
}