/* Onde fica? — níveis de rosto (2026-10-26) */
.rf{display:grid;gap:10px;max-width:860px;margin:0 auto}
.rf-pedido{margin:0;text-align:center;font-size:1.2rem;font-weight:700;color:var(--roxo)}
.rf-pedido b{font-size:1.3rem}
.rf-situacao{margin:0;background:var(--card);border:2px solid var(--line);border-radius:20px;padding:12px 16px;font-size:1.12rem;line-height:1.45;text-align:center}
.rf-mesa{display:grid;gap:10px;justify-items:center}
.rf-rosto{position:relative;width:min(100%,420px);aspect-ratio:1222/1287;touch-action:none;user-select:none;-webkit-user-select:none}
.rf-rosto>img{display:block;width:100%;height:100%;pointer-events:none;-webkit-touch-callout:none}
.rf-camada,.rf-guias{position:absolute;inset:0}
.rf-guias{pointer-events:none}
.rf-guia{position:absolute;transform:translate(-50%,-50%);border:3px dashed rgba(142,108,201,.7);border-radius:50%;width:11%;aspect-ratio:1}
.rf-guia-sob{width:12%;aspect-ratio:2.4;border-radius:40px}
.rf-guia-boc{width:15%;aspect-ratio:1.8}
.rf-peca{position:absolute;transform:translate(-50%,-50%);cursor:grab;touch-action:none}
.rf-peca img{display:block;width:100%;height:auto;pointer-events:none;-webkit-user-drag:none}
.rf-peca.espelho img{transform:scaleX(-1)}
.rf-peca.movendo{cursor:grabbing;z-index:3;filter:drop-shadow(0 8px 6px rgba(60,20,10,.3))}
.rf-peca.sel{outline:3px solid rgba(142,108,201,.85);outline-offset:4px;border-radius:12px}
.rf-peca.errado{outline:3px dashed #E5483D;outline-offset:4px;border-radius:12px;animation:oc-balanca .45s}
.rf-travado .rf-peca{pointer-events:none}
.rf-travado .rf-bandeja,.rf-travado .rf-ferramentas,.rf-travado .rf-abas{opacity:.45;pointer-events:none}
.rf-lado{display:grid;gap:8px;width:100%;max-width:420px}
.rf-abas{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.rf-aba{min-height:44px;padding:4px 14px;border-radius:14px;border:2px solid var(--line);background:var(--card);font-weight:700;color:var(--texto,#3F3A4A)}
.rf-aba.on{border-color:var(--roxo);background:#EFE7FB}
.rf-bandeja{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;min-height:72px;background:#FFF8EC;border:2px dashed #F2C94C;border-radius:18px;padding:8px}
.rf-item{width:68px;height:64px;border-radius:16px;border:2px solid var(--line);background:#fff;display:grid;place-items:center;padding:6px;touch-action:none;cursor:grab}
.rf-item img{width:54px;height:50px;object-fit:contain;pointer-events:none}
.rf-vazia{margin:0;align-self:center;color:var(--muted,#6B6478)}
.rf-ferramentas{display:flex;gap:8px;justify-content:center}
.rf-ferramentas .cr-bt:disabled{opacity:.4}
.rf-retorno{min-height:1.5em;margin:0;text-align:center;font-size:1.05rem;line-height:1.45;display:grid;gap:8px;justify-items:center}
.rf-retorno textarea{width:min(100%,480px);font-size:1.05rem;padding:10px;border-radius:14px;border:2px solid var(--line);font-family:inherit}
.rf-rotulo{font-weight:700}
.rf-acoes{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.rf-pronto{animation:rf-festa .9s ease-in-out}
.rf-pronto::after{content:"";position:absolute;pointer-events:none;inset:-4%;border-radius:50%;box-shadow:0 0 0 6px rgba(242,201,76,.0);animation:rf-brilho 1.2s ease-out}
@keyframes rf-festa{30%{transform:scale(1.04) rotate(-2deg)}60%{transform:scale(1.03) rotate(2deg)}}
@keyframes rf-brilho{0%{box-shadow:0 0 0 0 rgba(242,201,76,.7)}100%{box-shadow:0 0 0 40px rgba(242,201,76,0)}}
.rf-memoria{display:grid;gap:10px;justify-items:center}
.rf-memoria .rf-mini{width:min(100%,420px,calc((100vh - 300px) * 1222 / 1287))}
.rf-tempo{width:min(100%,420px);height:12px;border-radius:8px;background:#EFE7FB;overflow:hidden}
.rf-tempo i{display:block;height:100%;background:var(--roxo);animation:rf-tempo linear forwards;transform-origin:left}
@keyframes rf-tempo{from{transform:scaleX(1)}to{transform:scaleX(0)}}
.rf-mini .rf-peca{cursor:default;pointer-events:none}
.rf-espiar{position:absolute;inset:0;z-index:5;animation:oc-aparece .2s}
.rf-espiar .rf-mini{width:100%;min-width:0}
.rf-compara{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:min(100%,460px)}
.rf-compara figure{margin:0;display:grid;gap:4px;justify-items:center}
.rf-compara .rf-mini{width:100%;min-width:0}
.rf-compara figcaption{font-weight:700;font-size:.9rem}
@media (min-width:860px){.rf-mesa{grid-template-columns:auto minmax(260px,360px);align-items:start;justify-content:center}.rf-mesa>.rf-rosto{width:420px}}
@media (prefers-reduced-motion:reduce){.rf *,.rf-pronto{animation:none!important}}