/* A janela "Missões" (pt-missoes.js), no estilo das telas REVIVAL PT: marrom escuro, filetes dourados e o ciano. */
#missoes { --ms-ouro: #e9c27a; --ms-texto: #efe6d4; --ms-apagado: rgba(239,230,212,.55); --ms-borda: rgba(233,194,122,.32); --ms-ciano: #5fd8e6;
  position: fixed; left: 50%; top: 50%; z-index: 9; transform: translate(-50%, -50%); box-sizing: border-box; display: flex; flex-direction: column;
  width: min(1000px, calc(100vw - 24px)); height: min(730px, calc(100vh - 24px)); padding: 0 16px 14px; overflow: hidden;
  color: var(--ms-texto); font: 13px/1.35 "Segoe UI", system-ui, sans-serif; border-radius: 12px; border: 1px solid rgba(233,194,122,.38);
  background: radial-gradient(ellipse at 50% 0, rgba(95,216,230,.07), transparent 55%), linear-gradient(#211a14, #140f0b 60%, #110d0a);
  box-shadow: 0 0 0 1px rgba(0,0,0,.65), 0 0 0 4px rgba(233,194,122,.06), 0 20px 50px rgba(0,0,0,.65); user-select: none; -webkit-user-select: none; }
#missoes[hidden] { display: none; }
#missoes button { font: inherit; color: inherit; margin: 0; cursor: pointer; }
#missoes svg { width: 100%; height: 100%; }

