/* /css/buttons.css */
.btn{
    --_bg:#f3f4f6;
    --_fg:#111827;
    --_bd:#e5e7eb;
    display:inline-flex; align-items:center; justify-content:center;
    gap:8px;
    padding:10px 14px;
    border:1px solid var(--_bd);
    background:var(--_bg);
    color:var(--_fg);
    text-decoration:none;
    border-radius:12px;
    font-weight:600;
    line-height:1;
    cursor:pointer;
    transition:transform .02s ease, background .15s ease, border-color .15s ease, color .15s ease;
    user-select:none;
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn--sm{padding:8px 12px; font-size:14px; border-radius:10px}

.btn--primary{
    --_bg: var(--tg-red);
    --_fg: #fff;
    --_bd: var(--tg-red);
}
.btn--primary:hover{
    --_bg: var(--tg-red-600);
    --_bd: var(--tg-red-600);
}
.btn--ghost{
    --_bg: transparent;
    --_bd: #d1d5db;
}