*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:#fff9ef;color:#28231d}header{padding:28px max(20px,5vw);background:linear-gradient(135deg,#ffe47a,#ffc857);display:flex;gap:24px;align-items:center;justify-content:space-between}header small{font-weight:900;letter-spacing:.16em}h1{font-size:clamp(2rem,7vw,4.2rem);line-height:.95;margin:.18em 0}header p{font-size:1.1rem}.dice{border:0;border-radius:24px;background:#2c255f;color:white;font-weight:800;font-size:1.1rem;padding:22px;box-shadow:0 8px 0 #17133a;min-width:180px}.dice:active{transform:translateY(5px);box-shadow:0 3px 0 #17133a}main{max-width:1250px;margin:auto;padding:22px}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}.toolbar label,.toolbar button{background:white;border:2px solid #e6dccb;border-radius:15px;padding:10px 14px;font-weight:700}.toolbar select{border:0;background:transparent;font:inherit}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.card{position:relative;border:0;padding:0;background:white;border-radius:22px;overflow:hidden;text-align:left;box-shadow:0 4px 18px #594c3820;cursor:pointer}.card img{width:100%;aspect-ratio:1;object-fit:contain;display:block}.card .txt{padding:13px}.card strong{display:block;font-size:1.02rem}.card small{opacity:.65}.number{position:absolute;top:9px;left:9px;background:#fff;color:#222;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:900;box-shadow:0 2px 8px #0003}.picked{margin:10px 0 25px;background:#dff6d9;border:3px solid #65aa57;border-radius:22px;padding:18px}.picked h2{margin:0}.hidden{display:none}.selected{outline:7px solid #58b957}.selected:after{content:"✓";position:absolute;inset:0;background:#39a84a99;color:white;font-size:6rem;display:grid;place-items:center;font-weight:900}dialog{border:0;border-radius:25px;padding:0;max-width:560px;width:calc(100% - 30px);box-shadow:0 20px 80px #0007}dialog::backdrop{background:#17120db8}dialog img{width:100%;aspect-ratio:1.35;object-fit:contain}.dialog-body{padding:20px}.close{position:absolute;right:12px;top:12px;border:0;border-radius:50%;width:42px;height:42px;font-size:28px;background:white}.pill{background:#ffe47a;padding:6px 10px;border-radius:999px;font-weight:800}.speak{border:0;border-radius:14px;padding:12px 16px;background:#2c255f;color:#fff;font-weight:800}@media(max-width:620px){header{display:block}.dice{width:100%;margin-top:12px}.grid{grid-template-columns:repeat(2,1fr);gap:10px}main{padding:14px}.card .txt{padding:10px}.card strong{font-size:.9rem}}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}.dice.secondary{background:#fff;color:#2c255f;box-shadow:0 8px 0 #d8c9a7}.dice.secondary:active{box-shadow:0 3px 0 #d8c9a7}.picked .combo{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center}.picked .combo-card{background:#fff;border-radius:16px;padding:12px}.picked .plus{font-size:2rem;font-weight:900}@media(max-width:620px){.hero-actions{display:grid;grid-template-columns:1fr}.picked .combo{grid-template-columns:1fr}.picked .plus{text-align:center}}

/* Bienen-Design */
header{
  background:repeating-linear-gradient(
    90deg,
    #f5c400 0,
    #f5c400 42px,
    #151515 42px,
    #151515 84px
  );
  color:#fff;
  text-shadow:0 2px 4px #000;
}

.dice,
.dice.secondary{
  background:#d71920;
  color:#fff;
  box-shadow:0 8px 0 #850d12;
  text-shadow:none;
}

.dice:active,
.dice.secondary:active{
  box-shadow:0 3px 0 #850d12;
}

header small,
header h1,
header p{
  color:#fff;
}