/* v1.0.3: Critical first-paint geometry is also inline in the markup.
   That prevents flashes of wrapped text when Safari receives CSS late. */
/* This bar occupies normal document flow, above the theme's header. */
.stmq-marquee {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    width: 100%;
    height: 37px;
    min-height: 37px;
    max-height: 37px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    white-space: nowrap;
    background: var(--stmq-bg, #172B25);
    color: var(--stmq-fg, #FFFFFF);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.035em;
    text-transform: none;
}

.stmq-marquee[hidden] {
    display: none !important;
}

.stmq-marquee *, .stmq-marquee *::before, .stmq-marquee *::after {
    box-sizing: border-box;
}

.stmq-viewport {
    flex: 0 0 100%;
    min-width: 0;
    overflow: hidden;
    width: 100%;
    white-space: nowrap;
    /* Inline visibility:hidden protects the first paint if this CSS is delayed. */
}

.stmq-track,
.stmq-group,
.stmq-unit {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    width: max-content;
    white-space: nowrap;
}

.stmq-message {
    flex: 0 0 auto;
    padding: 0 23px;
    color: inherit;
}

.stmq-divider {
    flex: 0 0 auto;
    color: inherit;
    font-size: 1.15em;
    opacity: .75;
}

.stmq-marquee[data-ready="true"] .stmq-track {
    animation: stmq-travel var(--stmq-duration, 24s) linear infinite;
    will-change: transform;
}

.stmq-marquee:hover .stmq-track {
    animation-play-state: paused;
}

@keyframes stmq-travel {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Announcements remain available to screen readers without repeating them endlessly. */
.stmq-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

@media (prefers-reduced-motion: reduce) {
    .stmq-marquee[data-ready="true"] .stmq-track {
        animation: none !important;
        will-change: auto;
    }
    .stmq-group + .stmq-group {
        display: none;
    }
}