/* ============================================================
   AprovAKI — Hotfix UI/UX v13 (2026-07-19)
   Arquivo ADITIVO. Carregue depois de aki_uiux_v8.css.

   Correções desta rodada:
   1. Menu do topo/userchip com a mesma tonalidade cinza escura
      do perfil.
   2. @usuario na mesma linha do nome, menor e discreto.
   3. Chip "moeda + X pts" em pill lilás suave, com moeda CSS dourada sem letra.
   ============================================================ */

:root {
    --aki-text-profile: #1e293b;
    --aki-text-muted: #94a3b8;
    --aki-text-soft: #64748b;
}

/* ------------------------------------------------------------
   MENU DO TOPO / USERCHIP
   ------------------------------------------------------------ */
.aki-userchip__head-nome {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 5px !important;
    max-width: 100% !important;
    color: var(--aki-text-profile) !important;
    font-weight: 800 !important;
}

.aki-userchip__head-handle {
    display: inline-block !important;
    max-width: 120px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--aki-text-muted) !important;
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

.aki-userchip__menu a,
.aki-userchip__menu a.aki-userchip__exit,
.aki-userchip__menu a.aki-userchip__admin {
    color: var(--aki-text-profile) !important;
    font-weight: 700 !important;
}

.aki-userchip__menu a i,
.aki-userchip__menu a.aki-userchip__exit i,
.aki-userchip__menu a.aki-userchip__admin i {
    color: var(--aki-text-profile) !important;
}

.aki-userchip__menu a:hover,
.aki-userchip__menu a:focus-visible,
.aki-userchip__menu a.aki-userchip__exit:hover,
.aki-userchip__menu a.aki-userchip__exit:focus-visible {
    color: var(--aki-text-profile) !important;
    background: rgba(30, 41, 59, 0.06) !important;
    outline: none !important;
}

.aki-userchip__menu a:hover i,
.aki-userchip__menu a:focus-visible i {
    color: var(--aki-text-profile) !important;
}

.aki-userchip__admin {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.035) 0%, rgba(244, 194, 74, 0.055) 100%) !important;
}

.aki-userchip__admin:hover,
.aki-userchip__admin:focus-visible {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.07) 0%, rgba(244, 194, 74, 0.10) 100%) !important;
}

.aki-userchip__next-top,
.aki-userchip__next-top span,
.aki-userchip__next-top strong,
.aki-userchip__next-name,
.aki-userchip__next-classe,
.aki-userchip__next-faltam {
    color: var(--aki-text-soft) !important;
}

.aki-userchip__next-top {
    font-weight: 650 !important;
}

.aki-userchip__next-name,
.aki-userchip__next-classe,
.aki-userchip__next-faltam {
    font-weight: 800 !important;
}

/* Chip moeda + X pts do menu: pequeno e alinhado ao nome/@. */
.aki-userchip .aki-userchip__head-coins {
    display: inline-flex !important;
    align-items: center !important;
    align-self: flex-start !important;
    gap: 3px !important;
    margin: 2px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--aki-text-soft) !important;
    font-size: 0.66rem !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

.aki-userchip .aki-userchip__head-coins strong,
.aki-userchip .aki-userchip__head-coins [data-aki-pontos-head] {
    color: var(--aki-text-soft) !important;
    font-size: 0.68rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
}

.aki-userchip .aki-userchip__head-coins span:last-child {
    color: var(--aki-text-soft) !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.aki-userchip .aki-userchip__coin--mini,
.aki-userchip__coin--mini {
    width: 10px !important;
    height: 10px !important;
    flex: 0 0 10px !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.aki-userchip .aki-userchip__coin--mini img,
.aki-userchip__coin--mini img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
}

/* ------------------------------------------------------------
   PERFIL DO ALUNO
   ------------------------------------------------------------ */
.usuario h1 {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 6px !important;
    max-width: 100% !important;
    color: var(--aki-text-profile) !important;
    line-height: 1.15 !important;
    flex-wrap: wrap !important;
}

.usuario-handle {
    display: inline-block !important;
    max-width: 170px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--aki-text-muted) !important;
    font-size: 0.68rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

/* Chip moeda + X pts do perfil: menor que antes e alinhado ao nome. */
.usuario .usuario-akicoins.aki-coin-chip,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    width: fit-content !important;
    margin: 4px 0 0 !important;
    padding: 3px 8px !important;
    border-radius: 999px !important;
    background: #EFEBFF !important;
    border: 1px solid #DED6FA !important;
    color: #514c74 !important;
    font-size: 0.74rem !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.01em !important;
    box-shadow: 0 4px 10px rgba(45, 36, 100, 0.07) !important;
}

