/* OCTT Gamificação — barra do dashboard Tutor + perfil público (VIS-3) */

    .octt-gamif-bar {
        background: linear-gradient(135deg,#1a1a2e 0%,#2d1b6e 100%);
        padding: .7rem 0;
    }
    .octt-gamif-inner {
        max-width: 1200px; margin: 0 auto; padding: 0 1.5rem;
        display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap;
    }
    .octt-gamif-nivel-bloco {
        display: flex; align-items: center; gap: .65rem; flex: 1; min-width: 180px; cursor: default;
    }
    .octt-gamif-estrela { font-size: 1.4rem; flex-shrink: 0; }
    .octt-gamif-nivel-nome {
        display: block; font-weight: 700; font-size: .83rem; color: #e8d5ff; margin-bottom: .2rem;
    }
    .octt-gamif-xp-linha { display: flex; align-items: center; gap: .45rem; }
    .octt-gamif-xp-trilho {
        flex: 1; height: 5px; background: rgba(255,255,255,.15); border-radius: 3px; overflow: hidden;
    }
    .octt-gamif-xp-preenchido {
        height: 100%; background: linear-gradient(90deg,#a78bfa,#f0abfc);
        border-radius: 3px; transition: width .6s ease;
    }
    .octt-gamif-xp-num { font-size: .73rem; color: #c4b5fd; white-space: nowrap; }
    .octt-gamif-streak {
        display: flex; align-items: center; gap: .3rem;
        background: rgba(255,255,255,.1); border-radius: 50px; padding: .32rem .8rem;
    }
    .octt-gamif-streak strong { font-size: 1rem; color: #ffd700; }
    .octt-gamif-streak-label { font-size: .73rem; color: rgba(255,255,255,.7); }
    .octt-gamif-badges-bar { display: flex; gap: .3rem; flex-wrap: wrap; }
    .octt-gamif-badge {
        font-size: 1.2rem; cursor: default;
        display: inline-block; transition: transform .15s;
    }
    .octt-gamif-badge:hover { transform: scale(1.25); }
    @media (max-width: 600px) {
        .octt-gamif-inner { gap: .75rem; }
        .octt-gamif-nivel-bloco { min-width: 140px; }
    }

    .octt-pub-conquistas {
        margin: 2rem auto 3rem;
        padding: 0 15px;
    }
    .octt-pub-section-title {
        font-size: 1.2rem; font-weight: 700; color: #1a1a2e;
        margin: 0 0 1rem; padding-bottom: .5rem;
        border-bottom: 2px solid #ede9fe;
    }
    /* ── Nível strip ── */
    .octt-pub-nivel-strip {
        display: flex; align-items: center; flex-wrap: wrap; gap: 1rem;
        background: linear-gradient(135deg,#1a1a2e 0%,#2d1b6e 100%);
        border-radius: 12px; padding: 1rem 1.5rem;
        margin-bottom: 1.5rem; color: #fff;
    }
    .octt-pub-nivel-badge {
        width: 52px; height: 52px; flex-shrink: 0;
        border-radius: 50%; border: 2px solid rgba(255,255,255,.3);
        background: rgba(255,255,255,.08);
        display: flex; align-items: center; justify-content: center;
        font-size: 1.7rem;
    }
    .octt-pub-nivel-badge img { width: 34px; height: 34px; object-fit: contain; }
    .octt-pub-nivel-info { flex: 1; min-width: 150px; }
    .octt-pub-nivel-nome { display: block; font-size: .88rem; font-weight: 700; color: #c4b5fd; margin-bottom: .35rem; }
    .octt-pub-xp-trilho { height: 7px; background: rgba(255,255,255,.15); border-radius: 4px; overflow: hidden; margin-bottom: .3rem; }
    .octt-pub-xp-fill { height: 100%; background: linear-gradient(90deg,#a78bfa,#f0abfc); border-radius: 4px; transition: width .6s ease; }
    .octt-pub-xp-label { font-size: .72rem; color: rgba(255,255,255,.5); }
    .octt-pub-streak {
        display: flex; flex-direction: column; align-items: center; gap: .1rem;
        background: rgba(255,255,255,.1); border-radius: 10px; padding: .5rem 1rem; flex-shrink: 0;
    }
    .octt-pub-streak-icon { font-size: 1.5rem; line-height: 1; }
    .octt-pub-streak-val  { font-size: 1.2rem; font-weight: 700; color: #ffd700; line-height: 1; }
    .octt-pub-streak-label { font-size: .62rem; color: rgba(255,255,255,.55); text-transform: uppercase; letter-spacing: .05em; }
    /* ── Badges ── */
    .octt-pub-badges-titulo {
        font-size: .8rem; font-weight: 700; color: #6b21a8;
        margin: 0 0 .75rem; text-transform: uppercase; letter-spacing: .05em;
    }
    .octt-pub-badges-grid { display: flex; flex-wrap: wrap; gap: .65rem; }
    .octt-pub-badge-card {
        display: flex; flex-direction: column; align-items: center; gap: .3rem;
        background: #f5f0ff; border: 1px solid #ddd6fe; border-radius: 12px;
        padding: .65rem 1rem; min-width: 80px; cursor: default;
        transition: transform .15s;
    }
    .octt-pub-badge-card:hover { transform: translateY(-2px); }
    .octt-pub-badge-img  { width: 44px; height: 44px; object-fit: contain; }
    .octt-pub-badge-icon { font-size: 2rem; line-height: 1; }
    .octt-pub-badge-nome { font-size: .65rem; font-weight: 600; color: #6b21a8; text-align: center; max-width: 80px; line-height: 1.2; }
    @media (max-width: 600px) {
        .octt-pub-nivel-strip { padding: .75rem 1rem; }
        .octt-pub-streak { flex-direction: row; gap: .4rem; }
    }