/* Telas internas: hub, CAR MANAGER e Tasks */
.sobretitulo { font: 600 .78rem var(--f-mono); color: var(--oliva); letter-spacing: .3px; margin-bottom: 4px; }
.texto-suave { color: var(--texto-3); font-size: .9rem; }
.cartao-titulo { font-size: 1rem; margin-bottom: 6px; }
.cartao > * + * { margin-top: 12px; }
.linha-botoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.linha-botoes.entre { justify-content: space-between; }
.divisor { border: 0; border-top: 1px solid var(--linha); margin: 16px 0; }

/* Faixas de convite (push / instalar) */
.faixas { display: grid; gap: 10px; margin-bottom: 18px; }
.faixa { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 14px 16px; border-radius: var(--raio); border: 1px solid var(--linha-forte);
    background: linear-gradient(110deg, rgba(193, 138, 85, .16), rgba(193, 138, 85, .04)); animation: subir .4s ease both; }
.faixa-icone { font-size: 1.5rem; }
.faixa b { display: block; }
.faixa span { color: var(--texto-2); font-size: .86rem; }
@media (max-width: 560px) { .faixa { grid-template-columns: auto 1fr; } .faixa .botao { grid-column: 1 / -1; } }

/* Módulos do hub */
.modulos { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.modulo { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 22px; border-radius: 20px; color: var(--texto); overflow: hidden;
    background: linear-gradient(155deg, rgba(42, 32, 24, .9), rgba(22, 19, 16, .9)); border: 1px solid var(--linha); transition: transform var(--transicao), border-color var(--transicao), box-shadow var(--transicao); }
.modulo::after { content: ""; position: absolute; width: 220px; height: 220px; right: -70px; top: -90px; border-radius: 50%; background: radial-gradient(circle, rgba(193, 138, 85, .22), transparent 70%); pointer-events: none; transition: transform .6s ease; }
.modulo-tarefas::after { background: radial-gradient(circle, rgba(143, 176, 122, .22), transparent 70%); }
a.modulo:hover { text-decoration: none; transform: translateY(-3px); border-color: var(--linha-forte); box-shadow: var(--sombra); }
a.modulo:hover::after { transform: scale(1.25); }
.modulo-topo { display: flex; justify-content: space-between; align-items: center; }
.modulo-icone { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: rgba(193, 138, 85, .14); color: var(--cobre-claro); font-size: 1.4rem; }
.modulo-icone svg { width: 24px; height: 24px; }
.modulo-tarefas .modulo-icone { background: rgba(143, 176, 122, .14); color: var(--oliva); }
.modulo-seta { font-size: 1.3rem; color: var(--texto-3); transition: transform var(--transicao); }
a.modulo:hover .modulo-seta { transform: translateX(4px); color: var(--cobre-claro); }
.modulo h2 { font-size: 1.35rem; font-weight: 800; }
.modulo h2 em { font-style: normal; color: var(--cobre); }
.modulo-tarefas h2 em { color: var(--oliva); }
.modulo p { color: var(--texto-3); font-size: .9rem; }
.modulo-portal { opacity: .8; }
.modulo-numeros { display: flex; gap: 18px; flex-wrap: wrap; margin-top: auto; padding-top: 10px; }
.modulo-numeros div b { display: block; font-size: 1.5rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.modulo-numeros div span { font-size: .75rem; color: var(--texto-3); font-weight: 700; text-transform: uppercase; letter-spacing: .6px; }
.carregando.mini { height: 44px; width: 100%; }
.cor-perigo { color: var(--perigo); } .cor-atencao { color: var(--atencao); } .cor-ok { color: var(--ok); }

.conta { margin-top: 10px; scroll-margin-top: 80px; }
.tabela-rolagem { overflow-x: auto; margin-top: 12px; }
.tabela { width: 100%; border-collapse: collapse; font-size: .9rem; }
.tabela th { text-align: left; font-size: .72rem; text-transform: uppercase; letter-spacing: .8px; color: var(--texto-3); padding: 8px 10px; border-bottom: 1px solid var(--linha); white-space: nowrap; }
.tabela td { padding: 10px; border-bottom: 1px solid rgba(193, 138, 85, .1); vertical-align: middle; }
@media (max-width: 720px) {
    .tabela thead { display: none; }
    .tabela, .tabela tbody, .tabela tr, .tabela td { display: block; }
    .tabela tr { padding: 10px 0; border-bottom: 1px solid var(--linha); }
    .tabela td { border: 0; padding: 3px 0; }
    .tabela td[data-r]::before { content: attr(data-r) ": "; color: var(--texto-3); font-size: .78rem; }
}

/* ===================== CAR MANAGER ===================== */
.veiculos { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.veiculo { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 18px; cursor: pointer; text-align: left; width: 100%;
    background: linear-gradient(155deg, rgba(42, 32, 24, .92), rgba(22, 19, 16, .92)); border: 1px solid var(--linha); transition: transform var(--transicao), border-color var(--transicao); }
.veiculo:hover { transform: translateY(-2px); border-color: var(--linha-forte); }
.veiculo[aria-current="true"] { border-color: var(--cobre); box-shadow: 0 0 0 1px var(--cobre), var(--sombra-p); }
.veiculo-cab { display: flex; gap: 12px; align-items: center; }
.veiculo-ico { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: rgba(193, 138, 85, .14); font-size: 1.6rem; flex-shrink: 0; }
.veiculo-nome { font-weight: 800; font-size: 1.05rem; line-height: 1.2; }
.veiculo-sub { color: var(--texto-3); font-size: .82rem; }
.veiculo-placa { font: 700 .75rem var(--f-mono); letter-spacing: 1.5px; padding: 2px 8px; border-radius: 6px; background: #e9e4dc; color: #1b1814; border-top: 3px solid #2b5aa7; }
.veiculo-dados { display: flex; gap: 16px; flex-wrap: wrap; font-size: .86rem; color: var(--texto-2); }
.veiculo-dados b { color: var(--texto); font-variant-numeric: tabular-nums; }
.veiculo-alerta { font-size: .84rem; padding: 8px 10px; border-radius: 10px; background: rgba(255, 255, 255, .04); }
.veiculo-alerta.vencido { background: rgba(224, 106, 79, .12); color: #f2a08c; }
.veiculo-alerta.proximo { background: rgba(217, 164, 65, .12); color: #ecc679; }
.veiculo-novo { display: grid; place-items: center; gap: 6px; min-height: 160px; border: 1.5px dashed var(--linha-forte); background: transparent; color: var(--texto-2); font-weight: 700; }
.veiculo-novo span { font-size: 2rem; color: var(--cobre); }

.painel-veiculo { margin-top: 26px; animation: subir .35s ease both; }
.acoes-rapidas { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 16px 0 6px; }
.acao { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 8px; border-radius: 16px; border: 1px solid var(--linha); background: rgba(255, 255, 255, .03); cursor: pointer; font-weight: 700; font-size: .84rem; color: var(--texto); transition: transform var(--transicao), border-color var(--transicao), background var(--transicao); }
.acao:hover { border-color: var(--cobre); background: rgba(193, 138, 85, .08); transform: translateY(-2px); }
.acao i { font-style: normal; font-size: 1.5rem; }
@media (max-width: 560px) { .acoes-rapidas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.itens-manut { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.item-manut { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; padding: 14px; border-radius: 14px; border: 1px solid var(--linha); background: rgba(255, 255, 255, .025); position: relative; overflow: hidden; }
.item-manut::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--texto-3); }
.item-manut.ok::before { background: var(--ok); } .item-manut.proximo::before { background: var(--atencao); } .item-manut.vencido::before { background: var(--perigo); }
.item-manut .anel { grid-row: span 3; width: 54px; height: 54px; }
.anel circle { fill: none; stroke-width: 5; }
.anel .trilha { stroke: rgba(255, 255, 255, .08); }
.anel .valor { stroke-linecap: round; transform: rotate(-90deg); transform-origin: center; transition: stroke-dashoffset .9s cubic-bezier(.2, .8, .2, 1); }
.item-manut.ok .valor { stroke: var(--ok); } .item-manut.proximo .valor { stroke: var(--atencao); } .item-manut.vencido .valor { stroke: var(--perigo); } .item-manut.sem_registro .valor { stroke: var(--texto-3); }
.item-manut b { font-size: .95rem; line-height: 1.25; }
.item-manut small { color: var(--texto-3); font-size: .8rem; }
.item-manut .item-acoes { grid-column: 2; display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }

.graficos { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); }
.grafico { position: relative; height: 240px; }
.historico { display: flex; flex-direction: column; }
.historico li { list-style: none; display: grid; grid-template-columns: auto 1fr auto; gap: 4px 12px; align-items: center; padding: 12px 4px; border-bottom: 1px solid rgba(193, 138, 85, .1); }
.historico li:last-child { border-bottom: 0; }
.historico .h-ico { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: rgba(193, 138, 85, .12); grid-row: span 2; }
.historico .h-titulo { font-weight: 700; font-size: .92rem; }
.historico .h-sub { color: var(--texto-3); font-size: .8rem; grid-column: 2; }
.historico .h-valor { font-weight: 800; font-variant-numeric: tabular-nums; text-align: right; }
.historico .h-apagar { grid-column: 3; justify-self: end; border: 0; background: none; color: var(--texto-3); cursor: pointer; font-size: .78rem; padding: 2px 4px; border-radius: 6px; }
.historico .h-apagar:hover { color: var(--perigo); }
.abas-sec { display: flex; gap: 6px; overflow-x: auto; margin: 22px 0 12px; padding-bottom: 2px; }
.abas-sec button { flex-shrink: 0; border: 1px solid var(--linha); background: transparent; color: var(--texto-2); padding: 8px 14px; border-radius: 999px; font-weight: 700; cursor: pointer; }
.abas-sec button[aria-selected="true"] { background: var(--cobre); border-color: var(--cobre); color: #1a120b; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips label { position: relative; }
.chips input { position: absolute; opacity: 0; pointer-events: none; }
.chips span { display: inline-flex; padding: 8px 12px; border-radius: 999px; border: 1px solid var(--linha-forte); font-size: .84rem; font-weight: 600; cursor: pointer; transition: background var(--transicao); }
.chips input:checked + span { background: var(--cobre); color: #1a120b; border-color: var(--cobre); }
.chips input:focus-visible + span { outline: 2px solid var(--cobre-claro); outline-offset: 2px; }
.preco-litro { font: 700 .9rem var(--f-mono); color: var(--oliva); }
.passos { display: flex; gap: 6px; margin-bottom: 4px; }
.passos i { flex: 1; height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .1); }
.passos i.feito { background: var(--cobre); }
.ultimos-grade { display: grid; gap: 10px; }
.ultimos-grade .linha-ult { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 8px; align-items: end; }
@media (max-width: 560px) { .ultimos-grade .linha-ult { grid-template-columns: 1fr 1fr; } .ultimos-grade .linha-ult > .rotulo { grid-column: 1 / -1; } }

/* ===================== TASKS ===================== */
.tasks-kpis { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); margin-bottom: 8px; }
.agua { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: center; }
.copo { position: relative; width: 70px; height: 96px; border: 2px solid rgba(201, 146, 98, .6); border-top: 0; border-radius: 4px 4px 18px 18px; overflow: hidden; }
.copo i { position: absolute; left: 0; right: 0; bottom: 0; height: 0; background: linear-gradient(180deg, rgba(120, 170, 210, .85), rgba(70, 120, 170, .95)); transition: height 1s cubic-bezier(.2, .8, .2, 1); }
.copo i::before { content: ""; position: absolute; left: -50%; top: -6px; width: 200%; height: 12px; border-radius: 40%; background: rgba(160, 200, 230, .9); animation: onda-agua 3s linear infinite; }
@keyframes onda-agua { to { transform: translateX(25%); } }
.jejum-relogio { font: 800 1.8rem var(--f-mono); color: var(--ambar); }
.lista-tarefas { display: flex; flex-direction: column; gap: 8px; }
.tarefa { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--linha); background: rgba(255, 255, 255, .025); border-left: 4px solid var(--cobre); transition: opacity .3s, transform .3s; }
.tarefa.saude { border-left-color: var(--perigo); } .tarefa.trabalho { border-left-color: var(--ambar); } .tarefa.casa { border-left-color: var(--azul-aco); } .tarefa.pessoal { border-left-color: var(--oliva); } .tarefa.lazer { border-left-color: #b48ad1; } .tarefa.agua { border-left-color: #78aad2; } .tarefa.jejum { border-left-color: var(--ambar); }
.tarefa.saindo { opacity: 0; transform: translateX(30px); }
.marcar { width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--linha-forte); background: transparent; cursor: pointer; display: grid; place-items: center; color: transparent; transition: background var(--transicao), border-color var(--transicao); }
.marcar:hover { border-color: var(--oliva); color: var(--oliva); }
.tarefa.feita .marcar { background: var(--oliva); border-color: var(--oliva); color: #13200d; }
.tarefa.feita .t-titulo { text-decoration: line-through; color: var(--texto-3); }
.t-titulo { font-weight: 700; overflow-wrap: anywhere; }
.t-meta { display: flex; gap: 8px; flex-wrap: wrap; color: var(--texto-3); font-size: .78rem; }
.t-tag { font: 700 .7rem var(--f-mono); letter-spacing: .6px; text-transform: uppercase; padding: 1px 6px; border-radius: 6px; background: rgba(255, 255, 255, .06); }
.t-pontos { font: 800 .85rem var(--f-mono); color: var(--oliva); background: rgba(143, 176, 122, .1); padding: 4px 8px; border-radius: 8px; }
.t-menu { border: 0; background: none; color: var(--texto-3); cursor: pointer; padding: 4px 6px; border-radius: 8px; }
.t-menu:hover { color: var(--perigo); }
.confete { position: fixed; z-index: 300; pointer-events: none; width: 8px; height: 12px; border-radius: 2px; animation: cair 1.1s cubic-bezier(.2, .6, .4, 1) forwards; }
@keyframes cair { to { transform: translate(var(--dx), var(--dy)) rotate(var(--rot)); opacity: 0; } }
.titulo-veiculo { font-size: clamp(1.4rem, 4vw, 2rem); font-weight: 800; letter-spacing: -.4px; }
#mv-excluir { margin-top: 18px; }
.sem-historico { grid-column: 1 / -1; border: 1px dashed var(--linha-forte); border-radius: 14px; background: rgba(255, 255, 255, .02); }
.sem-historico summary { cursor: pointer; padding: 14px 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-weight: 800; list-style: none; }
.sem-historico summary::-webkit-details-marker { display: none; }
.sem-historico summary::before { content: "▸"; color: var(--cobre); transition: transform var(--transicao); }
.sem-historico[open] summary::before { transform: rotate(90deg); }
.sem-historico summary small { flex-basis: 100%; font-weight: 400; color: var(--texto-3); font-size: .82rem; }
.lista-compacta { list-style: none; padding: 0 16px 12px; display: grid; gap: 4px 18px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.lista-compacta li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid rgba(193, 138, 85, .1); font-size: .9rem; }

/* Hub v2, conta e administração */
.modulo-tickets .modulo-icone { background: rgba(110, 140, 168, .16); color: #9fbad3; } .modulo-tickets::after { background: radial-gradient(circle, rgba(110, 140, 168, .25), transparent 70%); }
.modulo-financas .modulo-icone { background: rgba(217, 164, 65, .16); color: var(--ambar); } .modulo-financas::after { background: radial-gradient(circle, rgba(217, 164, 65, .22), transparent 70%); }
.modulo-games .modulo-icone { background: rgba(180, 138, 209, .16); color: #c9a6e3; } .modulo-games::after { background: radial-gradient(circle, rgba(180, 138, 209, .25), transparent 70%); }
.modulo-tickets h2 em { color: #9fbad3; } .modulo-financas h2 em { color: var(--ambar); } .modulo-games h2 em { color: #c9a6e3; }
.cartao-link { color: var(--texto); transition: border-color var(--transicao), transform var(--transicao); }
.cartao-link:hover { text-decoration: none; border-color: var(--linha-forte); transform: translateY(-2px); }
.painel-admin { margin-bottom: 8px; }
.faixa-perigo { border-color: rgba(224, 106, 79, .5); background: linear-gradient(110deg, rgba(224, 106, 79, .16), rgba(224, 106, 79, .04)); }
.grade-conta { grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); }
.avatar-atual { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.avatar-enorme { width: 96px; height: 96px; border-radius: 24px; display: grid; place-items: center; background: linear-gradient(135deg, var(--cobre), var(--cobre-escuro)); color: #1a120b; font-size: 2rem; font-weight: 800; border: 2px solid var(--cobre-claro); }
.presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 8px; }
.preset { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 4px; border-radius: 12px; border: 1px solid var(--linha); background: rgba(255, 255, 255, .02); color: var(--texto-2); font-size: .72rem; font-weight: 700; cursor: pointer; transition: transform var(--transicao), border-color var(--transicao); }
.preset img { width: 56px; height: 56px; border-radius: 10px; }
.preset:hover { transform: translateY(-2px); border-color: var(--linha-forte); }
.preset[aria-checked="true"] { border-color: var(--cobre); background: rgba(193, 138, 85, .14); color: var(--texto); }
.busca { min-height: 42px; padding: 8px 14px; border-radius: 12px; border: 1px solid rgba(193, 138, 85, .28); background: rgba(10, 9, 8, .55); color: var(--texto); width: 100%; }
.busca:focus { outline: none; border-color: var(--cobre); }
.busca-curta { width: 110px; }
.lista-pendentes { display: grid; gap: 12px; }
.pendente-item { border-color: rgba(217, 164, 65, .5); }
.pendente-cab { display: flex; gap: 12px; align-items: center; }
.pendente-cab small { display: block; color: var(--texto-3); font-size: .8rem; }
.lista-usuarios { display: flex; flex-direction: column; margin-top: 10px; }
.usuario-item { padding: 12px 4px; border-bottom: 1px solid rgba(193, 138, 85, .12); display: flex; flex-direction: column; gap: 8px; }
.usuario-item.inativo { opacity: .55; }
.usuario-cab { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; align-items: center; }
.usuario-cab small { display: block; color: var(--texto-3); font-size: .78rem; }
.usuario-cab select, .tk-controles select, .fin-filtros select { min-height: 36px; border-radius: 10px; border: 1px solid var(--linha-forte); background: rgba(10, 9, 8, .6); color: var(--texto); padding: 0 8px; }
.chips-produtos .chips span, .chips-produtos span { font-size: .78rem; padding: 6px 10px; }
.chave-mini { font-size: .84rem; }
.chave-mini input { width: 36px; height: 22px; } .chave-mini input::after { width: 16px; height: 16px; } .chave-mini input:checked::after { transform: translateX(14px); }
.modulo-escritorio .modulo-icone { background: rgba(127, 209, 217, .14); color: #7fd1d9; } .modulo-escritorio::after { background: radial-gradient(circle, rgba(233, 154, 184, .22), transparent 70%); }
.modulo-escritorio h2 em { color: #7fd1d9; }