#re-cafe{max-width:820px;margin:16px auto;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#2b1d14;line-height:1.3}
#re-cafe button{text-transform:none;letter-spacing:normal;line-height:1.2;min-height:0;font-family:inherit}
#re-cafe p{margin:0}
#re-cafe .cf-cab{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;margin-bottom:8px}
#re-cafe .cf-tit{font-size:1.3rem;font-weight:900}
#re-cafe .cf-btn{font:inherit;font-weight:800;border:3px solid #2b1d14;border-radius:10px;background:#fff;padding:6px 12px;cursor:pointer;box-shadow:0 3px 0 #2b1d14;color:#2b1d14}
#re-cafe .cf-btn:hover,#re-cafe .cf-btn:focus-visible{background:#fff3bf;outline:none}
#re-cafe .cf-btn.cf-ok{background:#51cf66;color:#fff;text-shadow:0 1px 0 #2b8a3e}
#re-cafe .cf-btn.cf-ok:hover{background:#40c057}
#re-cafe .cf-btn[disabled]{opacity:.45;cursor:default}
/* ---------- inicio ---------- */
#re-cafe .cf-sec{background:#fff8ee;border:3px solid #2b1d14;border-radius:14px;padding:12px;margin:0 0 12px}
#re-cafe .cf-sec h3{margin:0 0 8px;font-size:1.05rem;text-transform:none;letter-spacing:normal}
#re-cafe .cf-pjs{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
#re-cafe .cf-pj{border:3px solid #e6d5c3;border-radius:12px;background:#fff;padding:6px 4px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;font-weight:800;font-size:.85rem;color:#2b1d14}
#re-cafe .cf-pj canvas{width:60px;height:75px;image-rendering:pixelated}
#re-cafe .cf-pj small{font-weight:600;font-size:.7rem;color:#7c5a3c}
#re-cafe .cf-pj.on{border-color:#2b1d14;background:#fff3bf;box-shadow:0 3px 0 #2b1d14}
#re-cafe .cf-nivs{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
#re-cafe .cf-niv{border:3px solid #2b1d14;border-radius:14px;background:#fff;padding:10px;display:flex;flex-direction:column;gap:6px}
#re-cafe .cf-niv b{font-size:1.05rem}
#re-cafe .cf-niv p{font-size:.85rem;color:#5c4330}
#re-cafe .cf-dias{display:flex;gap:4px;flex-wrap:wrap}
#re-cafe .cf-dia{min-width:44px;border:2px solid #2b1d14;border-radius:8px;background:#fff;padding:3px 4px;font:800 .72rem system-ui,sans-serif;cursor:pointer;color:#2b1d14;text-align:center}
#re-cafe .cf-dia[disabled]{opacity:.4;cursor:default}
#re-cafe .cf-dia.hecho{background:#ebfbee}
#re-cafe .cf-caja{font-weight:800}
/* ---------- juego ---------- */
#re-cafe .cf-est{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;justify-content:space-between;background:#2b1d14;color:#fff;border-radius:10px 10px 0 0;padding:6px 10px;font-weight:800;font-size:.9rem}
#re-cafe .cf-est .cf-btn{padding:3px 8px;font-size:.8rem;box-shadow:none;border-width:2px}
#re-cafe .cf-esc{position:relative;border:4px solid #2b1d14;border-top:0;overflow:hidden;background:#c9a27e}
#re-cafe .cf-esc canvas{display:block;width:100%;height:auto;image-rendering:pixelated}
#re-cafe .cf-boc{position:absolute;left:3%;top:4%;max-width:62%;background:#fff;border:3px solid #2b1d14;border-radius:14px;padding:8px 12px;font-weight:700;font-size:clamp(13px,2.4vw,17px);box-shadow:0 3px 0 rgba(0,0,0,.25)}
#re-cafe .cf-boc:after{content:"";position:absolute;left:24px;bottom:-12px;border:9px solid transparent;border-top-color:#2b1d14}
#re-cafe .cf-boc small{display:block;font-weight:800;color:#a0522d;font-size:.8em;margin-bottom:2px}
#re-cafe .cf-boc .cf-mini{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap}
#re-cafe .cf-boc .cf-mini .cf-btn{padding:2px 8px;font-size:.78rem;box-shadow:none;border-width:2px}
#re-cafe .cf-boc.oculto .cf-txt{color:#9c7b5f;font-style:italic}
#re-cafe .cf-chips{display:flex;gap:4px;flex-wrap:wrap;margin-top:4px}
#re-cafe .cf-chip{background:#fff3bf;border:2px solid #e0a800;border-radius:999px;padding:1px 8px;font-size:.78em;font-weight:800}
#re-cafe .cf-chip.alerta{background:#ffe3e3;border-color:#e03131;color:#a61e1e}
#re-cafe .cf-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
@media(max-width:640px){#re-cafe .cf-panel{grid-template-columns:1fr}}
#re-cafe .cf-caj{background:#fff8ee;border:3px solid #2b1d14;border-radius:12px;padding:8px 10px}
#re-cafe .cf-caj h4{margin:0 0 6px;font-size:.95rem;display:flex;justify-content:space-between;align-items:center;gap:6px;text-transform:none;letter-spacing:normal}
#re-cafe .cf-pasos{display:flex;flex-wrap:wrap;gap:6px;min-height:52px;align-items:flex-start}
#re-cafe .cf-paso{position:relative;display:flex;flex-direction:column;align-items:center;width:52px;font-size:.66rem;font-weight:700;text-align:center;color:#5c4330}
#re-cafe .cf-paso canvas{width:36px;height:36px;image-rendering:pixelated;background:#fff;border:2px solid #e6d5c3;border-radius:8px}
#re-cafe .cf-paso i{position:absolute;top:-6px;left:2px;background:#2b1d14;color:#fff;border-radius:999px;font:800 .62rem system-ui;padding:1px 5px;font-style:normal}
#re-cafe .cf-paso.sig canvas{border-color:#e0a800;box-shadow:0 0 0 3px #ffd43b}
#re-cafe .cf-paso.hecho canvas{opacity:.45}
#re-cafe .cf-tapada{display:flex;align-items:center;justify-content:center;min-height:52px;color:#7c5a3c;font-weight:700;font-size:.9rem;text-align:center}
#re-cafe .cf-ings{margin-top:10px}
#re-cafe .cf-grupo{margin-bottom:6px}
#re-cafe .cf-grupo b{display:block;font-size:.78rem;color:#7c5a3c;margin-bottom:3px;text-transform:uppercase;letter-spacing:.04em}
#re-cafe .cf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:6px}
#re-cafe .cf-ing{display:flex;flex-direction:column;align-items:center;gap:2px;border:3px solid #2b1d14;border-radius:10px;background:#fff;padding:4px 2px;cursor:pointer;font:700 .72rem system-ui,sans-serif;color:#2b1d14;box-shadow:0 3px 0 #2b1d14;transition:transform .08s}
#re-cafe .cf-ing canvas{width:40px;height:40px;image-rendering:pixelated}
#re-cafe .cf-ing:active{transform:translateY(2px);box-shadow:0 1px 0 #2b1d14}
#re-cafe .cf-ing.sig{background:#fff3bf;animation:cfLate 1s infinite}
#re-cafe .cf-ing.mal{animation:cfMal .35s}
@keyframes cfLate{50%{transform:scale(1.07)}}
@keyframes cfMal{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
#re-cafe .cf-acc{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
#re-cafe .cf-msg{min-height:24px;margin:8px 0 0;font-weight:800;text-align:center}
#re-cafe .cf-msg.bien{color:#2b8a3e}#re-cafe .cf-msg.mal{color:#c92a2a}
#re-cafe .cf-modal{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(43,29,20,.6);z-index:5}
#re-cafe .cf-modal>div{background:#fff8ee;border:4px solid #2b1d14;border-radius:14px;padding:14px 16px;max-width:90%;text-align:center}
#re-cafe .cf-modal .cf-mt{display:block;font-size:1.2rem;margin-bottom:6px}
#re-cafe .cf-modal .cf-acc{justify-content:center}
#re-cafe .cf-estrellas{font-size:2rem;letter-spacing:4px;color:#f59f00}
#re-cafe .cf-lista{font-size:.85rem;text-align:left;margin:6px auto;max-width:360px}
#re-cafe .cf-ayuda{font-size:.85rem;color:#5c4330;background:#fff;border:1px solid #e6d5c3;border-radius:10px;padding:10px 12px;margin-top:12px}
#re-cafe.cf-grande .cf-ing{font-size:.85rem}#re-cafe.cf-grande .cf-ing canvas{width:52px;height:52px}
#re-cafe.cf-grande .cf-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}

/* la bandeja con «Servir» queda siempre a mano mientras se eligen ingredientes */
#re-cafe .cf-recbox{margin-top:10px}
#re-cafe .cf-prepbox{position:sticky;bottom:0;z-index:4;margin-top:10px;box-shadow:0 -6px 14px rgba(43,29,20,.18)}
#re-cafe .cf-prepbox h4{margin-bottom:4px}
#re-cafe .cf-prepbox .cf-pasos{min-height:44px}
#re-cafe .cf-prepbox .cf-acc{margin-top:6px}
@media(max-width:640px){
 #re-cafe .cf-boc{position:static;max-width:none;border-radius:0;border-width:0 4px 4px;box-shadow:none}
 #re-cafe .cf-boc:after{display:none}
 #re-cafe .cf-prepbox .cf-paso{width:40px}#re-cafe .cf-prepbox .cf-paso canvas{width:28px;height:28px}
 #re-cafe .cf-prepbox .cf-btn{padding:5px 8px;font-size:.85rem}
}
/* controles comunes (Otra partida, Juegos, Pantalla completa, Compartir) del snippet de juegos de marco propio */
#re-cafe .cf-cab.rjm-cab{background:none;color:inherit;padding:0}
#re-cafe .re-acc2{margin:0 0 0 auto;padding-left:0}
#re-cafe .re-acc2-b{background:#fff;color:#2b1d14!important;border:3px solid #2b1d14;border-radius:10px;box-shadow:0 3px 0 #2b1d14;padding:5px 10px;font-weight:800;font-size:.82rem}
#re-cafe .re-acc2-b:hover,#re-cafe .re-acc2-b:focus-visible{background:#fff3bf}
@media(max-width:640px){#re-cafe .re-acc2{width:100%;margin:6px 0 0}}
/* a pantalla completa: escena centrada y a la altura disponible */
html body #re-cafe.re-acc-fs,html body #re-cafe:fullscreen{padding:10px 14px 0!important;box-sizing:border-box;background:#f3ebe1!important}
#re-cafe.re-acc-fs .cf-app,#re-cafe:fullscreen .cf-app{max-width:min(100%,calc((100vh - 120px) * 1.25));margin:0 auto}
#re-cafe.re-acc-fs .cf-esc,#re-cafe:fullscreen .cf-esc{max-width:min(100%,calc((100vh - 330px) * 2));margin-left:auto;margin-right:auto}
#re-cafe.re-acc-fs .cf-est,#re-cafe:fullscreen .cf-est{max-width:min(100%,calc((100vh - 330px) * 2));margin-left:auto;margin-right:auto}
#re-cafe.re-acc-fs .cf-ayuda,#re-cafe:fullscreen .cf-ayuda{display:none}
/* el tema pone color y tamaño propios a h3 y h4: se igualan al juego */
#re-cafe h3,#re-cafe h4{color:#2b1d14!important;font-family:inherit!important;font-weight:800!important;line-height:1.25!important;margin-top:0!important}
#re-cafe h3{font-size:1.05rem!important}#re-cafe h4{font-size:.95rem!important}