/* All selectors are scoped; inherit the site's Persian typeface. */
.flpa-toolbar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    width: fit-content;
    max-width: 100%;
    min-height: 44px;
    margin: 10px auto 16px;
    padding: 0;
    direction: rtl;
    font: inherit;
    line-height: 1.5;
    box-sizing: border-box;
    clear: both;
    position: relative;
    z-index: 1;
}
.flpa-toolbar .flpa-action {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 88px;
    min-height: 42px;
    margin: 0;
    padding: 8px 14px;
    box-sizing: border-box;
    border: 1px solid #e8e5e7;
    border-radius: 999px;
    background: #fff;
    color: #3d343b;
    box-shadow: 0 2px 7px rgb(35 20 32 / 4%);
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: none !important;
    text-transform: none;
    letter-spacing: normal;
    white-space: nowrap;
    cursor: pointer;
    vertical-align: middle;
    -webkit-tap-highlight-color: transparent;
    transition: color .18s, border-color .18s, background-color .18s, transform .18s;
}
.flpa-toolbar .flpa-action::before,
.flpa-toolbar .flpa-action::after { content: none; }
.flpa-toolbar .flpa-action:hover {
    background: #fbf8f9;
    border-color: #d9cdd2;
    color: #31242c;
    transform: translateY(-1px);
}
.flpa-toolbar .flpa-action:active { transform: scale(.97); }
.flpa-toolbar .flpa-action:focus-visible {
    outline: 2px solid var(--flpa-accent, #df3864);
    outline-offset: 3px;
}
.flpa-toolbar .flpa-action svg {
    display: block;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}
.flpa-toolbar .flpa-count {
    display: inline-block;
    min-width: 1.4em;
    font: inherit;
    font-variant-numeric: tabular-nums;
    text-align: center;
    direction: ltr;
}
.flpa-toolbar .flpa-liked {
    color: var(--flpa-accent, #df3864);
    border-color: var(--flpa-accent, #df3864);
    background: #fff5f7;
}
.flpa-toolbar .flpa-liked:hover { color: var(--flpa-accent, #df3864); background: #fff0f4; }
.flpa-toolbar .flpa-liked svg { fill: currentColor; }
.flpa-toolbar .flpa-action:disabled { cursor: wait; opacity: .65; transform: none; }
.flpa-toolbar .flpa-action[aria-busy="true"] svg { animation: flpa-pending .75s ease-in-out infinite; }
.flpa-burst {
    display: block;
    position: fixed;
    width: 120px;
    height: 120px;
    margin: -60px 0 0 -60px;
    padding: 0;
    z-index: 2147483646;
    pointer-events: none;
    user-select: none;
    isolation: isolate;
}
.flpa-burst-heart {
    position: absolute;
    inset: 0;
    display: block;
    animation: flpa-heart-pop 1s cubic-bezier(.16,.8,.3,1) both;
    filter: drop-shadow(0 5px 12px rgb(67 7 30 / 32%));
}
.flpa-burst svg { display: block; width: 100%; height: 100%; fill: #fff; stroke: none; }
.flpa-particle {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -8px;
    animation: flpa-particle-pop .9s .08s ease-out both;
}
.flpa-particle svg { fill: var(--flpa-accent, #df3864); filter: drop-shadow(0 1px 2px rgb(255 255 255 / 85%)); }
.flpa-toast {
    position: fixed;
    bottom: max(28px, env(safe-area-inset-bottom));
    left: 50%;
    width: max-content;
    max-width: calc(100vw - 40px);
    padding: 12px 20px;
    border-radius: 14px;
    background: #32252e;
    color: #fff;
    box-shadow: 0 7px 28px rgb(20 10 18 / 20%);
    font-family: inherit;
    font-size: 14px;
    line-height: 1.8;
    text-align: center;
    z-index: 2147483647;
    transform: translate(-50%, 10px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s, transform .2s, visibility .2s;
}
.flpa-toast-visible { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
@keyframes flpa-pending { 50% { opacity: .4; transform: scale(.88); } }
@keyframes flpa-heart-pop {
    0% { opacity: 0; transform: scale(.15) rotate(-18deg); }
    20% { opacity: 1; transform: scale(1.16) rotate(5deg); }
    36% { opacity: 1; transform: scale(.95) rotate(-3deg); }
    50%, 70% { opacity: 1; transform: scale(1) rotate(0); }
    100% { opacity: 0; transform: translateY(-18px) scale(1.18); }
}
@keyframes flpa-particle-pop {
    0% { opacity: 0; transform: scale(.2); }
    20% { opacity: 1; }
    100% { opacity: 0; transform: translate(var(--flpa-x), var(--flpa-y)) rotate(var(--flpa-r)) scale(.35); }
}
@media (max-width: 380px) {
    .flpa-toolbar { gap: 6px; }
    .flpa-toolbar .flpa-action { padding: 8px 11px; font-size: 12px; min-width: 76px; }
}
@media (prefers-reduced-motion: reduce) {
    .flpa-toolbar .flpa-action, .flpa-toast { transition: none; }
    .flpa-toolbar .flpa-action[aria-busy="true"] svg { animation: none; }
    .flpa-burst-heart { animation: flpa-reduced .3s ease both; }
    .flpa-particle { display: none; }
}
@keyframes flpa-reduced { 0%, 100% { opacity: 0; } 30%, 65% { opacity: 1; } }

/* A short instruction over the image; never intercept taps or shift the article. */
img.flpa-double-tap { touch-action: manipulation; }
.flpa-first-like-hint {
    position: fixed;
    z-index: 2147483643;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    box-sizing: border-box;
    padding: 14px 12px;
    border: 1px solid rgb(255 255 255 / 30%);
    border-radius: 20px;
    background: rgb(34 22 32 / 87%);
    color: #fff;
    box-shadow: 0 6px 26px rgb(20 8 16 / 18%);
    font-family: inherit;
    text-align: center;
    direction: rtl;
    user-select: none;
    transform: translate(-50%, -50%);
    animation: flpa-hint-lifetime 4.2s ease both;
}
.flpa-first-like-hint, .flpa-first-like-hint * { pointer-events: none !important; }
.flpa-first-like-hint .flpa-hint-text { display: block; font-size: 14px; font-weight: 600; line-height: 24px; }
.flpa-first-like-hint .flpa-hint-gesture { display: block; position: relative; width: 80px; height: 64px; }
.flpa-first-like-hint .flpa-hint-hand {
    position: absolute; left: 7px; top: 0; width: 56px; height: 62px;
    fill: #fff; stroke: #fff; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round;
    transform-origin: 50% 14px;
    animation: flpa-hint-double-tap 1.9s ease-in-out 2;
}
.flpa-first-like-hint .flpa-hint-ring {
    position: absolute; left: 32px; top: 14px; width: 32px; height: 32px;
    margin: -16px 0 0 -16px; border: 2px solid #ffc7dc; border-radius: 50%; box-sizing: border-box;
    opacity: 0; animation: flpa-hint-ripple 1.9s ease-out 2;
}
.flpa-first-like-hint .flpa-hint-ring-two { animation-delay: .34s; }
.flpa-first-like-hint .flpa-hint-heart {
    position: absolute; right: 0; top: 0; width: 22px; height: 22px; opacity: 0;
    animation: flpa-hint-heart 1.9s ease-out 2;
}
.flpa-first-like-hint .flpa-hint-heart svg { display: block; width: 100%; height: 100%; fill: #ffadc9; stroke: none; }
@keyframes flpa-hint-lifetime { 0%, 100% { opacity: 0; } 7%, 90% { opacity: 1; } }
@keyframes flpa-hint-double-tap {
    0%, 8%, 27%, 46%, 100% { transform: translateY(-3px) scale(1); }
    17%, 35% { transform: translateY(3px) scale(.92); }
}
@keyframes flpa-hint-ripple {
    0%, 12% { opacity: 0; transform: scale(.15); }
    18% { opacity: .95; }
    42%, 100% { opacity: 0; transform: scale(1.5); }
}
@keyframes flpa-hint-heart {
    0%, 39% { opacity: 0; transform: scale(.2); }
    53%, 74% { opacity: 1; transform: scale(1.1); }
    95%, 100% { opacity: 0; transform: translateY(-6px) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .flpa-first-like-hint, .flpa-first-like-hint * { animation: none !important; }
    .flpa-first-like-hint .flpa-hint-ring { display: none; }
    .flpa-first-like-hint .flpa-hint-heart { opacity: 1; }
}
