.price-up {
    background-color: rgba(40, 167, 69, 0.4) !important;
    color: #0f5132 !important;
}

.price-down {
    background-color: rgba(220, 53, 69, 0.4) !important;
    color: #842029 !important;
}

.cell-price {
    border-radius: 4px;
    padding: 2px 6px;
    font-variant-numeric: tabular-nums;
}

/* Fundo escuro focado no contraste numérico */
.market-board {
    background-color: #0d1117;
    color: #c9d1d9;
    font-family: 'Inter', -apple-system, sans-serif;
    border-radius: 8px;
    padding: 16px;
}

/* Tipografia Estrita para Alta Frequência */
.market-table {
    width: 100%;
    border-collapse: collapse;
}

    .market-table th {
        color: #8b949e;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        padding-bottom: 12px;
        border-bottom: 1px solid #30363d;
        text-align: right; /* Números sempre alinham à direita */
    }

        .market-table th.text-left {
            text-align: left;
        }

    .market-table td {
        padding: 8px 4px;
        border-bottom: 1px solid #21262d;
        font-variant-numeric: tabular-nums; /* O segredo anti-tremor */
        font-family: 'Roboto Mono', monospace; /* FONTES MONOSPACE SÃO OBRIGATÓRIAS AQUI */
        font-size: 0.9rem;
        text-align: right;
        vertical-align: middle;
    }

        .market-table td.text-left {
            text-align: left;
        }

/* Cores Institucionais (Evitar vermelho/verde puro) */
.text-up {
    color: #2ea043 !important;
}

.text-down {
    color: #f85149 !important;
}

/* Animações otimizadas pela GPU (Hardware Acceleration) */
.cell-flash {
    border-radius: 4px;
    transition: background-color 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: background-color; /* Dica para a placa de vídeo */
}

.flash-up {
    background-color: rgba(46, 160, 67, 0.3) !important;
}

.flash-down {
    background-color: rgba(248, 81, 73, 0.3) !important;
}

/* Barra de Volume Visual (Micro-chart sem Canvas) */
.volume-bar-container {
    width: 60px;
    height: 4px;
    background-color: #30363d;
    border-radius: 2px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 8px;
}

.volume-bar-fill {
    height: 100%;
    background-color: #58a6ff;
    border-radius: 2px;
    transition: width 0.2s ease-out; /* Atualiza suavemente a cada tick */
}

.chart-container {
    width: 100%;
    height: 400px;
    background-color: #131722; /* Cor padrão Dark do TradingView */
    border-radius: 8px;
    border: 1px solid #30363d;
    margin-top: 20px;
}