/* Rolagem (ROLAGEM.md): regras de processamento. Carregado por último no index.html, ganha na cascata sem mexer nos CSS antigos. */
/* §4: painel largo em 2 colunas (Ações | Balanço) que cabe sem rolar em 844×390 e 740×360. Só "Ver tudo" rola, dentro da coluna. */
body.map-first #economy-dialog[open]{display:flex;flex-direction:column}
body.map-first #economy-dialog .dialog-top{position:static;flex:none;margin:0 0 6px;padding:0}
#economy-dialog .economy-cols{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
#economy-dialog .economy-cols>section{position:relative;display:flex;flex-direction:column;gap:6px;min-height:0}
#economy-dialog .economy-cols>section>h3{flex:none;margin:0;font:600 11px/16px var(--body);letter-spacing:.08em;text-transform:uppercase;color:#9fb6bb}

/* Ações: nome + 1 linha de efeito à esquerda (é o botão do "i"), ação de 44 px com o custo à direita. */
#economy-dialog .economy-row{flex:none;gap:6px;margin:0;padding:4px 6px 4px 2px;min-height:56px}
#economy-dialog .economy-row .economy-info{flex:1;min-width:0;min-height:44px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;padding:0 6px;border:0;border-radius:6px;background:none;color:inherit;text-align:left;cursor:pointer}
#economy-dialog .economy-row .economy-info:focus-visible{outline:2px solid #d0e8bf;outline-offset:1px}
#economy-dialog .economy-row strong{display:flex;align-items:center;gap:6px;max-width:100%;margin:0;font:600 14px/1.2 var(--body);color:#e6efe6;white-space:nowrap}
#economy-dialog .economy-row strong>span{min-width:0;overflow:hidden;text-overflow:ellipsis}
#economy-dialog .economy-row strong i{flex:none;display:inline-grid;place-items:center;width:16px;height:16px;border:1px solid #9fc3c180;border-radius:50%;font:italic 600 11px/1 var(--body);color:#9fc3c1}
#economy-dialog .economy-row .economy-info[aria-expanded=true] strong i{background:#9fc3c1;color:#0b1c22}
#economy-dialog .economy-effect,#economy-dialog .economy-deadline{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:12px/1.3 var(--body);color:#c2d6d2}
#economy-dialog .economy-deadline{font-weight:600;color:#f0c27a}
#economy-dialog .economy-deadline[hidden]{display:none}
#economy-dialog .economy-row :is(#compact-spread,#erase-traces,[data-project]){flex:none;display:block;width:100px;min-width:0;min-height:44px;padding:4px 6px;font:600 12px/1.2 var(--body)}
/* Bloqueado, o botão mostra o motivo ("A pesquisa ainda não começou"): em 11 px cabe em 2 linhas e a linha não cresce. */
#economy-dialog .economy-row :is(#erase-traces,[data-project]):disabled{font-size:11px;line-height:1.15}
#economy-dialog .economy-row :is(#compact-spread,#erase-traces,[data-project]) small{display:block;margin-top:1px;font:400 11px/1.2 var(--body)}

/* "i" e "Saldo negativo?": o texto cobre a própria coluna e volta num toque. */
#economy-dialog .economy-tip{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;gap:8px;overflow:auto;margin:0;padding:12px 14px;border:1px solid #9fc3c14d;border-radius:8px;background:#0e232a;box-shadow:0 6px 24px #0008;cursor:pointer}
#economy-dialog .economy-tip[hidden]{display:none}
#economy-dialog .economy-tip p{flex:none;margin:0;font:13px/1.45 var(--body);color:#d0ddd8}
#economy-dialog .economy-tip .erase-outlook{flex:none;padding-top:8px}
#economy-dialog .economy-tip>span{margin-top:auto;font:11px var(--body);color:#8fa8ad}

