/* Wichtelfix – seiteneigene Ergänzungen (kit.css bleibt unberührt). */

/* Mini-Los: zeigt, wie der Link beim Beschenkenden aussieht (echtes Beispiel unter r/#demo). */
.mini {
    display: block; max-width: 340px; margin: 0 auto; padding: 22px 20px 20px;
    background: #fff; color: #221A1A; border-radius: 26px; text-align: center; text-decoration: none;
    box-shadow: 0 24px 60px rgba(120, 20, 20, .22); border: 1px solid #F0E2DA;
    transition: transform .25s ease;
}
.mini:hover { transform: translateY(-3px); }
.mini-kicker { display: block; text-transform: uppercase; letter-spacing: .08em; font-size: 12px; font-weight: 800; color: #A51D26; }
.mini-hello { display: block; margin: 4px 0 14px; font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.mini-scratch { position: relative; display: block; border-radius: 18px; overflow: hidden; background: linear-gradient(135deg, #E03131, #A51D26); color: #fff; min-height: 120px; }
.mini-prize { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; min-height: 120px; padding: 16px; font-size: 14px; }
.mini-prize strong { font-size: 30px; letter-spacing: -.02em; }
/* Rubbelschicht: rechts schon „freigerubbelt“, damit man sieht, was darunter liegt. */
.mini-cover {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #f6d365, #e8b931 50%, #c9971c);
    color: #5c3d00; font-weight: 800; font-size: 18px;
    -webkit-mask-image: radial-gradient(circle at 78% 62%, transparent 0 46px, #000 47px);
    mask-image: radial-gradient(circle at 78% 62%, transparent 0 46px, #000 47px);
}
.mini-cover span { transform: translateX(-18%); }
.mini-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; text-align: left; }
.mini-facts > span { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid #F0E2DA; border-radius: 14px; }
.mini-facts small { color: #6B5F5F; font-size: 12px; }
.mini-facts b { font-size: 15px; }
.demo-link { display: inline-block; margin-top: 6px; font-weight: 700; color: var(--brand-deep); }
html[data-theme="dark"] .demo-link { color: var(--brand); }