.usuario .usuario-akicoins.aki-coin-chip strong,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil strong {
    color: #514c74 !important;
    font-size: 0.76rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
}

.usuario .usuario-akicoins.aki-coin-chip .aki-coin-chip__lbl,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil .aki-coin-chip__lbl {
    color: #64748b !important;
    font-size: 0.70rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.usuario .usuario-akicoins.aki-coin-chip .usuario-akicoins__coin,
.usuario .usuario-akicoins.aki-coin-chip .aki-coin-chip__coin,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil .aki-coin-chip__coin {
    width: 0.86em !important;
    height: 0.86em !important;
    flex: 0 0 0.86em !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.usuario .usuario-akicoins.aki-coin-chip .usuario-akicoins__coin img,
.usuario .usuario-akicoins.aki-coin-chip .aki-coin-chip__coin img,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil .aki-coin-chip__coin img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
}

.stat-label {
    color: var(--aki-text-muted) !important;
}

/* ------------------------------------------------------------
   RANKING: mantém @usuario discreto e AKIcoins pequeno.
   ------------------------------------------------------------ */
.podium-handle-user,
.ranking-person .ranking-handle {
    color: var(--aki-text-muted) !important;
    font-size: 0.64rem !important;
    font-weight: 650 !important;
    line-height: 1.15 !important;
}

.podium-handle-user {
    margin: 1px 0 3px !important;
}

.ranking-person .ranking-handle {
    margin: 1px 0 1px !important;
}

.aki-coin-chip.aki-coin-chip--podium {
    font-size: 0.60rem !important;
    padding: 1px 6px !important;
    gap: 3px !important;
    margin: 1px auto 0 !important;
    line-height: 1.05 !important;
}

.podium-1 .aki-coin-chip.aki-coin-chip--podium {
    font-size: 0.63rem !important;
    padding: 2px 7px !important;
}

.aki-coin-chip.aki-coin-chip--inline {
    font-size: 0.62rem !important;
    padding: 1px 6px !important;
    gap: 3px !important;
    line-height: 1.05 !important;
}

.aki-coin-chip.aki-coin-chip--podium .aki-coin-chip__coin,
.aki-coin-chip.aki-coin-chip--inline .aki-coin-chip__coin {
    width: 0.82em !important;
    height: 0.82em !important;
    flex: 0 0 0.82em !important;
}

@media (max-width: 640px) {
    .aki-userchip__head-handle,
    .usuario-handle {
        font-size: 0.66rem !important;
    }

    .usuario .usuario-akicoins.aki-coin-chip,
    .usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil {
        font-size: 0.70rem !important;
        padding: 3px 7px !important;
    }

    .podium-handle-user,
    .ranking-person .ranking-handle {
        font-size: 0.62rem !important;
    }
}

/* ------------------------------------------------------------
   v12 — Correção final da moeda e do chip de pontuação
   - Moeda CSS dourada sem letra e sem PNG.
   - Perfil: chip lilás abaixo de Nome @usuario.
   - Perfil: chip abre o mesmo balão explicativo do menu.
   ------------------------------------------------------------ */
.aki-akicoin-mark,
.aki-userchip .aki-userchip__coin--mini.aki-akicoin-mark,
.aki-userchip__coin--mini.aki-akicoin-mark,
.usuario .usuario-akicoins.aki-coin-chip .usuario-akicoins__coin.aki-akicoin-mark,
.usuario .usuario-akicoins.aki-coin-chip .aki-coin-chip__coin.aki-akicoin-mark,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil .aki-coin-chip__coin.aki-akicoin-mark {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    background:
        radial-gradient(circle at 32% 25%, rgba(255,255,255,0.96) 0 13%, transparent 14%),
        radial-gradient(circle at 50% 52%, #ffe08a 0%, #f4c24a 54%, #d69a16 100%) !important;
    border: 1px solid rgba(169, 104, 10, 0.34) !important;
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.75),
        inset 0 -1px 2px rgba(100, 62, 0, 0.24),
        0 1px 2px rgba(100, 62, 0, 0.12) !important;
    color: transparent !important;
}

.aki-akicoin-mark img {
    display: none !important;
}

.aki-akicoin-mark::before {
    content: "" !important;
    position: absolute !important;
    inset: 2px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(122, 74, 0, 0.34) !important;
    background: transparent !important;
    transform: none !important;
    text-shadow: none !important;
}

.aki-akicoin-mark::after {
    content: "" !important;
    position: absolute !important;
    width: 2px !important;
    height: 56% !important;
    border-radius: 999px !important;
    background: rgba(122, 74, 0, 0.38) !important;
    transform: rotate(-18deg) !important;
}

.aki-userchip .aki-userchip__coin--mini.aki-akicoin-mark,
.aki-userchip__coin--mini.aki-akicoin-mark {
    width: 11px !important;
    height: 11px !important;
    flex: 0 0 11px !important;
}

.usuario .usuario-akicoins.aki-coin-chip .aki-akicoin-mark,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil .aki-akicoin-mark {
    width: 0.92em !important;
    height: 0.92em !important;
    flex: 0 0 0.92em !important;
}

/* Perfil: Nome @usuario em uma linha; moeda + X pts em outra. */
.usuario h1 {
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
    max-width: 100% !important;
    margin: 0 !important;
    color: var(--aki-text-profile) !important;
    line-height: 1.15 !important;
    flex-wrap: wrap !important;
}

.usuario .usuario-akicoins.aki-coin-chip,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    width: fit-content !important;
    margin: 5px 0 0 !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    background: #EFEBFF !important;
    border: 1px solid #DED6FA !important;
    color: #514c74 !important;
    font-size: 0.74rem !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.01em !important;
    box-shadow: 0 4px 10px rgba(45, 36, 100, 0.07) !important;
    cursor: help !important;
    transform: none !important;
    filter: none !important;
}

