/* Achievements & Feats of Power — plugin styles (plain CSS, no Tailwind build;
 * P-II: plugins ship their own stylesheet for non-core classes). Mirrors the v3
 * dark surface tokens used across the Profile page. */

/* Secondary category pill row inside the Achievements tab (lighter .fb-tab). */
.fb-ach-pillrow {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-bottom: 1rem;
}
.fb-ach-pill {
    appearance: none;
    background: rgba(30, 41, 59, .5);
    border: 1px solid rgba(51, 65, 85, .6);
    color: #94a3b8;
    border-radius: 9999px;
    padding: .35rem .75rem;
    font-size: .8rem;
    font-weight: 600;
    cursor: pointer;
    transition: color .15s, border-color .15s, background .15s;
}
.fb-ach-pill:hover { color: #e2e8f0; border-color: rgba(14, 165, 233, .4); }
.fb-ach-pill.active { color: #f8fafc; background: rgba(14, 165, 233, .15); border-color: #0ea5e9; }
.fb-ach-pill-badge {
    font-size: .7rem;
    font-weight: 700;
    color: #64748b;
    margin-left: .15rem;
}
.fb-ach-pill.active .fb-ach-pill-badge { color: #7dd3fc; }

/* Catalogue list. */
.fb-ach-list { display: flex; flex-direction: column; gap: .5rem; }
.fb-ach-item {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    padding: .75rem .9rem;
    border-radius: .6rem;
    border: 1px solid rgba(51, 65, 85, .5);
    background: rgba(30, 41, 59, .35);
}
.fb-ach-item.locked { opacity: .45; filter: grayscale(.6); }
.fb-ach-item.earned { border-color: rgba(14, 165, 233, .35); background: rgba(14, 165, 233, .06); }
.fb-ach-item-icon { font-size: 1.4rem; line-height: 1.6rem; flex: 0 0 auto; }
.fb-ach-item-body { min-width: 0; }
.fb-ach-item-title {
    font-size: .9rem;
    font-weight: 700;
    color: #f1f5f9;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.fb-ach-tier {
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 700;
    color: #7dd3fc;
    border: 1px solid rgba(125, 211, 252, .35);
    border-radius: 9999px;
    padding: .05rem .4rem;
}
.fb-ach-item-desc { font-size: .78rem; color: #94a3b8; margin-top: .15rem; }

/* Feats of Power trophy shelf (profile main page). */
.fb-feat-shelf {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: .75rem;
}
.fb-feat-card {
    text-align: center;
    padding: 1rem .75rem;
    border-radius: .7rem;
    border: 1px solid rgba(234, 179, 8, .35);
    background: linear-gradient(180deg, rgba(234, 179, 8, .1), rgba(30, 41, 59, .3));
}
.fb-feat-icon { font-size: 1.9rem; }
.fb-feat-title { font-size: .85rem; font-weight: 800; color: #fde68a; margin-top: .3rem; }
.fb-feat-desc { font-size: .72rem; color: #cbd5e1; margin-top: .25rem; }