/* =====================================================================
   JORNADA DO HERÓI (06/11, src/ui/jornada-ui.js; opção C do autor): ícone, faixa da tarefa da vez e janela.
   Cores e bordas iguais às do resto da arena (dourado #d7a944 sobre o escuro dos cartões).
   ===================================================================== */
/* ÍCONE (PC e celular deitado): abaixo do cartão da área, dentro da arena */
.jornada-icone{position:absolute;z-index:6;display:flex;flex-direction:column;align-items:center;gap:2px;width:calc(64px * var(--text-scale,1));
  padding:0;border:0;background:none;cursor:var(--cur-mao,pointer);color:#f5d98a}
.jornada-icone[hidden]{display:none!important}
.jornada-icone>i{position:relative;display:block;width:calc(54px * var(--text-scale,1));height:calc(54px * var(--text-scale,1));border-radius:50%;
  background:radial-gradient(circle at 50% 38%,#3a2a17,#120c06 75%);border:2px solid #d7a944;box-shadow:0 0 0 2px rgba(0,0,0,.55),0 4px 14px rgba(0,0,0,.5)}
.jornada-icone>i>img{position:absolute;inset:10%;width:80%;height:80%;object-fit:contain}
.jornada-icone>span{font-weight:800;font-size:calc(10.5px * var(--text-scale,1));letter-spacing:.06em;text-shadow:0 1px 2px #000,0 0 6px #000;white-space:nowrap}
.jornada-icone:hover>i,.jornada-icone:focus-visible>i{border-color:#f5d98a;box-shadow:0 0 0 2px rgba(0,0,0,.55),0 0 14px rgba(245,217,138,.45)}
.jornada-selo{position:absolute;top:-4px;right:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#d3452f;color:#fff;
  font-style:normal;font-size:calc(11px * var(--text-scale,1));line-height:18px;text-align:center;box-shadow:0 0 0 2px #120c06}
.jornada-selo[hidden]{display:none}
html.col-cel-a .jornada-icone{display:none!important}

/* FAIXA da tarefa da vez: no PC no lugar do "Próxima liberação" (a linha dele fica para dentro da janela) */
body.col-jornada-ativa #proximaLiberacao{display:none!important}
.jornada-faixa{position:relative;z-index:3;box-sizing:border-box;display:flex;align-items:center;gap:8px;margin:6px auto 14px;padding:3px 12px 3px 4px;
  width:fit-content;max-width:min(620px,calc(100% - 32px));border:1px solid rgba(215,169,68,.6);border-radius:999px;
  background:linear-gradient(90deg,rgba(43,31,18,.94),rgba(24,19,13,.94));color:#efe3c4;font:inherit;font-size:calc(12.5px * var(--text-scale,1));
  line-height:1.3;cursor:var(--cur-mao,pointer);text-align:left;box-shadow:0 2px 10px rgba(0,0,0,.4)}
.jornada-faixa[hidden]{display:none!important}
.jn-faixa-ico{width:calc(26px * var(--text-scale,1));height:calc(26px * var(--text-scale,1));flex:none;object-fit:contain}
.jn-faixa-txt{font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jn-faixa-barra{flex:none;width:calc(70px * var(--text-scale,1));height:6px;border-radius:999px;background:rgba(0,0,0,.55);overflow:hidden}
.jn-faixa-barra>i{display:block;height:100%;background:#6fc27a;border-radius:inherit}
.jn-faixa-premio{display:flex;gap:6px;flex:none;color:#f5d98a;font-weight:800}
.jn-faixa-trava{flex:none;font-style:normal;color:#b9a98f;font-size:.92em}
.jn-faixa-receber{flex:none;padding:2px 9px;border-radius:999px;background:#d7a944;color:#1b1309;font-size:.9em;letter-spacing:.05em}
.jornada-faixa.pronta{border-color:#f5d98a;animation:jn-pisca 1.6s ease-in-out infinite}
@keyframes jn-pisca{0%,100%{box-shadow:0 2px 10px rgba(0,0,0,.4)}50%{box-shadow:0 0 0 2px rgba(245,217,138,.5),0 2px 14px rgba(215,169,68,.45)}}
@media (prefers-reduced-motion:reduce){.jornada-faixa.pronta{animation:none}}
/* celular em pé: na arena, acima das skills (o jornada-ui.js põe o top) */
html.col-cel-a #monsterCard>.jornada-faixa{position:absolute;left:8px;right:8px;margin:0;width:auto;max-width:none;z-index:7;
  font-size:calc(11.5px * var(--text-scale,1));gap:6px;padding:2px 8px 2px 3px}
html.col-cel-a #monsterCard>.jornada-faixa .jn-faixa-barra{display:none}
html.col-cel-a #monsterCard>.jornada-faixa .jn-faixa-txt{flex:1;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.2}

/* PRÊMIOS (faixa e janela) */
.jn-premio{display:inline-flex;align-items:center;gap:3px;font-variant-numeric:tabular-nums;white-space:nowrap}
.jn-premio>img{width:1.35em;height:1.35em;object-fit:contain}

/* JANELA */
.jornada-modal .jornada-janela{width:min(620px,100%);max-height:calc(100vh - 40px);padding:0;display:flex;flex-direction:column;overflow:hidden;
  border:2px solid #8a6a35;background:linear-gradient(#211910,#15100b);color:#efe6d6}
.jn-topo{display:flex;align-items:center;gap:10px;padding:12px 14px 8px}
.jn-topo>img{width:calc(40px * var(--text-scale,1));height:calc(40px * var(--text-scale,1));object-fit:contain;flex:none}
.jn-topo-txt{flex:1;min-width:0}
.jn-topo-txt h2{margin:0;font-size:calc(18px * var(--text-scale,1));color:#f5d98a;letter-spacing:.03em}
.jn-topo-txt small{display:block;color:#b9a98f;font-size:calc(12px * var(--text-scale,1))}
.jn-fechar{position:relative!important;top:auto!important;right:auto!important;flex:none}
.jn-trilho{height:6px;margin:0 14px 8px;border-radius:999px;background:rgba(0,0,0,.55);overflow:hidden}
.jn-trilho>i{display:block;height:100%;background:#d7a944;border-radius:inherit;transition:width .4s}
.jn-corpo{flex:1 1 auto;min-height:0;overflow-y:auto;padding:4px 14px 16px;display:flex;flex-direction:column;gap:8px;font-size:calc(13px * var(--text-scale,1))}
.jn-corpo>*{flex:none}
.jn-aviso{margin:0;padding:6px 10px;border-radius:8px;background:rgba(211,69,47,.14);border:1px solid rgba(211,69,47,.45);color:#f3c5b9}
.jn-vazio{margin:12px 0;color:#b9a98f}
.jn-atalhos{display:flex;flex-wrap:wrap;gap:6px}
.jn-novas{border:1px solid #4a3a26;border-radius:10px;background:rgba(0,0,0,.18);padding:0 8px 8px}
.jn-novas h3{margin:0;padding:8px 2px;font-size:calc(12px * var(--text-scale,1));letter-spacing:.08em;text-transform:uppercase;color:#d7a944}
.jn-novas ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
/* A TRILHA: uma linha dourada ligando os marcos (capítulos) e os passos (missões) */
.jn-trilha{list-style:none;margin:0;padding:0 0 0 4px;display:flex;flex-direction:column;gap:6px;position:relative}
.jn-trilha::before{content:"";position:absolute;left:15px;top:12px;bottom:12px;width:2px;background:linear-gradient(#d7a944,#5a4830)}
.jn-trilha>li{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:10px;align-items:center}
.jn-trilha .jn-ck{position:relative;z-index:1;width:24px;height:24px;border-radius:50%;border:2px solid #5a4830;background:#1b140c;display:grid;place-items:center;
  font-size:12px;font-style:normal;font-weight:800;color:#f5d98a}
.jn-marco{padding:6px 0}
.jn-marco>span{font-weight:800;font-size:calc(12.5px * var(--text-scale,1));letter-spacing:.06em;text-transform:uppercase;color:#d7a944;min-width:0}
.jn-marco>em{font-style:normal;color:#b9a98f;font-size:calc(11.5px * var(--text-scale,1));white-space:nowrap}
.jn-marco.jn-feito .jn-ck{background:#6fc27a;border-color:#6fc27a;color:#10240f}
.jn-marco.jn-feito>span{color:#9fbf98}
.jn-marco.jn-agora .jn-ck{background:#d7a944;border-color:#f5d98a;color:#1b1309}
.jn-marco.jn-trancado{opacity:.55}
.jn-marco.jn-trancado .jn-ck{font-size:11px}
.jn-no{padding:2px 0}
.jn-no-txt{color:#b9a98f;font-size:.95em;min-width:0;overflow-wrap:anywhere}
.jn-no.jn-feita .jn-ck{background:#6fc27a;border-color:#6fc27a;color:#10240f;width:20px;height:20px;margin-left:2px;font-size:11px}
.jn-no.jn-futura .jn-ck{border-style:dashed;color:#8d7c63}
.jn-no.jn-futura .jn-no-txt{font-style:italic}
.jn-no.jn-vez{padding:10px 10px 10px 0;margin-left:0;border-radius:10px;background:linear-gradient(90deg,rgba(215,169,68,.16),rgba(255,255,255,.03));border:1px solid rgba(215,169,68,.55)}
.jn-no.jn-vez .jn-ck{border-color:#f5d98a;box-shadow:0 0 8px rgba(245,217,138,.5);margin-left:0}
.jn-no.jn-vez.jn-pronta{animation:jn-pisca 1.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.jn-no.jn-vez.jn-pronta{animation:none}}
.jn-no.jn-vez.jn-trancada{border-color:#5a4830;background:rgba(255,255,255,.03)}
.jn-tarefa-txt{min-width:0;display:flex;flex-direction:column;gap:1px}
.jn-tarefa-txt strong{color:#efe6d6;overflow-wrap:anywhere}
.jn-tarefa-txt small{color:#b9a98f;font-size:.92em;overflow-wrap:anywhere}
.jn-premios{display:flex;flex-wrap:wrap;gap:8px;color:#f5d98a;font-weight:800;font-size:.95em;margin-top:3px}
.jn-premios:empty{display:none}
.jn-lado{display:flex;justify-content:flex-end}
.jn-btn{font:inherit;font-size:calc(11.5px * var(--text-scale,1));font-weight:800;letter-spacing:.05em;border:1px solid #d7a944;background:#3a2a14;color:#f5d98a;
  border-radius:7px;padding:5px 10px;cursor:var(--cur-mao,pointer);white-space:nowrap}
.jn-btn:disabled{opacity:.6;cursor:wait}
.jn-btn.jn-receber{background:#d7a944;color:#1b1309}
.jn-btn.jn-btn-claro{background:rgba(255,255,255,.04);font-weight:700;letter-spacing:0}
.jn-ok{color:#6fc27a;font-weight:800;white-space:nowrap}
.jn-trava{color:#b9a98f;white-space:nowrap;font-size:.92em}
.jn-no.jn-bau{grid-template-columns:24px minmax(0,1fr)}
.jn-bau-img{position:relative;z-index:1;width:24px;height:24px;object-fit:contain}
.jn-no.jn-bau.jn-feita{opacity:.6}
.jn-no.jn-final{grid-template-columns:auto minmax(0,1fr);padding:10px;border:1px dashed #d7a944;border-radius:10px;background:#1b140c}
.jn-pecas{display:flex;gap:2px;flex:none;position:relative;z-index:1}
.jn-pecas>img{width:calc(22px * var(--text-scale,1));height:calc(22px * var(--text-scale,1));object-fit:contain}
.jn-no-novo{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px;border-radius:8px;background:rgba(255,255,255,.03)}
.jn-no-novo .jn-ck{width:22px;height:22px;border-radius:50%;border:2px solid #d7a944;display:grid;place-items:center;color:#f5d98a;font-style:normal;font-weight:800}
@media (max-width:640px){
  .jornada-modal .jornada-janela{width:100%;max-height:100%;height:100%;border-radius:0}
  .jn-no.jn-vez{grid-template-columns:24px minmax(0,1fr)}
  .jn-no.jn-vez .jn-lado{grid-column:2;justify-content:flex-start}
  .jn-no.jn-final{grid-template-columns:minmax(0,1fr)}
}