:root{color-scheme:dark;--bg:#0b111b;--card:#131b29;--txt:#e8edf5;--sec:#93a1b5;--bd:rgba(255,255,255,.1);--acc:#4aa8ff;--accbg:rgba(74,168,255,.16);--on-acc:#06131f;--erro:#f09595;--erro-bg:rgba(226,75,74,.18)}
:root[data-tema="claro"]{color-scheme:light;--bg:#f2f5f9;--card:#fff;--txt:#1b2430;--sec:#5c6b7e;--bd:rgba(0,0,0,.12);--acc:#185fa5;--accbg:#e6f1fb;--on-acc:#fff;--erro:#a32d2d;--erro-bg:#fcebeb}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--txt);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}
.topo{display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--card);border-bottom:.5px solid var(--bd)}
.marca{font-weight:500;font-size:16px}
.sub{color:var(--sec);font-size:13px;font-weight:400}
.espaco{flex:1}
.usuario{display:flex;align-items:center;gap:8px;font-size:13px}
.avatar{width:26px;height:26px;border-radius:50%}
.chip{background:var(--accbg);color:var(--acc);padding:2px 10px;border-radius:8px;font-size:12px}
.sair{color:var(--sec);text-decoration:none;font-size:13px}
.pagina{max-width:720px;margin:0 auto;padding:16px}
.cartao{background:var(--card);border:.5px solid var(--bd);border-radius:12px;padding:14px 16px;margin:0 0 12px}
.centro{text-align:center;padding:32px 16px}
h1{font-size:20px;font-weight:500;margin:0 0 6px}
h2{font-size:16px;font-weight:500;margin:0 0 4px}
.linha-topo{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 4px}
.linha-topo h1{flex:1;margin:0}
.seletor{display:flex;align-items:center;gap:8px}
select{font:inherit;font-size:14px;padding:6px 10px;border-radius:8px;border:.5px solid var(--bd);background:var(--card);color:var(--txt);max-width:220px}
.botao{display:inline-block;margin-top:8px;padding:8px 18px;border-radius:8px;background:var(--acc);color:var(--on-acc);text-decoration:none;font-weight:500}
.erro{background:var(--erro-bg);color:var(--erro);padding:8px 12px;border-radius:8px;font-size:13px}
.lista{margin-top:8px}
.item{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:8px 6px;border-top:.5px solid var(--bd);font-size:14px}
.item:first-child{border-top:none}
.item.meu{background:var(--accbg);border-radius:8px;border-top-color:transparent}
.pos{font-weight:500;color:var(--sec)}
.nome{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mapa{font-size:11px;padding:1px 8px;border-radius:8px;background:var(--bg);color:var(--sec)}
.medalhas{font-size:12px;color:var(--sec)}
@media (max-width:480px){.item{grid-template-columns:28px minmax(0,1fr) auto}.item .mapa{display:none}}
.marca{display:flex;align-items:center;gap:10px;color:var(--txt);text-decoration:none}
.logo{width:44px;height:44px;border-radius:50%}
.titulo{font-weight:500;font-size:17px}
.logo-grande{width:96px;height:96px;border-radius:50%;margin:0 0 8px}
.menu{display:flex;align-items:center;gap:4px;margin-left:12px}
.menu a,.menu .breve{padding:6px 12px;border-radius:8px;font-size:14px;text-decoration:none}
.menu a{color:var(--txt)}
.menu a.ativo{background:var(--accbg);color:var(--acc)}
.menu a:hover:not(.ativo){background:var(--bg)}
.menu .breve{color:var(--sec);opacity:.75;cursor:default}
.troca{display:flex;align-items:flex-start;gap:12px;margin:12px 0 4px;cursor:pointer}
.troca input{width:20px;height:20px;margin-top:2px;accent-color:var(--acc)}
.troca .texto{display:flex;flex-direction:column;gap:2px}
@media (max-width:640px){.menu{order:3;width:100%;margin:0;flex-wrap:wrap}.topo{flex-wrap:wrap}.titulo{font-size:15px}}
.tema{font:inherit;font-size:13px;padding:4px 10px;border-radius:8px;border:.5px solid var(--bd);background:transparent;color:var(--sec);cursor:pointer}
.tema:hover{color:var(--txt)}