.ms-cab { position: relative; display: flex; align-items: center; flex: none; height: 54px; padding: 0 4px; }
.ms-cab h2 { margin: 0; flex: 1; font: 600 22px/1 "Cinzel", Georgia, serif; letter-spacing: .07em; font-variant: small-caps; text-shadow: 0 1px 3px #000; }
.ms-chips { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; gap: 10px; }
.ms-chip { display: inline-flex; align-items: center; gap: 7px; height: 24px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--ms-borda);
  background: rgba(0,0,0,.4); color: #e8d6ae; font: 600 11px/1 "Segoe UI", system-ui, sans-serif; white-space: nowrap; }
.ms-chip b { color: #fff; font-variant-numeric: tabular-nums; }
.ms-chip-ciano { border-color: rgba(95,216,230,.45); }
.ms-chip-ciano b { color: #bdeef4; }
#missoes .ms-x { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: none; color: rgba(239,230,212,.7); font: 400 22px/1 system-ui, sans-serif; }
#missoes .ms-x:hover, #missoes .ms-x:focus-visible { color: #fff; background: rgba(255,255,255,.08); outline: 0; }
.ms-filete { position: relative; flex: none; height: 1px; margin: 0 -16px; background: linear-gradient(90deg, transparent, rgba(233,194,122,.7) 18%, rgba(233,194,122,.7) 82%, transparent); }
.ms-filete::after { content: ''; position: absolute; left: 50%; top: 0; width: 13px; height: 13px; transform: translate(-50%, -50%) rotate(45deg); border-radius: 3px;
  background: radial-gradient(circle at 35% 30%, #e6fdff, #5fd8e6 40%, #1f6fb0); box-shadow: 0 0 14px rgba(95,216,230,.8), 0 0 0 2px rgba(0,0,0,.6); }

/* as abas */
.ms-abas { display: flex; flex: none; margin: 0 -16px; padding: 0 12px; border-bottom: 1px solid rgba(233,194,122,.2); overflow-x: auto; scrollbar-width: none; }
#missoes .ms-aba { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: 1 0 auto; height: 48px; padding: 0 14px; border: 0;
  border-bottom: 2px solid transparent; background: none; color: var(--ms-apagado); font: 600 13px/1 "Cinzel", Georgia, serif; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
#missoes .ms-aba:hover { color: var(--ms-texto); }
#missoes .ms-aba[aria-pressed="true"] { color: #f5e2b4; border-bottom-color: var(--ms-ouro); text-shadow: 0 0 10px rgba(233,194,122,.35); }
.ms-num { display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; box-sizing: border-box; border-radius: 9px;
  background: radial-gradient(circle at 40% 30%, #c7f6fb, #5fd8e6 55%, #2b9fb3); color: #0d2a30; font: 700 10.5px/1 "Segoe UI", system-ui, sans-serif; letter-spacing: 0; }
.ms-num[hidden] { display: none; }

/* o corpo: a lista e o detalhe */
.ms-corpo { display: flex; flex: 1; min-height: 0; margin-top: 12px; border-radius: 8px; border: 1px solid rgba(233,194,122,.2); background: rgba(0,0,0,.25); overflow: hidden; }
.ms-lista { flex: none; width: 286px; overflow-y: auto; border-right: 1px solid rgba(233,194,122,.2); scrollbar-width: thin; scrollbar-color: rgba(233,194,122,.5) transparent; }
.ms-grupo { display: flex; align-items: center; gap: 8px; padding: 14px 14px 8px; color: var(--ms-ouro); font: 700 10.5px/1 "Cinzel", Georgia, serif; letter-spacing: .16em; text-transform: uppercase; }
.ms-grupo::before { content: ''; width: 6px; height: 6px; transform: rotate(45deg); background: var(--ms-ouro); }
.ms-grupo span { flex: 1; }
.ms-grupo b { color: var(--ms-apagado); font: 600 10px/1 "Segoe UI", system-ui, sans-serif; }
#missoes .ms-item { display: flex; align-items: flex-start; gap: 11px; width: 100%; padding: 10px 12px 10px 14px; border: 0; border-left: 3px solid transparent;
  background: none; text-align: left; }
#missoes .ms-item:hover { background: rgba(233,194,122,.06); }
#missoes .ms-item[aria-pressed="true"] { border-left-color: var(--ms-ouro); background: linear-gradient(90deg, rgba(233,194,122,.16), rgba(233,194,122,.04)); }
.ms-icone { flex: none; width: 26px; height: 26px; margin-top: 2px; }
.ms-andamento .ms-icone, .ms-icone.ms-andamento { color: #b9b2a5; }
.ms-disponivel .ms-icone, .ms-icone.ms-disponivel { color: #f2c64a; filter: drop-shadow(0 0 5px rgba(242,198,74,.45)); }
.ms-concluida .ms-icone, .ms-icone.ms-concluida { color: #7fd69a; }
.ms-bloqueada .ms-icone, .ms-icone.ms-bloqueada { color: rgba(239,230,212,.35); }
.ms-item-info { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }
.ms-item-info b { font: 700 13px/1.2 "Segoe UI", system-ui, sans-serif; color: #f3e9d2; }
.ms-bloqueada .ms-item-info b { color: rgba(239,230,212,.55); }
.ms-item-info small { color: var(--ms-apagado); font-size: 11px; line-height: 1.25; }
.ms-item-info em { font-style: normal; font-size: 11px; line-height: 1.2; }
.ms-premio { color: #8fe6f0; }
.ms-falta { color: #e7a090; }
.ms-barra { display: block; height: 3px; margin-top: 5px; border-radius: 2px; background: rgba(0,0,0,.55); overflow: hidden; }
.ms-barra i { display: block; width: 35%; height: 100%; background: linear-gradient(90deg, #2b9fb3, #5fd8e6); }

.ms-detalhe { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.ms-rolagem { flex: 1; min-height: 0; overflow-y: auto; padding: 24px 28px 10px; scrollbar-width: thin; scrollbar-color: rgba(233,194,122,.5) transparent; user-select: text; -webkit-user-select: text; }
.ms-topo { display: flex; align-items: center; gap: 12px; }
.ms-topo .ms-icone { width: 30px; height: 30px; margin: 0; }
.ms-topo h3 { margin: 0; font: 600 22px/1.1 "Cinzel", Georgia, serif; letter-spacing: .06em; text-transform: uppercase; color: #f5ead2; }
.ms-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; margin: 10px 0 0; font-size: 12px; color: #e8dcc2; }
.ms-meta b { color: var(--ms-ouro); font-weight: 700; }
.ms-estado { padding: 3px 9px; border-radius: 10px; border: 1px solid; font-size: 11.5px; font-weight: 600; }
.ms-estado.ms-andamento { border-color: rgba(95,216,230,.6); color: #bdeef4; background: rgba(10,50,60,.4); }
.ms-estado.ms-disponivel { border-color: rgba(242,198,74,.6); color: #f6dc8e; background: rgba(70,50,10,.4); }
.ms-estado.ms-concluida { border-color: rgba(127,214,154,.6); color: #b4ecc4; background: rgba(15,60,30,.4); }
.ms-estado.ms-bloqueada { border-color: rgba(239,230,212,.25); color: var(--ms-apagado); background: rgba(0,0,0,.3); }
.ms-linha { height: 1px; margin: 16px 0 6px; background: linear-gradient(90deg, rgba(233,194,122,.45), transparent); }
.ms-detalhe h4 { display: flex; align-items: center; gap: 8px; margin: 18px 0 8px; color: var(--ms-ouro); font: 700 11px/1 "Cinzel", Georgia, serif; letter-spacing: .16em; text-transform: uppercase; }
.ms-detalhe h4::before { content: ''; width: 6px; height: 6px; transform: rotate(45deg); background: var(--ms-ciano); box-shadow: 0 0 6px rgba(95,216,230,.7); }
.ms-texto { margin: 0; color: #ece2cc; }
.ms-fala { margin-top: 14px; padding: 11px 16px; border-radius: 6px; border-left: 2px solid rgba(95,216,230,.6); background: rgba(40,60,60,.25); }
.ms-fala b { display: block; margin-bottom: 4px; color: #8fe6f0; font: 700 10.5px/1 "Segoe UI", system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.ms-fala i { color: #e3d8bf; font-size: 12px; }
.ms-objetivos { display: flex; flex-direction: column; gap: 6px; }
.ms-obj { display: flex; align-items: center; gap: 10px; padding: 9px 14px; border-radius: 7px; border: 1px solid rgba(233,194,122,.18); background: rgba(0,0,0,.25); }
.ms-obj.ms-atual { border-color: rgba(233,194,122,.45); }
.ms-obj.ms-feito { color: var(--ms-apagado); border-color: transparent; background: none; padding: 2px 4px; }
.ms-check { display: grid; place-items: center; flex: none; width: 18px; height: 18px; border-radius: 50%; border: 1px solid rgba(233,194,122,.4); color: var(--ms-ouro); font-size: 10.5px; font-weight: 700; }
.ms-feito .ms-check { border: 0; color: #e8dcc2; font-size: 14px; }
.ms-nota { display: block; margin-top: 6px; color: var(--ms-apagado); font-style: italic; font-size: 11px; }
.ms-recompensa { margin: 0; color: #a6e8a0; font-weight: 600; }
.ms-bts { display: flex; gap: 14px; flex: none; padding: 14px 28px 18px; }
#missoes .ms-ir { display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 22px 0 8px; border: 0; border-radius: 20px; color: #3a2a12;
  background: linear-gradient(#f3d89c, #d2a65a 55%, #b88a42); font: 700 12.5px/1 "Cinzel", Georgia, serif; letter-spacing: .1em; text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 2px 8px rgba(0,0,0,.5); }
#missoes .ms-ir svg { width: 26px; height: 26px; padding: 4px; box-sizing: border-box; border-radius: 50%; background: #1d3d40; color: #8fe6f0; }
#missoes .ms-ir:hover, #missoes .ms-ir:focus-visible { filter: brightness(1.1); outline: 0; }
#missoes .ms-abandonar { height: 40px; padding: 0 22px; border-radius: 20px; border: 1px solid rgba(233,194,122,.45); background: rgba(0,0,0,.35); color: #f0e2c0;
  font: 700 12.5px/1 "Cinzel", Georgia, serif; letter-spacing: .1em; text-transform: uppercase; }
#missoes .ms-abandonar:hover, #missoes .ms-abandonar:focus-visible { border-color: #e0705a; color: #f2b7a6; outline: 0; }
.ms-vazio { margin: 30px 18px; text-align: center; color: var(--ms-apagado); }
.ms-nada { width: 48px; height: 48px; margin: 120px auto 0; color: rgba(239,230,212,.2); }

/* a pergunta do Abandonar */
.ms-pergunta { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; background: rgba(0,0,0,.55); }
.ms-pergunta[hidden] { display: none; }
.ms-pergunta-caixa { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 300px; padding: 22px 26px 18px; border-radius: 10px;
  border: 1px solid rgba(233,194,122,.45); background: linear-gradient(#2a2119, #17110c); box-shadow: 0 12px 30px rgba(0,0,0,.6); text-align: center; }
.ms-pergunta-caixa p { margin: 0; color: var(--ms-apagado); }
.ms-pergunta-caixa b { font: 600 17px/1.2 "Cinzel", Georgia, serif; color: #f5ead2; }
.ms-pergunta-caixa small { color: var(--ms-apagado); }
.ms-pergunta-bts { display: flex; gap: 12px; margin-top: 12px; }
#missoes .ms-pergunta-bts .ms-ir { padding: 0 22px; }

@media (max-width: 720px) {
  .ms-chips { display: none; }
  .ms-lista { width: 44%; }
  .ms-rolagem { padding: 16px; }
  .ms-bts { padding: 12px 16px; flex-wrap: wrap; }
}