/* LuxxBuxx card. Only loaded by pages that opt in. */
/* Theme values: dark is the default; light overrides live in style.css under [data-theme="light"]. */
:root { --lb-gold: #d4af37; --lb-gold-hi: #f5d77a; --lb-gold-rgb: 212 175 55; --lb-gold-dim: rgb(var(--lb-gold-rgb) / 0.12);
  --lb-card-end: rgba(20, 20, 23, 0.95); --lb-stat-bg: rgba(10, 10, 11, 0.55); --lb-coin-text: #3b2a00; --lb-coin-hi: #fff3c4;
  --lb-coin-edge: #8a6a12; --lb-coin-border: #b8921f; }
.lb-card { position: relative; margin: 1.5rem 0; padding: 18px 20px; border-radius: var(--radius, 10px);
  background: linear-gradient(135deg, rgb(var(--lb-gold-rgb) / 0.14), var(--lb-card-end) 55%);
  border: 1px solid rgb(var(--lb-gold-rgb) / 0.55); box-shadow: 0 0 0 1px rgb(var(--lb-gold-rgb) / 0.12), 0 8px 26px rgb(var(--lb-gold-rgb) / 0.12); }
.lb-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.lb-head h2 { margin: 0; color: var(--lb-gold-hi); font-size: 1.25rem; letter-spacing: 0.02em; }
.lb-head .lb-tag { margin-left: auto; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--lb-gold); border: 1px solid rgb(var(--lb-gold-rgb) / 0.5); border-radius: 999px; padding: 4px 8px; }
.lb-coin { width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  font: 800 0.85rem/1 var(--mono, monospace); color: var(--lb-coin-text);
  background: radial-gradient(circle at 32% 30%, var(--lb-coin-hi), var(--lb-gold-hi) 30%, var(--lb-gold) 62%, var(--lb-coin-edge));
  border: 2px solid var(--lb-coin-border); box-shadow: inset 0 0 0 2px rgb(255 243 196 / 0.35), 0 2px 10px rgb(var(--lb-gold-rgb) / 0.35); }
.lb-card:hover .lb-coin { animation: lb-spin 1.1s ease-in-out; }
@keyframes lb-spin { from { transform: rotateY(0); } to { transform: rotateY(360deg); } }
@media (prefers-reduced-motion: reduce) { .lb-card:hover .lb-coin { animation: none; } }
.lb-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.lb-stat { background: var(--lb-stat-bg); border: 1px solid rgb(var(--lb-gold-rgb) / 0.28); border-radius: 8px; padding: 12px 14px; min-width: 0; }
.lb-stat-label { color: var(--muted, #a6a6ae); font-size: 0.75rem; letter-spacing: 0.07em; text-transform: uppercase; margin: 0 0 6px; }
.lb-stat-value { margin: 0; font: 600 clamp(1.15rem, 4vw, 1.6rem)/1.2 var(--mono, monospace); color: var(--lb-gold-hi);
  font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.lb-stat-lead { border-color: rgb(var(--lb-gold-rgb) / 0.6); background: var(--lb-gold-dim); }
.lb-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin-top: 12px; font-size: 0.85rem; color: var(--muted, #a6a6ae); }
.lb-foot a { color: var(--lb-gold); }
.lb-foot a:hover { color: var(--lb-gold-hi); }
.lb-board { margin-top: 14px; }
.lb-board table { width: 100%; }
.lb-board td, .lb-board th { color: var(--text, #f2f1ee); }
.lb-board .lb-rank { color: var(--lb-gold); font-weight: 700; }
@media (max-width: 640px) { .lb-stats { grid-template-columns: 1fr; } }
.lb-head .lb-coin-img { width: 38px; height: 38px; margin: 0; vertical-align: middle; flex: none; filter: drop-shadow(0 2px 8px rgb(var(--lb-gold-rgb) / 0.30)); }
