/* O ALTAR DAS ASAS (01/11, SQL 2061): tela A escolhida pelo autor. Lista das asas à esquerda, a asa grande no meio com
   a chama do tema, a barra e o APRIMORAR, e a Sinfonia à direita. No PC cabe sem rolar; no celular empilha (lista em
   fileira no alto, Sinfonia embaixo). src/ui/altar-asas-ui.js desenha; tests/altar-asas-browser.mjs fotografa. */
.altar-chamada{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding:10px 12px;border-radius:12px;
  background:linear-gradient(90deg,#2a1640,#120d1c);border:1px solid #7d4fc4;box-shadow:0 0 18px #8a4dff33;color:#efe6ff}
.altar-chamada img{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 0 8px #c39bff)}
.altar-chamada span{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.altar-chamada b{font-size:14px;letter-spacing:.04em}
.altar-chamada small{font-size:12px;color:#c9b6ea}
.altar-chamada button{flex:none}
/* 02/11: a chamada também no Ferreiro › Asas (grade de 2 colunas): ocupa a linha toda e some quando vazia */
.fx-asas>#forjaAltarChamada{grid-column:1/-1}
.fx-asas>#forjaAltarChamada:empty{display:none}
.fx-asas>#forjaAltarChamada .altar-chamada{margin:0}

.altar-fundo{position:fixed;inset:0;z-index:9000;display:grid;place-items:center;padding:12px;background:#05030acc;backdrop-filter:blur(3px)}
.altar-fundo[hidden]{display:none}
.altar-card{width:min(1100px,100%);max-height:calc(100dvh - 24px);overflow:auto;border-radius:16px;color:#ece6f6;box-sizing:border-box;
  background:radial-gradient(120% 70% at 50% 0%,#2a0f3d 0%,#140d18 55%,#0b0b10 100%);border:1px solid #6a3aa3;box-shadow:0 0 50px #6a2fbf55}
.altar-card *{box-sizing:border-box}
.altar-topo{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #3a2556}
.altar-topo h2{margin:0;flex:1;font-size:18px;letter-spacing:.06em;text-transform:uppercase;color:#f3e2ff;text-shadow:0 0 12px #a46bff}
.altar-jod{display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#0e0a16;border:1px solid #4b3470;font-weight:800}
.altar-jod img{width:20px;height:20px}
.altar-x{width:36px;height:36px;border-radius:50%;border:1px solid #6a4a94;background:#1a1226;color:#fff;font-size:16px;cursor:var(--cur-mao,pointer)}

.altar-corpo{display:grid;grid-template-columns:220px minmax(0,1fr) 260px;gap:14px;padding:14px 16px 16px;align-items:start}
.altar-corpo-vazio{display:block}
.altar-lista{display:flex;flex-direction:column;gap:6px;max-height:min(560px,calc(100dvh - 140px));overflow:auto;padding-right:4px}
.altar-item{display:flex;align-items:center;gap:8px;width:100%;padding:6px 8px;border-radius:10px;border:1px solid #3a2a55;background:#120d1caa;color:#d9cdee;cursor:var(--cur-mao,pointer);text-align:left}
.altar-item:hover{border-color:#8f69cf}
.altar-item.sel{border-color:#c39bff;background:#2a1640;box-shadow:0 0 12px #8a4dff55;color:#fff}
.altar-item img{width:44px;height:44px;object-fit:contain;flex:none}
.altar-item span{min-width:0;display:flex;flex-direction:column}
.altar-item b{font-size:13px;color:#ffe08a}
.altar-item em{font-style:normal;font-size:12px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

.altar-centro{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
.altar-palco{position:relative;width:100%;max-width:520px;aspect-ratio:520/430}
.altar-fx{width:100%;height:100%;display:block}
.altar-voa{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.altar-voa span{position:absolute;bottom:22%;font-weight:900;font-size:16px;color:#ffe08a;text-shadow:0 0 6px #ff9a3c,0 1px 2px #000;animation:altarSobe 1.1s ease-out forwards;white-space:nowrap}
@keyframes altarSobe{from{transform:translateY(0);opacity:1}to{transform:translateY(-120px);opacity:0}}
.altar-linha{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 12px;text-align:center}
.altar-nome{font-size:16px}
.altar-bonus{font-size:14px;font-weight:800;color:#8fe3a4}
.altar-barra{width:100%;max-width:460px;height:12px;border-radius:999px;background:#0c0912;border:1px solid #4b3470;overflow:hidden}
.altar-barra i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7d3cff,#ff6ad5,#ffd36a);transition:width .12s}
.altar-barra.ouro i{background:linear-gradient(90deg,#b8862b,#ffe08a)}
.altar-prox,.altar-msg{font-size:12px;color:#c9b6ea;text-align:center;min-height:1.3em}
.altar-msg{color:#ffd36a;font-weight:700}
.altar-aprimorar{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:240px;padding:12px 26px;border-radius:14px;cursor:var(--cur-mao,pointer);
  border:2px solid #ffd36a;color:#fff;background:linear-gradient(180deg,#a14bff,#5b20b5);box-shadow:0 0 22px #a14bff88;user-select:none;-webkit-user-select:none;touch-action:none}
.altar-aprimorar b{font-size:18px;letter-spacing:.08em}
.altar-aprimorar small{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:800;color:#ffe08a}
.altar-aprimorar small img{width:16px;height:16px}
.altar-aprimorar em{font-style:normal;font-size:11px;color:#e3d0ff}
.altar-aprimorar:active,.altar-aprimorar.segurando{transform:scale(.97);box-shadow:0 0 34px #ffb04acc}
.altar-aprimorar:disabled{cursor:var(--cur-seta,default);filter:grayscale(.4);opacity:.8;border-color:#8a7aa5}
.altar-aprimorar:focus-visible,.altar-item:focus-visible,.altar-x:focus-visible{outline:2px solid #ffe08a;outline-offset:2px}

.altar-sinf{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px;border-radius:14px;background:#120d1caa;border:1px solid #6b5326;text-align:center}
.altar-sinf h3{margin:0;font-size:16px;letter-spacing:.08em;text-transform:uppercase;color:#ffe08a;text-shadow:0 0 10px #c98a2b}
.altar-sinf p{margin:0;font-size:12px;color:#d9cdee}
.altar-sinf-palco{position:relative;width:100%;aspect-ratio:2/1}
.altar-sinf-fx{width:100%;height:100%;display:block}
.altar-grau{position:absolute;inset:0;display:grid;place-items:center;font-size:22px;color:#fff3cf;text-shadow:0 0 12px #ffb04a}
.altar-sinf-txt,.altar-total{font-size:12px;color:#c9b6ea}
.altar-sinf-bonus{font-size:14px;font-weight:800;color:#ffe08a}
.altar-total{padding-top:6px;border-top:1px solid #3a2556;width:100%}

.altar-vazio{display:flex;flex-direction:column;align-items:center;gap:8px;padding:30px 12px;text-align:center}
.altar-vazio img{width:140px;height:140px;object-fit:contain;opacity:.5;filter:grayscale(.6)}
.altar-vazio p{margin:0;max-width:420px;color:#c9b6ea}

/* celular e tela estreita: empilha; a lista vira fileira que rola de lado */
@media (max-width: 900px){
  .altar-fundo{padding:0;place-items:stretch}
  .altar-card{max-height:100dvh;height:100dvh;border-radius:0}
  .altar-corpo{grid-template-columns:minmax(0,1fr);padding:10px 12px 14px;gap:10px}
  .altar-lista{flex-direction:row;overflow-x:auto;overflow-y:hidden;max-height:none;padding:0 0 4px}
  .altar-item{flex:none;width:auto;max-width:180px}
  .altar-item em{-webkit-line-clamp:1}
  .altar-palco{max-width:400px}
  .altar-aprimorar{min-width:min(100%,280px)}
  .altar-sinf-palco{max-width:260px}
}
/* celular deitado: lista à esquerda e o resto rolando, para o botão caber */
@media (max-width: 900px) and (orientation: landscape) and (max-height: 500px){
  .altar-corpo{grid-template-columns:150px minmax(0,1fr)}
  .altar-lista{flex-direction:column;overflow-y:auto;overflow-x:hidden;max-height:calc(100dvh - 80px);grid-row:span 2}
  .altar-item{max-width:none}
  .altar-palco{max-width:190px}
  .altar-centro{gap:4px}
  .altar-aprimorar{padding:8px 20px}
  .altar-topo{padding:6px 12px}
  .altar-topo h2{font-size:15px}
  .altar-x{width:32px;height:32px}
}
/* 2096 (05/11): Marcas do Caçador até o Nv.250 (src/ui/altar-asas-ui.js). */
.altar-jod.hidden,.altar-modo.hidden{display:none}
.altar-marcas{border-color:#7a5a2c;background:#160f08}
.altar-modo{margin-top:6px;padding:4px 10px;border:0;background:none;color:#cdb98d;font-size:calc(12px * var(--text-scale, 1));text-decoration:underline;cursor:var(--cur-mao,pointer)}
.altar-modo:disabled{opacity:.5;cursor:var(--cur-seta,default)}
