.vp-pila { position: fixed; right: 1rem; bottom: 1rem; z-index: 9995; display: flex; flex-direction: column-reverse; gap: .6rem; width: min(22rem, calc(100vw - 2rem)); pointer-events: none; }
.vp-card { pointer-events: auto; background: var(--surface, #fff); color: var(--text-primary, #111827); border: 1px solid var(--border, #e5e7eb);
    border-left: 4px solid var(--primary, #FF9F43); border-radius: .9rem; box-shadow: 0 18px 40px -18px rgba(0,0,0,.35);
    padding: .85rem .9rem; display: flex; gap: .75rem; align-items: flex-start; animation: vpEntra .18s ease-out; }
.vp-ico { width: 2.2rem; height: 2.2rem; border-radius: .6rem; background: rgba(255,159,67,.14); color: var(--primary, #FF9F43); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.vp-txt { flex: 1; min-width: 0; }
.vp-txt b { display: block; font-size: .86rem; }
.vp-txt span { display: block; font-size: .76rem; color: var(--text-secondary, #6b7280); margin-top: .1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vp-txt .vp-aviso { white-space: normal; color: var(--text-primary, #111827); font-weight: 600; }
.vp-txt .vp-tiempo { display: inline; color: var(--text-primary, #111827); font-weight: 600; font-variant-numeric: tabular-nums; }
.vp-acc { display: flex; gap: .4rem; margin-top: .55rem; }
.vp-btn { height: 2rem; padding: 0 .8rem; border-radius: .5rem; border: 0; background: var(--primary, #FF9F43); color: #fff; font-size: .8rem; font-weight: 600; cursor: pointer; }
.vp-btn:hover { background: var(--primary-dark, #C1650B); }
.vp-btn.sec { background: transparent; color: var(--text-secondary, #6b7280); border: 1px solid var(--border, #e5e7eb); }
.vp-btn.sec:hover { color: var(--text-primary, #111827); background: var(--surface-alt, #f3f4f6); }
@keyframes vpEntra { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .vp-card { animation: none; } }