/* PusakoSignal — transparent charcoal/gold polish. Existing marquee JS stays unchanged. */
.pn-signal[aria-labelledby="pnSignalTitle"] {
    margin: 8px 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__head {
    gap: 16px;
    margin-bottom: 8px;
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__head::after {
    content: none;
    margin-left: auto;
    background: none;
    color: #8c7134;
    font-size: 9px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: .16em;
    white-space: nowrap;
}
.pn-signal[aria-labelledby="pnSignalTitle"] #pnSignalTitle {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 9px;
    margin: 0;
    color: #302d27;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.025em;
}
.pn-signal[aria-labelledby="pnSignalTitle"] #pnSignalTitle::before {
    content: "";
    display: inline-block;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30' fill='none' stroke='%23ad8539' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M6 6a13 13 0 0 0 0 18M24 6a13 13 0 0 1 0 18M10 10a7 7 0 0 0 0 10M20 10a7 7 0 0 1 0 10'/%3E%3Ccircle cx='15' cy='15' r='2.6' fill='%23ad8539' stroke='none'/%3E%3C/svg%3E");
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__lanes {
    gap: 9px;
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__gate {
    padding: 7px 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    -webkit-mask-image: linear-gradient(to right, transparent, #000 16px, #000 calc(100% - 16px), transparent);
    mask-image: linear-gradient(to right, transparent, #000 16px, #000 calc(100% - 16px), transparent);
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__gate + .pn-signal__gate {
    border-top: 0;
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item {
    position: relative;
    padding-bottom: 0;
    color: #3d3931;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.35;
    text-decoration: none;
    background: transparent;
    transition: color .18s ease;
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item::after {
    content: none;
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item:hover,
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item:focus-visible {
    color: #8b661e;
    text-decoration: none;
}

.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item:focus-visible {
    outline: 1px solid #ad8539;
    outline-offset: 3px;
}
.pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__sep {
    margin: 0 17px;
    color: #ad8539;
    font-size: 7px;
    opacity: .85;
}
/* Only the hovered category moves; its marquee keeps the existing hover pause. */
@media (hover: hover) and (pointer: fine) {
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item:hover {
        animation: pnSignalCategoryNudge .34s ease-in-out 1;
        transform-origin: 50% 65%;
    }
}
@keyframes pnSignalCategoryNudge {
    0%, 100% { transform: translateX(0) rotate(0); }
    20% { transform: translateX(-1.2px) rotate(-.35deg); }
    40% { transform: translateX(1.2px) rotate(.35deg); }
    60% { transform: translateX(-.7px) rotate(-.2deg); }
    80% { transform: translateX(.5px) rotate(.2deg); }
}
@media (max-width: 700px) {
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__head { gap: 12px; margin-bottom: 7px; }
    .pn-signal[aria-labelledby="pnSignalTitle"] #pnSignalTitle { gap: 7px; font-size: 23px; }
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__head::after { font-size: 8px; letter-spacing: .07em; }
    .pn-signal[aria-labelledby="pnSignalTitle"] #pnSignalTitle::before { flex-basis: 24px; width: 24px; height: 24px; }
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__gate {
        padding: 7px 0;
        -webkit-mask-image: linear-gradient(to right, transparent, #000 9px, #000 calc(100% - 9px), transparent);
        mask-image: linear-gradient(to right, transparent, #000 9px, #000 calc(100% - 9px), transparent);
    }
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item { font-size: 15px; }
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__sep { margin: 0 13px; font-size: 6px; }
}
@media (prefers-reduced-motion: reduce) {
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item,
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item::after { transition: none; }
    .pn-signal[aria-labelledby="pnSignalTitle"] .pn-signal__item:hover { animation: none; }
}