.usuario .usuario-akicoins.aki-coin-chip:hover,
.usuario .usuario-akicoins.aki-coin-chip:focus,
.usuario .usuario-akicoins.aki-coin-chip:focus-visible,
.usuario .usuario-akicoins.aki-coin-chip:active,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil:hover,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil:focus,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil:focus-visible,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil:active {
    background: #EFEBFF !important;
    border-color: #DED6FA !important;
    box-shadow: 0 4px 10px rgba(45, 36, 100, 0.07) !important;
    transform: none !important;
    filter: none !important;
    outline: none !important;
}

.usuario .usuario-akicoins.aki-coin-chip:focus-visible,
.usuario-akicoins.aki-coin-chip.aki-coin-chip--perfil:focus-visible {
    outline: 2px solid rgba(75, 60, 184, 0.38) !important;
    outline-offset: 2px !important;
}

.aki-userchip .aki-userchip__head-coins {
    cursor: help !important;
}

/* ------------------------------------------------------------
   v13 — @usuario com grafia estilo Twitter/X
   Mais legível, regular, sem peso grosso e com cinza social.
   ------------------------------------------------------------ */
.usuario-handle,
.aki-userchip__head-handle,
.podium-handle-user,
.ranking-person .ranking-handle {
    color: #536471 !important;
    font-family: inherit !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.usuario-handle {
    font-size: 0.78rem !important;
    line-height: 1.12 !important;
}

.aki-userchip__head-handle {
    font-size: 0.72rem !important;
    line-height: 1.12 !important;
}

.podium-handle-user,
.ranking-person .ranking-handle {
    font-size: 0.72rem !important;
    line-height: 1.15 !important;
}

.usuario-handle:hover,
.aki-userchip__head-handle:hover,
.podium-handle-user:hover,
.ranking-person .ranking-handle:hover,
.podium-handle-user:focus-visible,
.ranking-person .ranking-handle:focus-visible {
    color: #536471 !important;
    text-decoration: none !important;
}

@media (max-width: 640px) {
    .usuario-handle {
        font-size: 0.74rem !important;
    }
    .aki-userchip__head-handle,
    .podium-handle-user,
    .ranking-person .ranking-handle {
        font-size: 0.68rem !important;
    }
}