.senayan-comment-reactions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.fob-comment-reaction,
.fob-comment-reaction-login {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 42px;
    height: 30px;
    padding: 0 9px;
    border: 1px solid #d9dee5;
    border-radius: 999px;
    background: #fff;
    color: #67717d;
    font: 700 12px/1 var(--sp-sans, "Plus Jakarta Sans", sans-serif);
    text-decoration: none;
    transition: color .18s, border-color .18s, background .18s, transform .18s;
}

.fob-comment-reaction:hover,
.fob-comment-reaction-login:hover {
    border-color: #df101b;
    color: #df101b;
    transform: translateY(-1px);
}

.fob-comment-reaction.is-active {
    border-color: #df101b;
    background: #df101b;
    color: #fff;
}

.fob-comment-reaction[data-reaction="dislike"].is-active {
    border-color: #25364a;
    background: #25364a;
}

.fob-comment-reaction:disabled {
    cursor: wait;
    opacity: .6;
}

.fob-comment-item.is-new-comment > .fob-comment-item-inner {
    animation: senayanCommentArrive 2.8s ease;
}

@keyframes senayanCommentArrive {
    0%, 35% { background: #fff4cf; box-shadow: 0 0 0 10px #fff4cf; }
    100% { background: transparent; box-shadow: 0 0 0 0 transparent; }
}

@media (max-width: 600px) {
    .fob-comment-item-footer { align-items: flex-start; gap: 10px; flex-direction: column; }
    .fob-comment-item-actions { width: 100%; justify-content: space-between; }
    .fob-comment-reaction, .fob-comment-reaction-login { min-width: 44px; height: 34px; }
}