/* Conta do usuário (perfil e Meus resorts): menu à esquerda + seção à direita. Menu: account-nav.js. Amigos: account-friends.js.
   Celular (até 768 px): a lista é a página inicial da conta; a seção abre sozinha com "← Minha conta" (body.acc-open). */
body { padding-top: var(--ste-header-h, 80px); }   /* barra única fixa (/assets/msl-bar.css) */
.acc { display: grid; grid-template-columns: 264px minmax(0, 1fr); gap: 28px; align-items: start;
    width: 100%; max-width: 1240px; margin: 0 auto; padding: 20px 24px 48px; }
.acc-main { min-width: 0; }

/* ---------- menu ---------- */
.acc-nav { position: sticky; top: calc(var(--ste-header-h, 80px) + 12px); display: flex; flex-direction: column; gap: 6px;
    padding: 14px; border-radius: 18px; background: rgba(255, 255, 255, .035); border: 1px solid var(--glass-border); }
.acc-me { display: flex; align-items: center; gap: 12px; padding: 6px 6px 14px; margin-bottom: 4px; border-bottom: 1px solid var(--glass-border); }
.acc-pic { flex: none; width: 46px; height: 46px; border-radius: 50%; overflow: hidden; display: grid; place-items: center;
    background: #22384F; border: 2px solid #3FA9F5; font: 800 18px 'Archivo', sans-serif; color: #F4F7FA; }
.acc-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.acc-who { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.acc-who b { font-size: 15px; font-stretch: 108%; color: #F4F7FA; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc-who small { font-size: 12px; color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc-list { display: flex; flex-direction: column; gap: 2px; }
.acc-list a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; text-decoration: none;
    color: #DADDF0; font-weight: 600; font-size: 14.5px; transition: background-color .15s, color .15s; }
.acc-list a > i:first-child { width: 18px; text-align: center; color: var(--text-secondary); transition: color .15s; }
.acc-list a span { flex: 1; min-width: 0; }
.acc-list a:hover { background: rgba(255, 255, 255, .05); color: #F4F7FA; }
.acc-list a.on { background: #22384F; color: #3FA9F5; }
.acc-list a.on > i:first-child { color: #3FA9F5; }
.acc-count { font: 600 12px 'IBM Plex Mono', monospace; color: var(--text-secondary); }
.acc-count:empty { display: none; }
.acc-badge { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; display: grid; place-items: center;
    background: #FF5B2E; color: #0C1A2A; font: 700 11.5px/1 'Archivo', sans-serif; font-style: normal; }
.acc-badge[hidden], .acc-list a[hidden], .acc-tile[hidden] { display: none; }   /* hidden: Editar no 3D só aparece para editor convidado */
.acc-go { display: none; color: var(--text-muted); font-size: 12px; }
.acc-out { margin-top: 8px; padding: 10px 12px; border: 0; border-top: 1px solid var(--glass-border); border-radius: 0; background: none;
    color: var(--text-secondary); font: 600 13.5px 'Archivo', sans-serif; text-align: left; cursor: pointer; display: flex; gap: 12px; align-items: center; }
.acc-out:hover { color: #FF5B2E; }
.acc-back { display: none; }
/* admin/moderador: foto clicável abre "Ir para o Painel admin" (account-nav.js) */
.acc-pic-admin { cursor: pointer; border-radius: 50%; }
.acc-pic-admin:hover, .acc-pic-admin:focus-visible { outline: 2px solid #F5A623; outline-offset: 2px; }
.acc-list a.acc-admin > i:first-child { color: #F5A623; }
.acc-pop { position: absolute; z-index: 3000; min-width: 220px; padding: 6px; border-radius: 14px;
    background: #16293D; border: 1px solid var(--glass-border); box-shadow: 0 12px 32px rgba(0, 0, 0, .5); }
.acc-pop[hidden] { display: none; }
.acc-pop a { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 10px; color: #F4F7FA; text-decoration: none; font-weight: 700; font-size: 14px; }
.acc-pop a i { color: #F5A623; }
.acc-pop a:hover, .acc-pop a:focus-visible { background: #22384F; outline: none; }

/* ---------- seções (o que já existia no perfil e no logbook, sem as margens de página inteira) ---------- */
.acc-main .profile-content, .acc-main .profile-stats { max-width: none; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }
.acc-main .profile-stats { margin-top: 0; }
.acc-main .profile-header { background: none; border: 0; padding: 0 0 18px; }
.acc-main .profile-header-inner { max-width: none; }
.acc-main .lb-main { max-width: none; padding-left: 0; padding-right: 0; }
.acc-main > .p-panel > .profile-toolbar:first-child, .acc-main > .profile-content > .profile-toolbar:first-child { margin-top: 0; }

/* Visão geral */
.acc-hero { display: flex; align-items: center; gap: 18px; padding: 22px; border-radius: 18px; background: rgba(255, 255, 255, .035); border: 1px solid var(--glass-border); margin-bottom: 18px; }
.acc-hero .profile-avatar, .acc-hero .profile-avatar-placeholder { width: 72px; height: 72px; }
.acc-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.acc-tile { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 16px; text-decoration: none; color: #F4F7FA;
    background: rgba(255, 255, 255, .035); border: 1px solid var(--glass-border); transition: border-color .15s, transform .15s; }
.acc-tile:hover { border-color: #3FA9F5; transform: translateY(-2px); }
.acc-tile i { font-size: 20px; color: #3FA9F5; }
.acc-tile span { font-weight: 700; font-size: 14.5px; }
.acc-tile b { position: absolute; top: 16px; right: 16px; font: 600 20px 'IBM Plex Mono', monospace; color: #F4F7FA; }

/* Configurações */
.acc-set { display: flex; flex-direction: column; border-radius: 16px; border: 1px solid var(--glass-border); overflow: hidden; }
.acc-set-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; background: rgba(255, 255, 255, .025); }
.acc-set-row + .acc-set-row { border-top: 1px solid var(--glass-border); }
.acc-set-row b { display: block; font-size: 15px; color: #F4F7FA; }
.acc-set-row small { display: block; margin-top: 3px; font-size: 13px; color: var(--text-secondary); }
.acc-set-row .p3d-btn { flex: none; }
/* chave de dois lados (idioma, medidas — account-nav.js): o lado ligado fica azul */
.acc-seg { flex: none; display: inline-flex; padding: 3px; gap: 2px; border-radius: 999px; background: rgba(255, 255, 255, .05); border: 1px solid var(--glass-border); }
.acc-seg button { min-width: 104px; padding: 8px 14px; white-space: nowrap; border: 0; border-radius: 999px; background: none; color: var(--text-secondary); cursor: pointer;
    font: 700 13.5px 'Archivo', sans-serif; transition: background-color .15s, color .15s; }
.acc-set-row .acc-seg button small { display: inline; margin-top: 0; color: inherit; font: 500 11px 'IBM Plex Mono', monospace; opacity: .75; margin-left: 2px; }
.acc-seg button:hover { color: #F4F7FA; }
.acc-seg button[aria-pressed="true"] { background: #3FA9F5; color: #0C1A2A; cursor: default; }
.acc-seg button:focus-visible { outline: 2px solid #3FA9F5; outline-offset: 2px; }

/* Amigos */
.fr-block { margin-bottom: 26px; }
.fr-block h3 { font-size: 15px; font-stretch: 108%; color: #F4F7FA; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.fr-n { font: 600 12px 'IBM Plex Mono', monospace; color: var(--text-secondary); }
.fr-list { list-style: none; display: flex; flex-direction: column; border-radius: 14px; border: 1px solid var(--glass-border); overflow: hidden; }
.fr-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: rgba(255, 255, 255, .025); }
.fr-row + .fr-row { border-top: 1px solid var(--glass-border); }
.fr-pic { flex: none; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: #22384F; font-weight: 800; color: #F4F7FA; }
.fr-pic img { width: 100%; height: 100%; object-fit: cover; }
.fr-who { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.fr-who a, a.fr-pic { text-decoration: none; color: inherit; }
.fr-who a:hover b { color: #3FA9F5; }
.fr-who b { font-size: 14.5px; color: #F4F7FA; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fr-who small { font-size: 12.5px; color: var(--text-secondary); }
.fr-act { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.fr-tag { font-size: 12.5px; color: var(--text-secondary); white-space: nowrap; }
.fr-empty { font-size: 13.5px; color: var(--text-secondary); padding: 4px 2px; }
.fr-search { display: flex; gap: 8px; margin-bottom: 12px; }
.fr-search input { flex: 1; min-width: 0; }

/* Perfil público (pessoa.html) */
.acc.pp { grid-template-columns: minmax(0, 1fr); max-width: 860px; }
.pp-hero { flex-wrap: wrap; }
.pp-who { flex: 1; min-width: 180px; display: flex; flex-direction: column; gap: 4px; }
.pp-nick { font: 600 13.5px "IBM Plex Mono", monospace; color: #8FA3B8; margin-top: -2px; }
.pp-level { font-size: 14px; font-weight: 600; color: #DADDF0; }
.pp-act { flex: none; }
.pp-who .profile-member-since a { color: #3FA9F5; text-decoration: none; }
.pp-socials { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.pp-soc { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 999px; text-decoration: none; color: #F4F7FA;
    background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); font: 600 12.5px 'Archivo', sans-serif; max-width: 220px; }
.pp-soc span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pp-soc:hover { border-color: #3FA9F5; color: #3FA9F5; }
.pp .posts-grid { margin-bottom: 18px; }
.pp a.post-card { color: inherit; text-decoration: none; }
.empty-state .profile-login-btn { margin-top: 8px; }
.empty-state .profile-login-btn i { font-size: 1em; margin: 0; opacity: 1; }

/* ---------- celular ---------- */
@media (max-width: 768px) {
    .acc { grid-template-columns: 1fr; gap: 0; padding: 12px 14px 40px; }
    .acc-nav { position: static; background: none; border: 0; padding: 4px 0; }
    .acc-me { padding: 8px 4px 18px; }
    .acc-pic { width: 56px; height: 56px; }
    .acc-who b { font-size: 18px; }
    .acc-list { border-radius: 16px; border: 1px solid var(--glass-border); overflow: hidden; gap: 0; }
    .acc-list a { padding: 15px 16px; font-size: 15.5px; border-radius: 0; background: rgba(255, 255, 255, .03); }
    .acc-list a + a { border-top: 1px solid var(--glass-border); }
    .acc-list a.on { background: rgba(255, 255, 255, .03); color: #DADDF0; }
    .acc-list a.on > i:first-child { color: var(--text-secondary); }
    .acc-go { display: block; }
    .acc-out { border: 1px solid var(--glass-border); border-radius: 16px; margin-top: 14px; padding: 15px 16px; justify-content: center; }
    body:not(.acc-open) .acc-main { display: none; }
    body.acc-open .acc-nav { display: none; }
    .acc-back { display: inline-flex; align-items: center; gap: 8px; margin: 4px 0 14px; color: #3FA9F5; text-decoration: none; font-weight: 700; font-size: 14.5px; }
    body.acc-public .acc-back { display: none; }
    .acc-hero { padding: 16px; }
    .acc-tiles { grid-template-columns: 1fr 1fr; }
    .acc-set-row { flex-direction: column; align-items: stretch; }
    .acc-seg { display: flex; } .acc-seg button { flex: 1; min-width: 0; }
    .fr-row { flex-wrap: wrap; }
    .fr-act { width: 100%; justify-content: flex-start; padding-left: 52px; }
}