/* /upgrade/monte-mapa-tela.css -- card "O próximo passo, poste a poste" do Monte Myouboku (monte-mapa-tela.js).
   Card animado (regra do dono, 30/09): lago do sapo ao fundo com névoa, faixa verde, rótulo e cortes. */
#monte-mapa-card{position:relative;overflow:hidden;isolation:isolate;margin-top:14px;display:grid;gap:12px;
  --mm-verde:#6fcf4a;--mm-ok:#43c79b;--mm-lar:#ffb082;
  background:linear-gradient(90deg,rgba(15,19,28,.97) 0%,rgba(15,19,28,.9) 55%,rgba(15,19,28,.6) 100%),
    radial-gradient(120% 90% at 100% 0%,#27466e 0%,#1c2f52 40%,#101a2e 75%);}
#monte-mapa-card[hidden]{display:none}
#monte-mapa-card::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--mm-verde);z-index:1}
#monte-mapa-card::after{content:"";position:absolute;right:-10%;top:18%;width:70%;height:26px;background:rgba(214,228,245,.08);filter:blur(8px);z-index:-1;animation:mm-nevoa 14s ease-in-out infinite alternate}
@keyframes mm-nevoa{from{transform:translateX(-60px)}to{transform:translateX(40px)}}
.mm-cortes{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:-1}
.mm-cortes i{position:absolute;height:2px;right:-10%;transform:rotate(-24deg);background:linear-gradient(90deg,transparent,var(--mm-verde) 35%,#fff 50%,var(--mm-verde) 65%,transparent);box-shadow:0 0 10px var(--mm-verde);opacity:.35}
.mm-cortes i:nth-child(1){width:55%;top:14%}.mm-cortes i:nth-child(2){width:32%;top:28%;right:22%;opacity:.2}
.mm-cortes i::after{content:"";position:absolute;inset:-3px 0;width:30%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent);transform:translateX(-120%);animation:mm-corte 3.4s ease-in-out infinite}
@keyframes mm-corte{0%,45%{transform:translateX(-120%);opacity:0}55%{opacity:1}85%,100%{transform:translateX(420%);opacity:0}}
.mm-topo{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.mm-titulo{margin:0;font-weight:800;font-size:16px}
.mm-nota{margin:0;color:var(--muted);font-size:12.5px;line-height:1.5;max-width:80ch}
.mm-abas{display:flex;gap:8px;flex-wrap:wrap}
.mm-abas button{display:flex;align-items:center;gap:7px;border:1px solid var(--line-hi,#3a4759);background:rgba(12,15,22,.9);color:var(--muted);border-radius:999px;padding:5px 12px 5px 6px;font:600 13px inherit;cursor:pointer}
.mm-abas button small{font:700 11px var(--mono,monospace);color:var(--muted);font-variant-numeric:tabular-nums}
.mm-abas button[aria-pressed="true"]{border-color:var(--mm-verde);color:inherit;background:rgba(111,207,74,.12)}
.mm-abas button[aria-pressed="true"] small{color:var(--mm-verde)}
.mm-abas button.melhor::after{content:attr(data-melhor);font:700 9.5px var(--mono,monospace);letter-spacing:.06em;text-transform:uppercase;background:var(--mm-verde);color:#0b2410;border-radius:999px;padding:1px 6px}
.mm-abas button:disabled{border-style:dashed;opacity:.55;cursor:default}
.mm-arte{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;border:1px dashed #ff9a52;color:#ff9a52;font:700 12px var(--mono,monospace)}
.mm-svg{overflow-x:auto;border:1px solid var(--line,#29313d);border-radius:12px;background:rgba(9,12,19,.72)}
.mm-svg svg{display:block;width:100%;min-width:800px;height:auto}
.mm-ln{stroke:#3a4759;stroke-width:3;fill:none}
.mm-ln.on{stroke:var(--mm-verde);stroke-width:3.5}
.mm-ln.ok{stroke:#2d6b47}
.mm-no rect{fill:#141a25;stroke:#3a4759;stroke-width:1.5}
.mm-no.depois{opacity:.42}
.mm-no.depois rect{stroke-dasharray:5 4}
.mm-no.feito rect{fill:#10261c;stroke:#2d6b47}
.mm-no.fazer rect{fill:#16301c;stroke:var(--mm-verde);stroke-width:2.2}
.mm-no.fazer rect.brilho{fill:none;stroke:var(--mm-verde);stroke-width:2;opacity:.5;animation:mm-pulso 2.4s ease-in-out infinite}
@keyframes mm-pulso{0%,100%{opacity:.1}50%{opacity:.7}}
.mm-svg text{fill:#c9d1dc;font-size:12.5px;font-variant-numeric:tabular-nums}
.mm-svg text.atk{fill:var(--mm-ok);font-weight:700}
.mm-svg text.tag{font:700 10px var(--mono,monospace);letter-spacing:.08em;fill:#6b7686}
.mm-no.feito text.tag{fill:var(--mm-ok)}
.mm-svg .ord{fill:var(--mm-verde)}
.mm-svg .ord-t{font:800 12px var(--mono,monospace);fill:#0b2410;text-anchor:middle}
.mm-lista{display:grid;gap:8px}
.mm-rot{grid-column:1/-1;font:600 11px var(--mono,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.mm-passos{display:grid;gap:4px;align-content:start}
.mm-l{display:grid;grid-template-columns:24px minmax(0,1fr) 62px;gap:8px;align-items:center;padding:6px 8px;border-radius:8px;font-size:13px;font-variant-numeric:tabular-nums;background:rgba(111,207,74,.06)}
.mm-l.antes{background:rgba(255,176,130,.08)}
.mm-l .n{display:grid;place-items:center;width:22px;height:22px;border-radius:999px;background:var(--mm-verde);color:#0b2410;font:800 11px var(--mono,monospace)}
.mm-l.antes .n{background:var(--mm-lar);color:#2a1406}
.mm-l .p{text-align:right;font:600 12px var(--mono,monospace);color:var(--muted)}
.mm-l b{color:var(--mm-ok)}
.mm-soma{border-top:1px solid var(--line-hi,#3a4759);padding:10px 2px 0;display:grid;gap:6px;align-content:start}
.mm-soma .lin{display:flex;justify-content:space-between;gap:10px;font-size:13.5px;font-variant-numeric:tabular-nums}
.mm-soma .lin b{font-weight:800;font-size:14px;white-space:nowrap;text-align:right}
.mm-soma .lin .v{color:var(--mm-ok)}
.mm-leg{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.mm-leg i{display:inline-block;width:14px;height:14px;border-radius:4px;vertical-align:-2px;margin-right:6px;border:1.5px solid}
.mm-leg .f{border-color:var(--mm-verde);background:#16301c}.mm-leg .t{border-color:#2d6b47;background:#10261c}.mm-leg .d{border-color:#3a4759;border-style:dashed;opacity:.6}
@media (prefers-reduced-motion:reduce){#monte-mapa-card::after,.mm-cortes i::after,.mm-no.fazer rect.brilho{animation:none}}
/* Tela única do Monte: a linha do 6º caminho (a coletar), tracejada e sem controles */
#monte-slots-combined .monte-slot-sexto{border-style:dashed !important;opacity:.7;display:grid !important;grid-template-columns:minmax(0,1fr) !important;grid-template-areas:none !important;gap:6px;align-content:start}
#monte-slots-combined .monte-slot-sexto>*{grid-column:1 !important;grid-row:auto !important;width:auto !important}
.monte-slot-arte{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:5px;border:1px dashed #ff9a52;color:#ff9a52;font:700 11px var(--mono,monospace);margin-right:6px}
.monte-slot-sexto-nota{font-size:12px;color:var(--muted);line-height:1.45}
/* checkup 30/09: no celular a nota do 6º caminho quebra linha em vez de alargar a grade das partes */
.tc-monte-partes > *{min-width:0}
.monte-slot-sexto-nota{white-space:normal;overflow-wrap:anywhere}
@media (max-width:760px){.tc-monte-partes{grid-template-columns:minmax(0,1fr) !important}}

/* Campos dos 5 caminhos em tabela larga, uma linha por caminho (mockup aprovado pelo dono em 02/10/2026, docs/mockups/upgrade/upgrade-monte.html):
   Caminho | Nível atual (Nv e Et) | seta | Nível destino (Nv e Et) | Passos já feitos. Em tela estreita continua o cartão de antes. */
.tc-monte-partes{grid-template-columns:minmax(0,1fr) !important;gap:0 !important}
@container (min-width:700px){
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto){grid-template-columns:170px minmax(0,1fr) 18px minmax(0,1fr) minmax(0,.9fr) !important;gap:8px 12px;background:none;border:0;border-top:1px solid var(--border,#29313d);border-radius:0;padding:8px 0}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto) > .monte-slot-combo-label{grid-column:1 !important}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto) > span:nth-of-type(1){grid-column:2 !important}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto) > .monte-slot-combo-arrow{grid-column:3 !important;display:block !important}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto) > span:nth-of-type(3){grid-column:4 !important}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto) > .monte-passos-field,.tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto) > .artefato-xp-field{grid-column:5 !important}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto):first-child{border-top:0}
  /* título das colunas, uma vez só (na primeira linha) */
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto):first-child > .np-par{flex-wrap:wrap}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto):first-child > span:nth-of-type(1)::before,
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto):first-child > span:nth-of-type(3)::before{display:block;flex:0 0 100%;margin-bottom:4px;font:600 10.5px var(--mono,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--t-low,#6b7686)}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto):first-child > span:nth-of-type(1)::before{content:"Nível atual"}
  .tc-monte-partes .monte-slot-combo-row:not(.monte-slot-sexto):first-child > span:nth-of-type(3)::before{content:"Nível destino"}
}
