:root {
  --bg:#f7f8fb;
  --surface:#ffffff;
  --line:#e5e7eb;
  --text:#0f172a;
  --muted:#6b7280;
  --primary: var(--accel-primary, #7c3aed);
  --secondary: var(--accel-secondary, #a78bfa);
}
.accel-bonos-front { font-family: var(--accel-font, Poppins, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial); color: var(--text); }
.accel-header { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:18px; }
.accel-brand { display:flex; align-items:center; gap:14px; }
.accel-title { margin:0; font-weight:700; font-size:24px; letter-spacing:.3px; background: linear-gradient(90deg, var(--primary), var(--secondary)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.accel-actions .button { margin-left:8px; cursor:pointer; text-decoration:none; display:inline-block; background:#ffffff; color:#0f172a; border:1px solid var(--line); border-radius:10px; padding:10px 14px; transition: box-shadow .2s ease, transform .06s ease; }
.accel-actions .button:hover { box-shadow: 0 6px 14px rgba(0,0,0,.08); transform: translateY(-1px); }
.accel-actions .button.button-primary { background: linear-gradient(180deg, var(--primary), #5b21b6); color:#fff; border:none; box-shadow: 0 10px 18px rgba(124,58,237,.25); }
.accel-grid { display:grid; gap:18px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.accel-card { background: var(--surface); border:1px solid var(--line); border-radius:18px; padding:18px; box-shadow: 0 10px 24px rgba(15,23,42,.06); }
.accel-badge { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; font-size:12px; letter-spacing:.2px; border:1px solid #e5e7eb; background:#f3f4f6; color:#374151; }
.accel-badge .dot { width:8px; height:8px; border-radius:50%; background: var(--primary); box-shadow: 0 0 0 3px rgba(124,58,237,.18); }
.muted { color: var(--muted); }
.accel-row { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:8px 0; }
.accel-progress { margin-top:10px; background:#f3f4f6; border:1px solid var(--line); border-radius:12px; overflow:hidden; height:12px; }
.accel-progress > span { display:block; height:100%; background: linear-gradient(90deg, var(--primary), var(--secondary)); width:0%; transition: width .6s ease; }
.accel-status { padding:4px 10px; border-radius:999px; border:1px solid var(--line); background:#fafafa; color:#111827; }
.accel-tools { margin-top:18px; }
.accel-tools .accel-card { padding:16px; }
.accel-tools .button { margin-right:8px; }
.accel-redeem-form .button{margin-top:4px}