/* STAKEPAYS: direção 1 (claro, tinta quase preta, um azul). Uma tela por aba, sem rolagem. Cantos de 4px, bordas de 1px. */
:root {
  --fundo: #ffffff; --tinta: #0b0d12; --apagado: #474e5c; --linha: #e1e5ec; --suave: #f4f6fa;
  --azul: #1437f5; --azul-escuro: #0f2bd0; --azul-claro: #e9edff; --marinho: #0b1230; --erro: #d21c3c; --ok: #0a8a4a;
  --topo: 64px; --barra: 0px; --borda: clamp(20px, 5vw, 72px);
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body { background: var(--fundo); color: var(--tinta); font: 400 16px/1.45 "Archivo", system-ui, sans-serif; overflow: hidden; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
h1, h2, h3, p, ul, ol, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }
code, .mono { font-family: "JetBrains Mono", ui-monospace, monospace; }
[hidden] { display: none !important; }

/* ---------- topo ---------- */
#topo { height: var(--topo); display: flex; align-items: center; gap: 36px; padding: 0 var(--borda); border-bottom: 1px solid var(--linha); background: var(--fundo); }
.marca { display: flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 900; font-stretch: 112%; font-size: 19px; letter-spacing: -.01em; }
.marca img { display: block; transition: transform .15s; }
.marca:hover img { transform: rotate(-8deg); }
#abas { display: flex; gap: 28px; }
#abas a { text-decoration: none; font-size: 15px; font-weight: 500; color: var(--apagado); padding: 6px 0; border-bottom: 2px solid transparent; transition: color .12s, border-color .12s; }
#abas a:hover { color: var(--tinta); }
#abas a.on { color: var(--tinta); border-color: var(--azul); }
.lado { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.kit-casa, [data-kit-casa] a, [data-kit-casa] button { font: 500 13px "JetBrains Mono", monospace; color: var(--tinta); }

/* ---------- botões ---------- */
.bt { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 22px; border: 0; border-radius: 4px; background: var(--azul); color: #fff; font: 700 16px "Archivo", sans-serif; text-decoration: none; cursor: pointer; transition: background .12s, transform .12s, box-shadow .12s; }
.bt:hover { background: var(--azul-escuro); transform: translateY(-2px); box-shadow: 0 6px 0 -2px rgba(20, 55, 245, .25); }
.bt:disabled { background: #b9c2e8; cursor: not-allowed; transform: none; box-shadow: none; }
.bt.vazio { background: transparent; color: var(--tinta); box-shadow: inset 0 0 0 1.5px var(--tinta); }
.bt.vazio:hover { background: var(--tinta); color: #fff; box-shadow: inset 0 0 0 1.5px var(--tinta); }
.bt.pequeno { height: 40px; padding: 0 16px; font-size: 14px; }
.botoes { display: flex; gap: 12px; flex-wrap: wrap; }
.seta { width: 40px; height: 40px; border: 1.5px solid var(--tinta); border-radius: 4px; background: none; color: var(--tinta); font-size: 18px; cursor: pointer; transition: background .12s, color .12s; }
.seta:hover:not(:disabled) { background: var(--tinta); color: #fff; }
.seta:disabled { border-color: var(--linha); color: var(--linha); cursor: default; }

/* ---------- abas ---------- */
main { height: calc(100dvh - var(--topo) - var(--barra)); }
.aba { display: none; height: 100%; }
.aba.on { display: flex; }
.miolo { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: clamp(12px, 2.2vh, 22px); padding: clamp(18px, 4vh, 44px) var(--borda) clamp(14px, 3vh, 30px); max-width: 1440px; margin: 0 auto; width: 100%; }
h1 { font-size: clamp(38px, 5.8vw, 86px); line-height: .96; font-weight: 900; letter-spacing: -.035em; }
h1 em { font-style: normal; color: var(--azul); display: block; }
h2 { font-size: clamp(30px, 3.6vw, 52px); line-height: 1; font-weight: 800; letter-spacing: -.025em; }
h3 { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; font-weight: 800; }
.sub { color: var(--apagado); font-size: clamp(15px, 1.25vw, 18px); max-width: 56ch; }
.sub b { color: var(--tinta); font-weight: 700; }
.aviso { font-size: 14px; color: var(--apagado); min-height: 20px; }
.aviso.erro { color: var(--erro); }
.vazio-msg { color: var(--apagado); font-size: 15px; padding: 18px 0; }
.fatos { display: grid; gap: 8px; font-size: 15px; }
.fatos li { padding-left: 16px; position: relative; }
.fatos li::before { content: ""; position: absolute; left: 0; top: .62em; width: 8px; height: 2px; background: var(--azul); }
.fatos b { font-weight: 800; }
.cabeca { display: grid; gap: 8px; }
.pe-lista { display: flex; align-items: center; gap: 14px; }
.pe-lista span { font: 500 14px "JetBrains Mono", monospace; color: var(--apagado); min-width: 54px; text-align: center; }
.pe-lista .bt { margin-left: auto; }

/* ---------- início ---------- */
.inicio { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); grid-template-rows: 1fr auto; gap: clamp(18px, 3.4vh, 36px) clamp(24px, 5vw, 80px); align-items: center; }
.faixa { grid-column: 1 / -1; display: grid; gap: 10px; }
.faixa h3 { display: flex; justify-content: space-between; align-items: baseline; }
.faixa h3 a { font-size: 13px; letter-spacing: 0; text-transform: none; font-weight: 700; color: var(--azul); text-decoration: none; }
.faixa h3 a:hover { text-decoration: underline; }
.cartoes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.cartoes > li { border: 1.5px solid var(--tinta); border-radius: 4px; background: #fff; transition: transform .14s, box-shadow .14s; }
.cartoes > li:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0 var(--azul); }
.cartoes a { display: grid; gap: 10px; padding: 14px 16px; text-decoration: none; }
.c-topo { display: grid; grid-template-columns: 40px 1fr auto; gap: 10px; align-items: center; }
.c-topo img { width: 40px; height: 40px; border-radius: 4px; object-fit: cover; background: var(--suave); }
.c-topo b { display: block; font-weight: 900; font-size: 17px; line-height: 1.1; }
.c-topo i { display: block; font-style: normal; font-size: 13px; color: var(--apagado); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.c-topo em { font: 500 12px "JetBrains Mono", monospace; font-style: normal; color: var(--apagado); }
.c-barra { height: 8px; background: var(--azul-claro); border-radius: 2px; overflow: hidden; }
.c-barra i { display: block; height: 100%; background: var(--azul); }
.c-pe { display: flex; justify-content: space-between; font-size: 13px; color: var(--apagado); }
.c-pe strong { font: 700 14px "JetBrains Mono", monospace; color: var(--tinta); }
.cartoes.vazio > li { padding: 14px 16px; display: grid; grid-template-columns: 28px 1fr; gap: 2px 12px; align-items: center; }
.cartoes.vazio b { grid-row: span 2; align-self: start; font: 700 14px "JetBrains Mono", monospace; color: #fff; background: var(--azul); width: 28px; height: 28px; display: grid; place-items: center; border-radius: 2px; }
.cartoes.vazio strong { font-weight: 800; font-size: 16px; }
.cartoes.vazio span { font-size: 13.5px; color: var(--apagado); }
.cartoes.vazio i { font-style: normal; }
#home[data-estado="vazio"] .faixa .cheio, #home[data-estado="cheio"] .faixa .vazio { display: none; }
.heroi { display: grid; gap: clamp(14px, 2.6vh, 26px); }
.placar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.placar li { padding: 12px 14px; border: 1.5px solid var(--tinta); border-radius: 4px; display: grid; gap: 4px; }
.placar li > span { font-size: 13px; color: var(--apagado); }
.placar b { font: 700 clamp(22px, 2.3vw, 32px)/1 "JetBrains Mono", monospace; letter-spacing: -.02em; }
.placar small { font: 500 13px "Archivo", sans-serif; color: var(--apagado); margin-left: 6px; }
.vitrine { display: grid; gap: 14px; }
.topo-moeda { display: grid; gap: 14px; padding: 22px 24px; border-radius: 4px; background: var(--marinho); color: #fff; text-decoration: none; transition: transform .15s, box-shadow .15s; }
a.topo-moeda:hover { transform: translateY(-3px); box-shadow: 0 10px 0 -4px var(--azul); }
#home[data-estado="vazio"] .topo-moeda.cheio, #home[data-estado="cheio"] .topo-moeda.vazio { display: none; }
.rotulo { font: 700 12px "JetBrains Mono", monospace; letter-spacing: .12em; text-transform: uppercase; color: #9fb0ff; }
.topo-moeda .quem { display: flex; align-items: center; gap: 14px; }
.topo-moeda .quem img { border-radius: 4px; object-fit: cover; background: #1a2550; }
.topo-moeda .quem b { display: block; font-size: 28px; font-weight: 900; line-height: 1.05; }
.topo-moeda .quem i { font-style: normal; color: #b8c2e6; font-size: 15px; }
.barra { height: 12px; background: rgba(255, 255, 255, .16); border-radius: 2px; overflow: hidden; }
.barra i { display: block; height: 100%; width: 0; background: #5b78ff; transition: width .5s; }
.legenda { font-size: 14px; color: #b8c2e6; }
.tres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .16); }
.tres i { display: block; font-style: normal; font-size: 13px; color: #b8c2e6; }
.tres b { font: 700 22px/1.2 "JetBrains Mono", monospace; }
.degraus { display: grid; gap: 9px; }
.degraus li { display: grid; grid-template-columns: 148px 1fr 44px; align-items: center; gap: 12px; font-size: 14px; color: #dbe1f7; }
.degraus i { height: 10px; border-radius: 2px; background: linear-gradient(#5b78ff, #5b78ff) left / var(--w) 100% no-repeat, rgba(255, 255, 255, .14); }
.degraus b { font: 700 17px "JetBrains Mono", monospace; color: #fff; text-align: right; }
.recentes { border: 1px solid var(--linha); border-radius: 4px; padding: 16px 20px; }
.recentes h3 { display: flex; justify-content: space-between; align-items: baseline; }
.recentes h3 a { font-size: 13px; letter-spacing: 0; text-transform: none; font-weight: 700; color: var(--azul); text-decoration: none; }
.recentes h3 a:hover { text-decoration: underline; }
.recentes li a { display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 12px; padding: 9px 0; text-decoration: none; border-top: 1px solid var(--linha); transition: padding .12s; }
.recentes li:first-child a { border-top: 0; margin-top: 6px; }
.recentes li a:hover { padding-left: 6px; }
.recentes img { width: 40px; height: 40px; border-radius: 4px; object-fit: cover; background: var(--suave); }
.recentes b { font-weight: 800; }
.recentes i { display: block; font-style: normal; font-size: 13px; color: var(--apagado); }
.recentes em { font: 700 14px "JetBrains Mono", monospace; font-style: normal; color: var(--azul); text-align: right; }
#home[data-estado="cheio"] #h-vazio { display: none; }

/* ---------- moedas ---------- */
.tabela-moedas { flex: 1; min-height: 0; }
#coins[data-estado="cheio"] .vazio { display: none; }
.linha-m { display: grid; grid-template-columns: minmax(0, 2.4fr) 1fr 1.3fr 1.3fr; align-items: center; gap: 12px; height: clamp(46px, 6.6vh, 60px); border-bottom: 1px solid var(--linha); font-size: 16px; }
.linha-m.topo, .linha-h.topo { height: 34px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--tinta); font-weight: 800; border-bottom: 2px solid var(--tinta); }
a.linha-m { text-decoration: none; transition: background .12s, padding .12s; }
a.linha-m:hover { background: var(--suave); padding-left: 8px; }
.linha-m .quem { display: flex; align-items: center; gap: 12px; min-width: 0; }
.linha-m .quem img { width: 36px; height: 36px; object-fit: cover; border-radius: 4px; background: var(--suave); flex: none; }
.linha-m .quem b { font-weight: 800; }
.linha-m .quem span { color: var(--apagado); font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.linha-m .quem em { font: 700 11px "JetBrains Mono", monospace; font-style: normal; letter-spacing: .06em; background: var(--tinta); color: #fff; padding: 2px 6px; border-radius: 2px; }
.linha-m .quem em.stake { background: var(--azul-claro); color: var(--azul); }
.linha-m strong { font: 700 16px "JetBrains Mono", monospace; }

/* ---------- lançar ---------- */
.lanca { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(24px, 5vw, 80px); align-items: center; align-content: center; }
.lanca-form { display: grid; gap: clamp(8px, 1.6vh, 14px); }
#lf { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(8px, 1.4vh, 12px) 14px; }
#lf label, .escolha, .sk-campo { display: grid; gap: 5px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--apagado); }
#lf label i { font-style: normal; text-transform: none; letter-spacing: 0; font-weight: 400; }
#lf input, #f input, .sk-linha input { width: 100%; min-width: 0; height: clamp(40px, 5.4vh, 46px); padding: 0 12px; border-radius: 4px; border: 1.5px solid var(--linha); background: #fff; color: var(--tinta); font: 500 15px "Archivo", sans-serif; outline: none; transition: border-color .12s, box-shadow .12s; }
#lf input:hover, #f input:hover, .sk-linha input:hover { border-color: #aab2c2; }
#lf input:focus, #f input:focus, .sk-linha input:focus { border-color: var(--azul); box-shadow: 0 0 0 3px var(--azul-claro); }
#lf input[type="file"] { padding: 8px 12px; height: auto; font-size: 13px; }
.larga { grid-column: 1 / -1; }
.troca3 { display: grid; grid-template-columns: repeat(3, 1fr); border: 1.5px solid var(--tinta); border-radius: 4px; overflow: hidden; }
.troca3.dois { grid-template-columns: repeat(2, 1fr); }
.troca3.quatro { grid-template-columns: repeat(4, 1fr); }
.troca3 button { all: unset; text-align: center; padding: clamp(7px, 1.2vh, 10px) 4px; font: 700 15px "Archivo", sans-serif; color: var(--tinta); cursor: pointer; transition: background .12s; text-transform: none; letter-spacing: 0; white-space: nowrap; }
.troca3 button.on { background: var(--tinta); color: #fff; }
.troca3 button:hover:not(.on) { background: var(--azul-claro); }
.lanca-lado, .lanca-pagar { border-left: 2px solid var(--azul); padding-left: clamp(20px, 3vw, 40px); display: grid; gap: 12px; }
.lanca-lado h3 { margin-top: 8px; }
.kit-pagar { display: grid; gap: 14px; }
.kit-pagar canvas { width: 200px !important; height: 200px !important; background: #fff; padding: 8px; border: 1px solid var(--linha); border-radius: 4px; }
.kit-rotulo { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--apagado); font-weight: 700; }
.kit-end { font: 500 14px "JetBrains Mono", monospace; word-break: break-all; }
.kit-botoes { display: flex; gap: 10px; flex-wrap: wrap; }
.kit-bt { display: inline-flex; align-items: center; height: 44px; padding: 0 16px; border: 0; border-radius: 4px; background: var(--azul); color: #fff; font: 700 14px "Archivo", sans-serif; cursor: pointer; transition: transform .12s, background .12s; }
.kit-bt:hover { transform: translateY(-2px); background: var(--azul-escuro); }
.kit-bt.ghost { background: transparent; color: var(--tinta); box-shadow: inset 0 0 0 1.5px var(--tinta); }
.kit-bt.ghost:hover { background: var(--tinta); color: #fff; }
.kit-status { display: flex; gap: 8px; align-items: flex-start; font-size: 15px; color: var(--apagado); }
.kit-status.ok { color: var(--ok); }
.kit-status.erro { color: var(--erro); }
.kit-spin { width: 10px; height: 10px; border: 2px solid var(--apagado); border-top-color: transparent; border-radius: 50%; animation: gira 1s linear infinite; margin-top: 6px; flex: none; }
.kit-status.ok .kit-spin, .kit-status.erro .kit-spin { display: none; }
@keyframes gira { to { transform: rotate(360deg); } }
.kit-nota { font-size: 13px; color: var(--apagado); }

/* ---------- a moeda ---------- */
.moeda-topo { display: flex; align-items: center; gap: clamp(14px, 2vw, 28px); }
.moeda-topo img { width: 72px; height: 72px; object-fit: cover; border-radius: 4px; background: var(--suave); flex: none; }
.moeda-topo h2 { font-size: clamp(30px, 3.4vw, 48px); }
.moeda-topo .fatos { margin-left: auto; grid-template-columns: auto auto; gap: 4px 28px; }
.moeda-acoes { display: flex; gap: 10px; flex: none; }
.colunas { flex: 1; min-height: 0; display: grid; gap: clamp(24px, 4vw, 56px); }
.moeda-colunas { grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); }
.coluna { min-height: 0; display: flex; flex-direction: column; }
.coluna h3 { padding-bottom: 10px; border-bottom: 1.5px solid var(--tinta); }
.coluna.dentro h3 { border-color: var(--azul); }
.linha-h, #m-holders li { display: grid; grid-template-columns: 26px minmax(0, 1.3fr) 1fr 1fr .8fr .9fr 52px; align-items: center; gap: 10px; }
#m-holders li { height: clamp(38px, 5.6vh, 50px); border-bottom: 1px solid #cfd5df; font-size: 15px; transition: background .12s; }
#m-holders li:hover { background: var(--suave); }
#m-holders li.vazio-msg { display: block; height: auto; }
#m-holders li i { font: 500 13px "JetBrains Mono", monospace; font-style: normal; color: var(--apagado); }
#m-holders li code { font-size: 14px; }
#m-holders li span, .linha-h span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#m-holders li b { font: 700 18px "JetBrains Mono", monospace; color: var(--azul); text-align: right; }
.linha-h span:last-child { text-align: right; }
#m-eventos li { padding: 10px 0; font-size: 14px; color: var(--apagado); line-height: 1.4; border-bottom: 1px solid var(--linha); }
#m-eventos li b { color: var(--tinta); font-weight: 700; }
#m-eventos li a { color: var(--azul); }

/* ---------- a caixa de stake ---------- */
#sk { width: min(440px, calc(100vw - 32px)); padding: 26px 24px 22px; border: 1.5px solid var(--tinta); border-radius: 4px; background: #fff; color: var(--tinta); box-shadow: 10px 10px 0 var(--azul); }
#sk::backdrop { background: rgba(11, 18, 48, .55); }
#sk[open] { display: grid; gap: 14px; }
#sk h3 { font-size: 26px; font-weight: 800; letter-spacing: -.02em; text-transform: none; }
#sk .sub { margin-bottom: 12px; font-size: 15px; }
.sk-fecha { all: unset; position: absolute; top: 10px; right: 14px; font-size: 28px; line-height: 1; cursor: pointer; color: var(--apagado); }
.sk-fecha:hover { color: var(--tinta); }
#sk-painel { display: grid; gap: 14px; }
.sk-linha { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.sk-linha button { all: unset; padding: 0 14px; border: 1.5px solid var(--tinta); border-radius: 4px; font: 700 13px "Archivo", sans-serif; cursor: pointer; text-transform: uppercase; }
.sk-linha button:hover { background: var(--tinta); color: #fff; }
.sk-botoes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
#sk .fatos b { color: var(--azul); }

/* ---------- a nota da carteira ---------- */
.nota { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(24px, 5vw, 80px); align-items: center; }
.passo { display: none; gap: clamp(12px, 2.2vh, 20px); }
#score[data-estado="pergunta"] .pergunta, #score[data-estado="lendo"] .lendo, #score[data-estado="resultado"] .resultado { display: grid; }
#f { display: grid; grid-template-columns: 1fr auto; gap: 10px; max-width: 620px; }
#f input { height: 48px; font-family: "JetBrains Mono", monospace; font-size: 14px; }
#linhas { display: grid; gap: 8px; font: 500 15px "JetBrains Mono", monospace; color: var(--apagado); }
#linhas li::before { content: "› "; color: var(--azul); }
.grande { font: 800 clamp(96px, 15vw, 210px)/.85 "Archivo", sans-serif; font-stretch: 112%; letter-spacing: -.05em; color: var(--azul); }
#score[data-tom="fora"] .grande { color: var(--erro); }
#score[data-tom="novo"] .grande { color: var(--tinta); }
.resultado h2 { font-size: clamp(24px, 2.6vw, 36px); }
.selo { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; font-size: 14px; }
.selo b { background: var(--tinta); color: #fff; padding: 4px 10px; border-radius: 2px; font: 700 13px "JetBrains Mono", monospace; letter-spacing: .06em; }
.selo span, .selo code { color: var(--apagado); font-family: "JetBrains Mono", monospace; }
.nota-regras { border-left: 2px solid var(--azul); padding-left: clamp(20px, 3vw, 40px); display: grid; gap: 14px; }
#regras { width: 100%; border-collapse: collapse; font-size: 15px; }
#regras th { text-align: left; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--apagado); padding: 0 0 8px; border-bottom: 1.5px solid var(--tinta); }
#regras td { padding: clamp(8px, 1.5vh, 13px) 0; border-bottom: 1px solid var(--linha); }
#regras td:first-child { font: 700 14px "JetBrains Mono", monospace; }
#regras td:last-child, #regras th:last-child { text-align: right; font: 700 18px "JetBrains Mono", monospace; color: var(--azul); }
#regras th:last-child { font: 700 12px "Archivo", sans-serif; color: var(--apagado); }
#regras tr.baixo td:last-child { color: var(--apagado); }
.miudo { font-size: 13px; color: var(--apagado); }

/* ---------- como funciona ---------- */
.como { justify-content: center; gap: clamp(16px, 3.4vh, 34px); }
.passos { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--linha); border-radius: 4px; }
.passos li { padding: clamp(14px, 2.4vh, 24px) 22px; border-left: 1px solid var(--linha); display: grid; gap: 8px; align-content: start; }
.passos li:first-child { border-left: 0; }
.passos b { font: 700 14px "JetBrains Mono", monospace; color: #fff; background: var(--azul); width: 28px; height: 28px; display: grid; place-items: center; border-radius: 2px; }
.passos h3 { font-size: 19px; letter-spacing: -.01em; text-transform: none; }
.passos p { font-size: 15px; color: var(--apagado); }
.perguntas { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(12px, 2.4vh, 22px) 36px; }
.perguntas dt { font-weight: 800; font-size: 16px; margin-bottom: 4px; }
.perguntas dd { font-size: 14.5px; color: var(--apagado); }

#barra { display: none; }

@media (max-width: 820px) {
  :root { --topo: 54px; --barra: 56px; --borda: 18px; }
  #abas, .lado .bt { display: none; }
  #barra { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; height: var(--barra); background: #fff; border-top: 1px solid var(--linha); padding-bottom: env(safe-area-inset-bottom); }
  #barra a { display: grid; place-items: center; text-decoration: none; font-size: 13px; font-weight: 600; color: var(--apagado); border-top: 2px solid transparent; }
  #barra a.on { color: var(--tinta); border-color: var(--azul); }
  .miolo { padding-top: 16px; padding-bottom: 12px; gap: 12px; }
  .inicio, .lanca, .nota { grid-template-columns: 1fr; align-content: start; gap: 14px; }
  .heroi { gap: 12px; }
  .sub { font-size: 15px; }
  .bt { height: 46px; }
  .heroi .botoes .bt { flex: 1; padding: 0 10px; }
  .placar { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .placar li { padding: 8px 12px; }
  .placar b { font-size: 20px; }
  .faixa { display: none; }
  .inicio { grid-template-rows: auto; }
  .topo-moeda { padding: 14px 16px; gap: 9px; }
  .topo-moeda .quem img { width: 44px; height: 44px; }
  .topo-moeda .quem b { font-size: 22px; }
  .tres { padding-top: 10px; }
  .tres b { font-size: 17px; }
  .degraus { gap: 6px; }
  .degraus li { grid-template-columns: 128px 1fr 38px; font-size: 13px; gap: 8px; }
  .degraus li:nth-child(4) { display: none; }
  .lanca-lado, .nota-regras .miudo { display: none; }
  .lanca-pagar { border: 0; padding: 0; }
  .lanca[data-pagando] .lanca-form { display: none; }
  #lf { gap: 8px 10px; }
  #lf input { height: 40px; }
  .troca3 button { font-size: 13.5px; }
  .linha-m .quem span { display: none; }
  .linha-m { grid-template-columns: minmax(0, 2fr) .7fr 1fr; font-size: 14px; }
  .linha-m > :nth-child(4) { display: none; }
  .moeda-topo { flex-wrap: wrap; gap: 10px 14px; }
  .moeda-topo img { width: 48px; height: 48px; }
  .moeda-topo .fatos { margin-left: 0; width: 100%; font-size: 13px; }
  .moeda-acoes { width: 100%; }
  .moeda-acoes .bt { flex: 1; }
  .moeda-colunas { grid-template-columns: 1fr; }
  .moeda-colunas .fora { display: none; }
  .linha-h, #m-holders li { grid-template-columns: 20px minmax(0, 1.2fr) .9fr .7fr 44px; gap: 6px; }
  .linha-h > :nth-child(3), .linha-h > :nth-child(6), #m-holders li > :nth-child(3), #m-holders li > :nth-child(6) { display: none; }
  #m-holders li { font-size: 13px; }
  #f { grid-template-columns: 1fr; }
  .nota-regras { border: 0; padding: 0; gap: 8px; }
  #regras td { padding: 6px 0; font-size: 14px; }
  #score[data-estado="resultado"] .nota-regras { display: none; }
  .grande { font-size: 120px; }
  .passos { grid-template-columns: 1fr; }
  .passos li { border-left: 0; border-top: 1px solid var(--linha); padding: 10px 14px; grid-template-columns: 28px 1fr; gap: 2px 10px; }
  .passos li:first-child { border-top: 0; }
  .passos li p { grid-column: 2; font-size: 13.5px; }
  .passos h3 { font-size: 16px; align-self: center; }
  .perguntas { grid-template-columns: 1fr 1fr; gap: 10px 14px; }
  .perguntas div:nth-child(n+5) { display: none; }
  .perguntas dt { font-size: 14px; }
  .perguntas dd { font-size: 12.5px; }
  .como { justify-content: flex-start; }
}