/* Balanço: saldo grande + reserva, os 3 maiores de cada lado; "Ver tudo" troca pela lista inteira, que rola na coluna. */
#economy-dialog #economy-body{flex:1;min-height:0}
#economy-dialog[data-view=all] #economy-body{overflow-y:auto;overscroll-behavior:contain}
#economy-dialog .economy-net{flex-direction:row;align-items:center;gap:10px;min-height:40px;margin:0;padding:2px 10px}
#economy-dialog .economy-net strong{flex:none;font-size:22px;line-height:1.1}
#economy-dialog .economy-net span{flex:1;min-width:0;font:12px/1.3 var(--body)}
/* Fundo da virada: uma linha sob o saldo; o texto inteiro abre o "Ver tudo". */
#economy-dialog .economy-fund{margin:2px 0 0;padding:0 10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:12px/1.3 var(--body);color:#c2d6d2}#economy-dialog .economy-fund-note{margin:4px 0 0}
#economy-dialog .economy-all{display:none}
#economy-dialog[data-view=all] .economy-all{display:block}
#economy-dialog[data-view=all] .economy-brief{display:none}
#economy-dialog #economy-body h3{margin:6px 0 0}
#economy-dialog #economy-body .economy-brief li{padding:1px 0;line-height:1.25}
#economy-dialog #economy-body .economy-brief li>span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#economy-dialog .economy-links{flex:none;display:flex;gap:8px}
#economy-dialog .economy-links>button{flex:1;min-height:44px;padding:4px 8px;border:1px solid #9fc3c14d;border-radius:6px;background:#9fc3c112;color:#cfe0dc;font:600 12px var(--body);cursor:pointer}
#economy-dialog .economy-links>.economy-help-link{color:#e3d3a8;border-color:#d5ba7966}
#economy-dialog .economy-links>.economy-help-link[data-deficit=true]{background:#f0c27a22;border-color:#f0c27a;color:#f6dcb0}

/* Coluna Ações (MEIO.md §6, §8): seis linhas de 44 px cabem em 740×360 sem rolar:
   a linha cresce até 56 px se sobra altura, a moldura vira sombra interna (não ocupa altura) e o espaço entre linhas cai a 2 px. */
#economy-dialog .economy-cols>section.economy-actions{gap:2px}
#economy-dialog .economy-actions .economy-row{flex:1 1 auto;min-height:44px;max-height:56px;padding:0 6px 0 2px;border:0;box-shadow:inset 0 0 0 1px #9fc3c133}
#economy-dialog .economy-actions .economy-row .economy-info{min-height:44px;gap:1px}
#economy-dialog .economy-effect,#economy-dialog .economy-deadline{line-height:1.2}
/* Operações (MEIO.md §8): a linha abre um painel que cobre a coluna Ações, com as três operações em linhas iguais às
   outras e uma faixa de 44 px com o título e o "Voltar". Os textos do "i" lá dentro cobrem o painel. */
#economy-dialog .economy-row .economy-ops-open{flex:none;display:block;width:100px;min-height:44px;padding:4px 6px;border:1px solid #9fc3c166;border-radius:6px;background:#9fc3c112;color:#cfe0dc;font:600 12px/1.2 var(--body);cursor:pointer}
#economy-dialog .economy-row .economy-ops-open small{display:block;margin-top:1px;font:400 11px/1.2 var(--body)}
#economy-dialog .economy-ops{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;gap:2px;background:#0e232a}
#economy-dialog .economy-ops[hidden]{display:none}
#economy-dialog .economy-ops-top{flex:none;display:flex;align-items:center;justify-content:space-between;gap:8px}
#economy-dialog .economy-ops-top h3{margin:0;font:600 11px/16px var(--body);letter-spacing:.08em;text-transform:uppercase;color:#9fb6bb}
#economy-dialog .economy-ops-back{min-height:44px;min-width:88px;padding:4px 10px;border:1px solid #9fc3c14d;border-radius:6px;background:#9fc3c112;color:#cfe0dc;font:600 12px var(--body);cursor:pointer}
/* Resumo do Balanço (MEIO.md §7.1): produção − operação − sigilo − projetos, uma linha cada, a nota curta ao lado do nome. */
#economy-dialog #economy-body .economy-sum li{padding:3px 0}
#economy-dialog #economy-body .economy-sum li small{display:inline;margin:0 0 0 4px}
/* Mascaramento e operações armados: o segundo toque compra (pago na hora, sem cancelar). */
#economy-dialog .economy-row [data-confirm].is-armed{border-color:#f0c27a;background:#f0c27a26;color:#f6dcb0}
/* Em operação: verde como o projeto ligado, mesmo bloqueado (não reativa até acabar). */
#economy-dialog .economy-row [data-project=mask].is-active{border-color:#b9e986;background:#b9e98640;color:#effbe4}
@media(max-height:400px){body.map-first #economy-dialog .dialog-top{margin-bottom:0}body.map-first #economy-dialog[open]{padding-bottom:6px}}
/* Destilado: sem os títulos "Ações" e "Balanço" (o saldo grande já diz o que é); linha escondida não ocupa espaço. */
#economy-dialog .economy-cols>section>h3{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#economy-dialog .economy-row[hidden],#economy-dialog .economy-help-link[hidden]{display:none}