/* Modo estudo — camada RPG (E7b): retratos, onboarding, ficha, poções, modais. Usa os tokens de estudo.css. */
.retrato{display:block;padding:0;overflow:hidden;background:#0b0f2b;border:3px solid var(--latao);border-radius:50% 50% 10px 10px/38% 38% 10px 10px;box-shadow:0 0 0 2px #0b0f2b,0 0 0 4px #e0b862,0 8px 18px rgba(0,0,0,.5)}
.retrato svg{display:block;width:100%;height:auto}
.retrato--hud{width:52px;margin-top:-12px;align-self:start;grid-row:span 2;cursor:pointer}
.retrato--grande{width:150px;margin:0 auto}
.passo{text-align:center;font-size:.75rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--vela)}
/* escolha de herói e ovo */
.herois,.ovos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.heroi-card,.ovo-card{display:grid;justify-items:center;align-content:start;gap:6px;padding:12px 8px;cursor:pointer;text-align:center;color:var(--texto-claro);background:var(--placa);border:1.5px solid rgba(201,154,74,.5);border-radius:12px}
.heroi-card .retrato{width:92px}
.heroi-card__nome,.ovo-card__nome{font-family:var(--fonte-titulo);font-size:1.2rem;color:var(--vela-clara)}
.heroi-card__frase{font-size:.8rem;line-height:1.3;color:var(--texto-apagado)}
.ovo-card svg{width:96px;height:96px}
.ovo-card__casa{font-size:.75rem;color:var(--texto-apagado)}
.heroi-card[aria-checked="true"],.ovo-card[aria-checked="true"]{border-color:var(--vela);background:radial-gradient(120% 90% at 50% 0%,rgba(255,190,92,.28),var(--placa) 70%);box-shadow:0 0 0 2px var(--vela),0 0 18px rgba(255,190,92,.55)}
.heroi-card:focus-visible,.ovo-card:focus-visible{outline:3px solid var(--vela-clara);outline-offset:2px}
.nome-comp{display:grid;gap:6px;font-weight:700}
.nome-comp input{padding:12px 14px;font:inherit;color:#fff;background:#0d1233;border:2px solid #5a5f8f;border-radius:8px}
.nome-comp input:focus{border-color:var(--vela);outline:none}
/* chegada (revelação do herói e do ovo) */
.chegada{position:relative;display:grid;place-items:center;padding:30px 0 10px;overflow-x:clip;width:100%}
.chegada .feitico__aura{top:50%}
.chegada .retrato{position:relative;animation:surgir .7s cubic-bezier(.3,1.4,.5,1) both}
.chegada__ovo{position:absolute;right:calc(50% - 128px);bottom:0;width:96px;height:96px;animation:balancar 1.2s ease-in-out .7s infinite}
.chegada__texto{max-width:30ch;text-align:center;font-weight:600;color:var(--texto-claro)}
/* HUD */
.pocoes-mini{display:inline-flex;align-items:center;gap:8px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.35);border:1px solid rgba(201,154,74,.7);align-self:center}
.pocoes-mini span{display:inline-flex;align-items:center;gap:2px;font-family:var(--fonte-titulo);font-size:1.05rem;color:var(--vela-clara)}
.pocoes-mini .ico{width:15px;height:18px}
.ofensiva__comp{font-weight:800;color:var(--tinta)}
.atalhos .atalho{font-size:1.05rem}
/* treino */
.elixir-ind{display:inline-flex;align-items:center;gap:2px;padding:3px 8px;border-radius:999px;font-family:var(--fonte-titulo);color:#f4eaff;background:#3d2160;border:1px solid #c9a6ff;box-shadow:0 0 12px rgba(180,120,255,.7);animation:pulsar 1.6s ease-in-out infinite}
.pocoes-uso{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pocao-btn{position:relative;display:grid;justify-items:center;gap:2px;min-height:68px;padding:8px 4px 6px;cursor:pointer;color:#fff;background:radial-gradient(120% 140% at 50% 0%,var(--pc,#2b3480),#141838);border:1.5px solid var(--pb,#8fb6ff);border-radius:10px}
.pocao-btn--tempo{--pc:#1f4f8f;--pb:#8fc4ff}
.pocao-btn--revelacao{--pc:#7a4a08;--pb:#ffc861}
.pocao-btn--sabedoria{--pc:#4a2f7a;--pb:#c9a6ff}
.pocao-btn__ico{width:24px;height:28px}
.pocao-btn__nome{font-family:var(--fonte-titulo);font-size:1rem}
.pocao-btn__qtd{position:absolute;top:-8px;right:-6px;min-width:24px;height:24px;padding:0 6px;border-radius:12px;line-height:24px;text-align:center;font-size:1rem;color:#1a0f05;background:var(--vela-clara);border:1.5px solid var(--latao)}
.pocao-btn:disabled{opacity:.45;cursor:default}
.pocoes-ajuda{text-align:center;font-size:.78rem;color:var(--texto-apagado)}
.feedback__sabor{font-weight:700;color:var(--texto-claro)}
.fita--pocao{background:linear-gradient(180deg,#6b3fa0,#3d2160)}
/* ficha do herói */
.inventario{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.inventario li{display:grid;justify-items:center;gap:2px;padding:10px 4px;text-align:center;border-radius:10px;background:rgba(0,0,0,.25);border:1px solid rgba(201,154,74,.35)}
.inventario svg{width:30px;height:35px}
.inventario .num{font-size:1.6rem;line-height:1;color:#fff}
.inventario__nome{font-size:.75rem;font-weight:700;color:var(--texto-apagado);line-height:1.2}
/* modal e aviso */
.modal{position:fixed;inset:0;z-index:30;display:grid;padding:16px;overflow-y:auto;overscroll-behavior:contain;background:rgba(3,3,12,.78)}
.modal__caixa{margin:auto;width:min(100%,360px);display:grid;justify-items:center;gap:8px;padding:22px 18px 18px;text-align:center;animation:surgir .45s cubic-bezier(.3,1.4,.5,1) both}
.modal__arte{position:relative;display:grid;place-items:center;width:150px;min-height:120px}
.modal__arte::before{content:"";position:absolute;inset:-20px;border-radius:50%;background:radial-gradient(circle,rgba(255,214,140,.55),transparent 68%)}
.modal__arte>*{position:relative}
.modal__arte .retrato{width:110px}
.modal__arte svg.grande{width:130px;height:130px}
.modal__chamada{font-family:var(--fonte-titulo);font-size:1.15rem;letter-spacing:.14em;text-transform:uppercase;color:var(--vela)}
.modal__titulo{font-size:2.3rem;color:var(--vela-clara);text-shadow:0 0 16px rgba(255,190,92,.55),0 2px 0 #1a0d05}
.modal__texto{font-weight:600;color:var(--texto-claro)}
.inventario--modal{width:100%}
.inventario--modal:empty{display:none}
.chocar{animation:chocar 1.1s ease-in-out both}
.toast{position:fixed;left:16px;right:16px;bottom:16px;z-index:25;max-width:420px;margin:0 auto;display:grid;grid-template-columns:40px 1fr;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:#1a1440;border:1.5px solid var(--latao);box-shadow:0 10px 26px rgba(0,0,0,.6);animation:subir-toast .4s ease-out both}
.toast__selo{width:40px;height:48px}
.toast__rotulo{display:block;font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--vela)}
.toast strong{display:block;font-family:var(--fonte-titulo);font-size:1.2rem;color:#fff}
.toast span:last-child{font-size:.82rem;color:var(--texto-apagado)}
@keyframes surgir{from{opacity:0;transform:scale(.6)}}
@keyframes balancar{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}
@keyframes chocar{0%{transform:scale(1)}15%,45%{transform:rotate(-10deg)}30%,60%{transform:rotate(10deg)}80%{transform:scale(1.25);filter:brightness(1.8) drop-shadow(0 0 18px #ffe2a0)}100%{transform:scale(1)}}
@keyframes pulsar{50%{box-shadow:0 0 4px rgba(180,120,255,.4)}}
@keyframes subir-toast{from{opacity:0;transform:translateY(30px)}}
/* trilhas por assunto */
