@import"https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&family=Inter:wght@300;400;500;600&family=Press+Start+2P&display=swap";:root{--ui-escala: 2;--ui-painel-barra: url(/ui/painel_barra.png);--ui-painel-modal: url(/ui/painel_modal.png);--ui-painel-tooltip: none;--ui-slot-vazio: url(/ui/slot.png);--ui-slot-habilidade: none;--ui-slot-consumivel: none;--ui-botao: url(/ui/botao.png);--ui-botao-hover: url(/ui/botao_hover.png);--ui-botao-ativo: url(/ui/botao_ativo.png);--ui-botao-desabilitado: url(/ui/botao_desabilitado.png);--ui-xp-trilho: none;--ui-xp-preenchimento: none;--ui-badge-gold: none;--ui-corte: 3}.pixelart,.pixelart img,[class*=ui_]{image-rendering:pixelated;-ms-interpolation-mode:nearest-neighbor}.ui_painel{border-style:solid;border-width:calc(var(--ui-corte) * var(--ui-escala) * 1px);border-image:var(--ui-painel-modal) var(--ui-corte) fill repeat;image-rendering:pixelated}.ui_barra{border-style:solid;border-width:calc(var(--ui-corte) * var(--ui-escala) * 1px);border-image:var(--ui-painel-barra) var(--ui-corte) fill repeat;image-rendering:pixelated}.ui_slot{border-style:solid;border-width:calc(var(--ui-corte) * var(--ui-escala) * 1px);border-image:var(--ui-slot-vazio) var(--ui-corte) fill repeat;image-rendering:pixelated}.ui_botao{border-style:solid;border-width:calc(var(--ui-corte) * var(--ui-escala) * 1px);border-image:var(--ui-botao) var(--ui-corte) fill repeat;image-rendering:pixelated}.ui_botao:hover:not(:disabled){border-image-source:var(--ui-botao-hover)}.ui_botao:active:not(:disabled){border-image-source:var(--ui-botao-ativo)}.ui_botao:disabled{border-image-source:var(--ui-botao-desabilitado)}:root{--cor_fundo_principal: #0a0e17;--cor_fundo_painel: #111827;--cor_fundo_cartao: #1a2236;--cor_borda_padrao: #2a3555;--cor_borda_ativa: #f59e0b;--cor_texto_principal: #e2e8f0;--cor_texto_secundario: #94a3b8;--cor_texto_titulo: #f8fafc;--cor_dourado: #f59e0b;--cor_dourado_escuro: #d97706;--cor_hp: #ef4444;--cor_mp: #3b82f6;--cor_for: #f97316;--cor_int: #a855f7;--cor_agi: #22c55e;--cor_botao: #f59e0b;--cor_botao_hover: #d97706;--cor_botao_desabilitado: #374151;--cor_erro: #ef4444;--cor_sucesso: #22c55e;--sombra_brilho: 0 0 20px rgba(245, 158, 11, .3);--sombra_cartao: 0 4px 12px rgba(0, 0, 0, .4)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{margin:0;padding:0;width:100vw;height:100vh;overflow:hidden;font-family:Inter,sans-serif;background-color:var(--cor_fundo_principal);color:var(--cor_texto_principal)}#app_principal{width:100vw;height:100vh;margin:0;padding:0;overflow:hidden;display:flex}.container_de_criacao{display:grid;grid-template-columns:1fr 280px 1fr;gap:24px;max-width:1200px;width:100%;min-height:80vh}.painel_de_classes,.painel_de_confirmacao{background:var(--cor_fundo_painel);border:1px solid var(--cor_borda_padrao);border-radius:16px;padding:24px;overflow-y:auto;max-height:85vh}.painel_de_visualizacao{display:flex;align-items:center;justify-content:center}.titulo_do_painel{font-family:Cinzel,serif;font-size:1.3rem;font-weight:700;color:var(--cor_dourado);text-align:center;margin-bottom:20px;letter-spacing:1px;text-transform:uppercase}.grade_de_cartoes{display:flex;flex-direction:column;gap:12px}.cartao_de_classe{background:var(--cor_fundo_cartao);border:2px solid var(--cor_borda_padrao);border-radius:12px;padding:16px;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.cartao_de_classe:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--cor_dourado),transparent);opacity:0;transition:opacity .3s ease}.cartao_de_classe:hover{border-color:#f59e0b66;transform:translateY(-2px);box-shadow:var(--sombra_cartao)}.cartao_de_classe:hover:before{opacity:.5}.cartao_de_classe.classe_ativa{border-color:var(--cor_dourado);box-shadow:var(--sombra_brilho);background:linear-gradient(135deg,#1a2236,#1e2a42)}.cartao_de_classe.classe_ativa:before{opacity:1}.nome_da_classe{font-family:Cinzel,serif;font-size:1.1rem;font-weight:700;color:var(--cor_texto_titulo);margin-bottom:6px}.cartao_de_classe.classe_ativa .nome_da_classe{color:var(--cor_dourado)}.descricao_da_classe{font-size:.78rem;color:var(--cor_texto_secundario);line-height:1.4;margin-bottom:12px}.lista_de_atributos{list-style:none;display:flex;flex-direction:column;gap:6px}.item_de_atributo{display:flex;align-items:center;gap:8px;font-size:.8rem}.icone_atributo{font-size:.7rem;width:16px;text-align:center}.rotulo_atributo{width:28px;font-weight:600;color:var(--cor_texto_secundario);font-size:.7rem}.barra_de_atributo{flex:1;height:6px;background:#ffffff14;border-radius:3px;overflow:hidden}.preenchimento_barra{height:100%;border-radius:3px;transition:width .5s ease}.preenchimento_hp{background:linear-gradient(90deg,var(--cor_hp),#f87171)}.preenchimento_mp{background:linear-gradient(90deg,var(--cor_mp),#60a5fa)}.preenchimento_for{background:linear-gradient(90deg,var(--cor_for),#fb923c)}.preenchimento_int{background:linear-gradient(90deg,var(--cor_int),#c084fc)}.preenchimento_agi{background:linear-gradient(90deg,var(--cor_agi),#4ade80)}.valor_atributo{width:28px;text-align:right;font-weight:600;font-size:.75rem;color:var(--cor_texto_principal)}.moldura_do_personagem{background:var(--cor_fundo_painel);border:2px solid var(--cor_borda_padrao);border-radius:16px;padding:24px;text-align:center;width:100%}.nome_classe_selecionada{font-family:Cinzel,serif;font-size:1rem;color:var(--cor_dourado);margin-bottom:16px;letter-spacing:1px}.molde_do_sprite{width:200px;height:200px;margin:0 auto;border-radius:12px;background:radial-gradient(circle,rgba(245,158,11,.05) 0%,transparent 70%);border:1px solid rgba(245,158,11,.15);overflow:hidden}.dica_de_selecao{margin-top:16px;font-size:.85rem;color:var(--cor_texto_secundario);font-style:italic}.caixa_de_formulario{display:flex;flex-direction:column;gap:20px;height:100%}.grupo_do_campo{position:relative}.etiqueta_do_campo{display:block;font-size:.85rem;font-weight:600;color:var(--cor_texto_secundario);margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.entrada_de_texto{width:100%;padding:12px 16px;background:var(--cor_fundo_cartao);border:2px solid var(--cor_borda_padrao);border-radius:10px;color:var(--cor_texto_principal);font-family:Inter,sans-serif;font-size:1rem;outline:none;transition:border-color .3s ease,box-shadow .3s ease}.entrada_de_texto::placeholder{color:#94a3b880}.entrada_de_texto:focus{border-color:var(--cor_dourado);box-shadow:0 0 0 3px #f59e0b26}.contador_de_caracteres{position:absolute;right:12px;bottom:-20px;font-size:.7rem;color:var(--cor_texto_secundario)}.resumo_da_selecao{background:var(--cor_fundo_cartao);border-radius:10px;padding:16px;border:1px solid var(--cor_borda_padrao)}.texto_resumo{font-size:.85rem;color:var(--cor_texto_secundario);margin-bottom:6px}.texto_resumo:last-child{margin-bottom:0}.texto_resumo strong{color:var(--cor_texto_principal)}.mensagem_de_erro{color:var(--cor_erro);font-size:.85rem;padding:10px;background:#ef44441a;border-radius:8px;border:1px solid rgba(239,68,68,.3)}.mensagem_de_sucesso{color:var(--cor_sucesso);font-size:.85rem;padding:10px;background:#22c55e1a;border-radius:8px;border:1px solid rgba(34,197,94,.3)}.botao_de_confirmacao{width:100%;padding:14px 24px;background:linear-gradient(135deg,var(--cor_botao),var(--cor_botao_hover));border:none;border-radius:10px;color:#0a0e17;font-family:Cinzel,serif;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;letter-spacing:.5px;margin-top:auto}.botao_de_confirmacao:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #f59e0b66}.botao_de_confirmacao:active:not(:disabled){transform:translateY(0)}.botao_de_confirmacao:disabled{background:var(--cor_botao_desabilitado);color:var(--cor_texto_secundario);cursor:not-allowed;box-shadow:none}.painel_rpg{background:#1e1b18;border:4px solid #5c4a32;padding:16px;box-shadow:-4px -4px #3b2d1e,4px -4px #3b2d1e,-4px 4px #3b2d1e,4px 4px #3b2d1e,-2px -2px #8b7355,2px -2px #8b7355,-2px 2px #8b7355,2px 2px #8b7355,0 0 0 2px #2a1f14,inset 0 0 0 2px #8b735526;color:#d4c5a9;font-family:Inter,sans-serif;max-height:90vh;display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden}.painel_rpg_header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:8px;border-bottom:2px solid #5c4a32;flex-shrink:0}.painel_rpg_corpo{overflow-y:auto;overflow-x:hidden;flex:1;min-height:0;padding-right:4px}.painel_rpg_corpo::-webkit-scrollbar{width:6px}.painel_rpg_corpo::-webkit-scrollbar-thumb{background:#5c4a32;border-radius:3px}.painel_rpg_header h3{margin:0!important;font-size:.68rem!important}.painel_rpg_fechar{background:none!important;border:none!important;color:#8b7355;font-size:1.2rem!important;cursor:pointer;padding:0 4px!important;box-shadow:none!important;line-height:1}.painel_rpg_fechar:hover{color:#f0c060}.painel_rpg_botoes{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;flex-shrink:0}.painel_rpg .rpg_btn_confirmar{background:#4a7c3f;border-color:#6ba85a;color:#e0f0d0}.painel_rpg .rpg_btn_confirmar:hover{background:#5a9c4f;border-color:#8cc87a;color:#fff}.painel_rpg .rpg_btn_confirmar:disabled{opacity:.4;cursor:not-allowed}.painel_rpg .rpg_btn_cancelar{background:#5c3a3a;border-color:#8b5555;color:#f0d0d0}.painel_rpg .rpg_btn_cancelar:hover{background:#7c4a4a;border-color:#ab7575;color:#fff}.modal_overlay{position:fixed;inset:0;background:#000000bf;display:flex;justify-content:center;align-items:center;z-index:2000;padding:16px;box-sizing:border-box}.painel_rpg label{display:block;margin-top:10px;margin-bottom:4px}.painel_rpg label:first-of-type{margin-top:0}.painel_rpg input[type=text],.painel_rpg input[type=number],.painel_rpg input[type=file],.painel_rpg select{width:100%;box-sizing:border-box}.painel_rpg h1,.painel_rpg h2,.painel_rpg h3,.painel_rpg h4{font-family:"Press Start 2P",monospace;color:#f0c060;text-shadow:2px 2px 0 #3b2d1e;letter-spacing:1px;line-height:1.8;font-size:.72rem;text-transform:uppercase;image-rendering:pixelated}.painel_rpg label{font-family:"Press Start 2P",monospace;font-size:.55rem;color:#c4a96a;text-transform:uppercase;letter-spacing:.5px}.painel_rpg input,.painel_rpg select,.painel_rpg textarea{background:#0d0b08;border:2px solid #5c4a32;color:#f0e0c0;padding:10px 12px;font-family:"Press Start 2P",monospace;font-size:.55rem;outline:none}.painel_rpg input:focus,.painel_rpg select:focus{border-color:#f0c060;box-shadow:inset 0 0 8px #f0c06026}.painel_rpg button{font-family:"Press Start 2P",monospace;font-size:.58rem;padding:12px 18px;cursor:pointer;background:#5c4a32;color:#f0e0c0;border:2px solid #8b7355;box-shadow:-2px -2px #3b2d1e,2px -2px #3b2d1e,-2px 2px #3b2d1e,2px 2px #3b2d1e;text-transform:uppercase;transition:background .1s;image-rendering:pixelated}.painel_rpg button:hover{background:#8b7355;color:#fff;border-color:#f0c060}.painel_rpg button:active{transform:translate(1px,1px);box-shadow:none}@media(max-width:900px){.container_de_criacao{grid-template-columns:1fr;grid-template-rows:auto auto auto}.painel_de_classes,.painel_de_confirmacao{max-height:none}.grade_de_cartoes{flex-direction:row;overflow-x:auto;padding-bottom:8px}.cartao_de_classe{min-width:240px}}
