/* On Training — Recompensas da sala (v1 · 2026-10-16) */
.rw-chip{display:inline-flex;align-items:center;gap:.3rem;margin-right:.5rem;min-height:40px;padding:0 .75rem;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font:800 .85rem Inter,Arial,sans-serif;cursor:pointer;white-space:nowrap}
.rw-chip .material-symbols-outlined{font-size:1.1rem;color:#f4b400}
.rw-chip i{width:1px;height:14px;background:rgba(255,255,255,.3);margin:0 .15rem}
.rw-chip-x{font-size:.68rem;opacity:.75;letter-spacing:.06em}
.rw-chip:hover{background:rgba(255,255,255,.16)}
.rw-chip:focus-visible{outline:3px solid #f4b400;outline-offset:2px}

/* painel lateral */
.rw-panel{margin:.9rem .9rem 1.2rem;padding:.9rem;border:1px solid #e2e8f0;border-radius:1rem;background:#fff;display:grid;gap:.9rem}
.rw-row{display:flex;gap:.8rem;align-items:center}
.rw-xp{flex:1;display:grid;gap:.15rem}.rw-xp b{font-size:1.05rem;color:#081b3a}.rw-xp small{font-size:.72rem;font-weight:800;color:#64748b}
.rw-xp i,.rw-cert i{display:block;height:7px;border-radius:9px;background:#e8eef5;overflow:hidden}
.rw-xp u,.rw-cert u{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,#008b76,#00cca3);transition:width .5s ease}
.rw-st{display:grid;place-items:center;min-width:56px;padding:.4rem .5rem;border-radius:.8rem;background:#fff8e1;color:#8a6200}
.rw-st .material-symbols-outlined{font-size:1.4rem;color:#f59e0b}.rw-st b{font-size:1.1rem;line-height:1}.rw-st small{font-size:.62rem;font-weight:800}
.rw-cert{display:grid;gap:.4rem}.rw-cert-h{display:flex;align-items:center;gap:.4rem;color:#081b3a}.rw-cert-h .material-symbols-outlined{color:#008b76;font-size:1.25rem}.rw-cert-h b{font-size:.82rem;flex:1}.rw-cert-h span:last-child{font-weight:900;font-size:.8rem;color:#008b76}
.rw-cert small{font-size:.74rem;color:#64748b;font-weight:700}
.rw-prev{display:flex;align-items:center;justify-content:center;gap:.4rem;min-height:44px;border:1.5px solid #008b76;border-radius:.7rem;background:#effcf8;color:#006c5b;font:800 .78rem Inter,Arial,sans-serif;cursor:pointer}
.rw-prev:hover{background:#008b76;color:#fff}.rw-prev .material-symbols-outlined{font-size:1.1rem}
.rw-bd b{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:#64748b}
.rw-bd ul{list-style:none;margin:.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}
.rw-bd li{display:grid;justify-items:center;gap:.2rem;padding:.5rem .2rem;border-radius:.7rem;background:#f1f5f9;color:#94a3b8;text-align:center;filter:grayscale(1);opacity:.65}
.rw-bd li small{font-size:.6rem;font-weight:800;line-height:1.15}
.rw-bd li.is-on{background:#fff8e1;color:#8a6200;filter:none;opacity:1}.rw-bd li.is-on .material-symbols-outlined{color:#f59e0b}

/* avisos */
.rw-toasts{position:fixed;left:50%;bottom:92px;transform:translateX(-50%);z-index:2147482000;display:grid;gap:.4rem;justify-items:center;pointer-events:none;width:max-content;max-width:calc(100vw - 24px)}
.rw-toast{display:flex;align-items:center;gap:.5rem;padding:.55rem .9rem;border-radius:999px;background:#061a2b;color:#fff;box-shadow:0 12px 30px -12px rgba(0,0,0,.6);font:700 .82rem Inter,Arial,sans-serif;animation:rw-in .28s ease both}
.rw-toast .material-symbols-outlined{color:#f4b400;font-size:1.2rem}.rw-toast b{font-weight:900}.rw-toast span:last-child{opacity:.8;font-weight:600}
.rw-toast.is-badge{background:linear-gradient(90deg,#8a6200,#f4b400);color:#061a2b}.rw-toast.is-badge .material-symbols-outlined{color:#061a2b}.rw-toast.is-badge span:last-child{opacity:.85}
.rw-toast.is-out{opacity:0;transform:translateY(8px);transition:all .3s}
@keyframes rw-in{from{opacity:0;transform:translateY(10px) scale(.96)}}

/* primeira vitória */
.rw-fw{margin:0 0 1.5rem;padding:1.1rem;border:2px solid #00cca3;border-radius:1.1rem;background:linear-gradient(180deg,#effcf8,#fff)}
.rw-fw-h{display:flex;align-items:center;gap:.7rem}.rw-fw-h>.material-symbols-outlined{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;background:#f4b400;color:#061a2b;font-size:1.5rem}
.rw-fw-h div{flex:1}.rw-fw-h b{display:block;font-size:1.1rem;color:#081b3a}.rw-fw-h small{display:block;color:#475569;font-size:.85rem;margin-top:.1rem}
.rw-fw-h em{font-style:normal;font-weight:900;font-size:.8rem;padding:.3rem .6rem;border-radius:999px;background:#061a2b;color:#f4b400;white-space:nowrap}
.rw-fw-s{list-style:none;margin:.9rem 0 .7rem;padding:0;display:grid;gap:.35rem;counter-reset:s}
.rw-fw-s li{counter-increment:s;display:flex;align-items:center;gap:.6rem;padding:.5rem .7rem;border-radius:.7rem;background:#fff;border:1px solid #e2e8f0;color:#475569;font-size:.92rem;opacity:.7}
.rw-fw-s li::before{content:counter(s);display:grid;place-items:center;flex:none;width:1.6rem;height:1.6rem;border-radius:50%;background:#e8eef5;font-weight:900;font-size:.8rem}
.rw-fw-s li>span{flex:1;min-width:0}
.rw-fw-s li.is-now{opacity:1;border-color:#00cca3;background:#fff;box-shadow:0 0 0 3px rgba(0,204,163,.18);color:#081b3a;font-weight:700}
.rw-fw-s li.is-now::before{background:#f4b400;color:#061a2b}
.rw-fw-s li.is-done{opacity:1;color:#006c5b}.rw-fw-s li.is-done::before{content:"✓";background:#008b76;color:#fff}
.rw-sheet{overflow-x:auto}
.rw-g{display:grid;grid-template-columns:34px repeat(4,minmax(64px,1fr));border:1px solid #cbd5e1;border-radius:.6rem;overflow:hidden;background:#fff;font:600 .95rem Calibri,Inter,Arial,sans-serif;max-width:460px;user-select:none}
.rw-h{display:grid;place-items:center;height:36px;background:#f1f5f9;color:#64748b;font-size:.8rem;font-weight:700;border-right:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}
.rw-c{position:relative;height:36px;border-right:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0;padding:0 .45rem;display:flex;align-items:center;justify-content:flex-end;color:#081b3a;cursor:cell}
.rw-c.sel{outline:2px solid #107c41;outline-offset:-2px;z-index:1;background:#f0fdf4}
.rw-in{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;text-align:right;padding:0 .45rem;font:inherit;color:#081b3a;outline:none;caret-color:#107c41}
.rw-fw-k{display:flex;gap:.5rem;margin-top:.7rem}
.rw-fw-k button{min-height:44px;padding:0 1.1rem;border-radius:.7rem;border:1.5px solid #cbd5e1;background:#fff;color:#081b3a;font:800 .85rem Inter,Arial,sans-serif;cursor:pointer}
.rw-fw-k button:hover{border-color:#008b76;background:#effcf8}
.rw-fw-ok{display:flex;gap:.6rem;align-items:center;margin:.8rem 0 0;padding:.7rem .9rem;border-radius:.8rem;background:#008b76;color:#fff;font-weight:700;font-size:.92rem}
.rw-fw-ok[hidden]{display:none}.rw-fw-ok .material-symbols-outlined{color:#f4b400}
.rw-fw.is-win .rw-fw-k{display:none}.rw-fw.is-old .rw-fw-s,.rw-fw.is-old .rw-fw-h small,.rw-fw.is-old .rw-sheet,.rw-fw.is-old .rw-fw-h em{display:none}.rw-fw.is-old{padding:.7rem 1rem;border-color:#9bdccd}.rw-fw.is-old .rw-fw-ok{margin:0}
.rw-fw.is-win:not(.is-old) .rw-g{animation:rw-pop .5s ease}
@keyframes rw-pop{40%{transform:scale(1.03)}}

/* boas-vindas resumidas */
.rw-wel{margin:1rem 0 1.6rem;border:1px solid #e2e8f0;border-radius:.8rem;background:#fff}
.rw-wel>summary{display:flex;align-items:center;gap:.5rem;min-height:48px;padding:.5rem .9rem;cursor:pointer;font-weight:800;font-size:.9rem;color:#006c5b;list-style:none}
.rw-wel>summary::-webkit-details-marker{display:none}.rw-wel>summary .material-symbols-outlined{color:#f4b400}
.rw-wel[open]>summary{border-bottom:1px solid #e2e8f0}.rw-wel>div{margin:0!important;border:0!important}

/* cartão-resumo */
.rw-sum{margin-top:1rem;padding:1.1rem 1.2rem;border-radius:1rem;border:2px solid #00cca3;background:#fff;text-align:left}
.rw-sum>b{display:flex;align-items:center;gap:.5rem;font-size:1.02rem;color:#081b3a}.rw-sum>b .material-symbols-outlined{color:#008b76}
.rw-sum ul{list-style:none;margin:.7rem 0 0;padding:0;display:grid;gap:.4rem}
.rw-sum li{display:flex;gap:.5rem;align-items:flex-start;font-size:.92rem;color:#334155;line-height:1.35}.rw-sum li .material-symbols-outlined{flex:none;color:#008b76;font-size:1.15rem;margin-top:.05rem}
.rw-sum-f{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;margin-top:.9rem;padding-top:.8rem;border-top:1px dashed #cbd5e1;font-size:.84rem;color:#475569}
.rw-sum-f span{display:inline-flex;align-items:center;gap:.3rem}.rw-sum-f .material-symbols-outlined{font-size:1.1rem;color:#f59e0b}

/* prévia do certificado */
.rw-modal{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;padding:16px;background:rgba(6,26,43,.82)}
.rw-modal-c{position:relative;width:min(760px,100%);max-height:100%;overflow:auto;border-radius:1rem;background:#fff;padding:1rem}
.rw-modal-x{position:absolute;top:.5rem;right:.5rem;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:#061a2b;color:#fff;cursor:pointer}
.rw-modal-b{padding-top:2.2rem}.rw-modal-b img{display:block;width:100%;height:auto;border-radius:.6rem;border:1px solid #e2e8f0}.rw-modal-b p{margin:.7rem 0 0;color:#475569;font-size:.88rem;text-align:center}

/* celular: rodapé em uma linha, botões grandes e avisos acima dele */
@media(max-width:767px){
  .rw-chip{margin-right:.3rem;padding:0 .6rem}.rw-chip-x{display:none}
  .rw-toasts{bottom:auto;top:132px}
  .rw-fw{padding:.9rem}.rw-fw-h small{display:none}.rw-fw-h b{font-size:1rem}.rw-fw-h>.material-symbols-outlined{width:2.2rem;height:2.2rem}.rw-fw-h em{font-size:.72rem}
  .rw-fw-s li:not(.is-now){display:none}.rw-fw-s{margin:.7rem 0 .6rem}
  .rw-g{grid-template-columns:28px repeat(4,1fr)}.rw-c,.rw-h{height:40px}
  .rw-fw-k button{flex:1}
}
@media(prefers-reduced-motion:reduce){.rw-toast,.rw-fw.is-win .rw-g{animation:none}}