/* ===== css/layout.css ===== */
/* Grade principal da tela (.dashboard): 2 colunas com os cards. */

.dashboard{

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 20px;

    padding: 20px;

}

/* ===== css/cards.css ===== */
/* Card genérico (.card) e a área de informações do personagem. */

.card{
    background: #ffffff;
    border-radius: 12px;
    padding: 20px;
    border: 1px solid #d5dcee;
    min-height: 250px;
    box-shadow: 0px 5px 10px rgba(0,0,0,.25);
}

.character-info{
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.avatar{
    width: 120px;
    height: 120px;
    border-radius: 10px;
    overflow: hidden;
    border: 2px solid #c5cde4;
    flex-shrink: 0;
}

.avatar img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.details{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}
.details p{
    font-size: clamp(12px,1.1vw,15px);
}

.status{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.progress{
    width: 100%;
    height: 18px;
    background: #e6ebf6;
    border-radius: 10px;
    overflow: hidden;
}

.bar{
    height: 100%;
}

.hp{
    background: #2ecc71;
}

.energy{
    background: #3498db;
}

.xp{
    background: #f1c40f;
}


.card-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.inventory-form{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 20px;
}

.inventory-form input,
.inventory-form textarea{
    background: #f1f4fb;
    color: white;
    border: 1px solid #c5cde4;
    border-radius: 8px;
    padding: 10px;
}
.inventory-form input,
.inventory-form textarea,
#searchItem{
    width: 100%;
    background: #f1f4fb;
    color: #26304f;
    border: 1px solid #c5cde4;
    border-radius: 8px;
    padding: 12px;
    outline: none;
    transition: .2s;
}
#searchItem{
    margin-top: 15px;
    margin-bottom: 20px;
}

.inventory-form input:focus,
.inventory-form textarea:focus,
#searchItem:focus{
    border-color: #4caf50;
    box-shadow: 0 0 8px rgba(76,175,80,.35);
}

.inventory-form input::placeholder,
.inventory-form textarea::placeholder,
#searchItem::placeholder{
    color: #5f6a92;
}
.inventory-form button{
    margin-top: 8px;
    padding: 14px;
    font-size: 15px;
    font-weight: bold;
    transition: .25s;
}

.card-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    padding-bottom: 12px;
    border-bottom: 1px solid #dde3f2;
}
#inventoryCount{
    background: #f1f4fb;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 14px;
    border: 1px solid #c5cde4;
}
.inventory-form{
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
    padding: 18px;
    background: #f1f4fb;
    border-radius: 10px;
    border: 1px solid #d5dcee;
}

.inventory-form textarea{
    resize: vertical;
    min-height: 70px;
}

.inventory-form button{
    padding: 12px;
    border: none;
    border-radius: 8px;
    background: #4CAF50;
    color: white;
    cursor: pointer;
    font-weight: bold;
}

.inventory-form button:hover{
    background: #43A047;
}

.inventory-card{
    background: #f1f4fb;
    border: 1px solid #d5dcee;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 10px;
}

.inventory-card h3{
    margin-bottom: 8px;
}

.inventory-footer{
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 10px;

}

.inventory-footer button{
    border: none;
    border-radius: 6px;
    padding: 8px 12px;
    cursor: pointer;
}

.edit-btn{
    background: #2196F3;
    color: white;
}

.delete-btn{
    background: #d32f2f;
    color: white;
}


/* RESPONSIVIDADES */

@media (max-width:768px){

}
.empty-list{
    padding: 30px;
    text-align: center;
    color: #5f6a92;
    border: 2px dashed #d5dcee;
    border-radius: 10px;
    margin-top: 15px;
}

/* ===== css/style.css ===== */
/* Base: zera margens e define o fundo/fonte do corpo da página (as cores finais vêm de tema-claro/escuro). */

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    background: #eef2fb;
    color: white;
    font-family: Arial, Helvetica, sans-serif;
}

header{
    background: #eef2fb;
    padding: 20px;
    text-align: center;
    border-bottom: 1px solid #dde3f2;
}

h1{
    font-size: clamp(24px,4vw,36px);
}

h2{
    font-size: clamp(18px,2vw,26px);
}
.roll-result { margin-top: 16px; text-align: center; }
.dice-row { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin: 8px 0; }
.die {
    width: 36px; height: 36px; border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    font-weight: bold; border: 2px solid #888;
}
.die.hit  { background: #2e7d32; color: #fff; border-color: #1b5e20; }
.die.miss { background: #eee; color: #6a7396; }
.roll-hits { font-weight: bold; }


/* ===== css/sheet.css ===== */
/* Card de Atributos/Skills/Social do treinador, seletor de rank e rolagens. */

/* Card de atributos ocupa a largura toda */

.atributos {

    grid-column: 1 / -1;

}

/* Seletor de ranking */

.rank-select {

    display: flex;
    align-items: center;
    gap: 8px;

    font-size: 14px;
    color: #56608a;

}

.rank-select select {

    background: #f1f4fb;
    color: #26304f;

    border: 1px solid #c5cde4;
    border-radius: 8px;

    padding: 8px 10px;

}

/* Painel de rolagem (fica visível ao rolar a página) */

.roll-panel {

    position: sticky;
    top: 0;
    z-index: 5;

    max-height: 45vh;
    overflow: auto;

    margin: 12px 0 18px;
    padding: 12px;

    background: #ffffff;
    border: 1px solid #d5dcee;
    border-radius: 10px;

}

.combined-summary {

    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;

    min-height: 28px;

    font-size: 14px;
    color: #56608a;

}

.chip {

    background: #f1f4fb;
    border: 1px solid #c5cde4;
    border-radius: 16px;

    padding: 3px 10px;

    font-size: 13px;
    color: #26304f;

}

.chip b {

    margin-left: 6px;
    color: #1b8a4a;

}

.combined-total {

    margin-left: 6px;
    color: #26304f;

}

.combined-controls {

    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;

    margin-top: 10px;
    padding-bottom: 12px;

    border-bottom: 1px solid #dde3f2;

}

.combined-controls label {

    display: flex;
    align-items: center;
    gap: 6px;

    font-size: 13px;
    color: #56608a;

}

.combined-controls input {

    width: 64px;

    background: #f1f4fb;
    color: #26304f;

    border: 1px solid #c5cde4;
    border-radius: 8px;

    padding: 8px;

}

.combined-controls button {

    padding: 8px 14px;

    border: none;
    border-radius: 8px;

    background: #4CAF50;
    color: #fff;

    font-weight: bold;
    cursor: pointer;

}

.combined-controls button#clearSelection {

    background: #e6ebf6;

}

.combined-controls button:disabled {

    opacity: .4;
    cursor: not-allowed;

}

/* Resultado da rolagem */

.roll-result {

    min-height: 70px;

    margin-top: 12px;

    text-align: center;

}

.roll-result:empty::before {

    content: "Clique em 🎲 ou marque itens para rolar";

    color: #6a7396;
    line-height: 70px;

}

/* Grupos: Atributos | Skills | Social */

.sheet-groups {

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    align-items: start;

}

.sheet-group {

    background: #f1f4fb;
    border: 1px solid #d5dcee;
    border-radius: 10px;
    overflow: hidden;

}

/* Pontos para distribuir */

.pool {

    display: flex;
    flex-direction: column;
    gap: 4px;

    padding: 8px 12px;

    background: #f1f4fb;

    font-size: 13px;

}

.pool-main {

    display: flex;
    justify-content: space-between;
    align-items: center;

}

.pool-main strong {

    font-size: 18px;
    color: #1b8a4a;

}

.pool.over .pool-main strong {

    color: #c62828;

}

.pool-detail {

    display: flex;
    justify-content: space-between;
    align-items: center;

    font-size: 12px;
    color: #5f6a92;

}

.bonus-controls {

    display: flex;
    gap: 4px;

}

.bonus-controls button {

    width: 22px;
    height: 22px;

    border: none;
    border-radius: 5px;

    background: #e6ebf6;
    color: #26304f;

    cursor: pointer;

}

.bonus-controls button:hover:not(:disabled) {

    background: #4CAF50;

}

.bonus-controls button:disabled {

    opacity: .35;
    cursor: not-allowed;

}

/* Tabela */

.sheet-table {

    width: 100%;
    border-collapse: collapse;

}

.sheet-table th {

    text-align: left;
    padding: 8px 12px;

    font-size: 13px;
    color: #5f6a92;

    border-bottom: 1px solid #d5dcee;

}

.sheet-table th:nth-child(2) {

    text-align: center;

}

.sheet-table td {

    padding: 6px 12px;
    border-bottom: 1px solid #d5dcee;

}

.sheet-table tbody tr:last-child td {

    border-bottom: none;

}

.sheet-table tbody tr:hover {

    background: #f1f4fb;

}

.sheet-table tbody tr.selected {

    background: #f1f4fb;

}

.stat-name label {

    display: flex;
    align-items: center;
    gap: 8px;

    cursor: pointer;

}

.stat-name input[type="checkbox"] {

    accent-color: #4CAF50;

}

.stat-value {

    width: 50px;

    text-align: center;
    font-weight: bold;
    font-size: 16px;

}

.stat-actions {

    display: flex;
    gap: 4px;
    justify-content: flex-end;

}

.stat-actions button {

    width: 28px;
    height: 28px;

    border: none;
    border-radius: 6px;

    background: #e6ebf6;
    color: #26304f;

    cursor: pointer;
    transition: .2s;

}

.stat-actions button:hover:not(:disabled) {

    background: #4CAF50;

}

.stat-actions button:disabled {

    opacity: .35;
    cursor: not-allowed;

}

/* Diário */

.diary-hint {

    font-size: 12px;
    color: #6a7396;

}

.diario textarea {

    width: 100%;
    min-height: 220px;

    resize: vertical;

    background: #f1f4fb;
    color: #26304f;

    border: 1px solid #c5cde4;
    border-radius: 8px;

    padding: 12px;

    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;

    outline: none;
    transition: .2s;

}

.diario textarea:focus {

    border-color: #4caf50;
    box-shadow: 0 0 8px rgba(76, 175, 80, .35);

}

.diario textarea::placeholder {

    color: #5f6a92;

}

/* Responsivo */

@media (max-width: 900px) {

    .sheet-groups {

        grid-template-columns: 1fr;

    }

}


/* ===== css/pokemon.css ===== */
/* Equipe, Pokémon capturados e avistados (listas, busca, contadores). */

/* Equipe ocupa a largura toda (6 slots) */

.equipe {

    grid-column: 1 / -1;

}

/* Contadores dos cabeçalhos */

.counter {

    background: #f1f4fb;

    padding: 6px 12px;

    border-radius: 20px;

    font-size: 14px;

    border: 1px solid #c5cde4;

}

/* Campo de adicionar (avistados e capturados) */

.pokemon-add {

    display: flex;
    gap: 10px;

    margin: 15px 0;

}

.pokemon-add input {

    flex: 1;
    min-width: 0;

    background: #f1f4fb;
    color: #26304f;

    border: 1px solid #c5cde4;
    border-radius: 8px;

    padding: 12px;

    outline: none;
    transition: .2s;

}

.pokemon-add input:focus {

    border-color: #4caf50;
    box-shadow: 0 0 8px rgba(76, 175, 80, .35);

}

.pokemon-add input::placeholder {

    color: #5f6a92;

}

.pokemon-add button {

    padding: 0 16px;

    border: none;
    border-radius: 8px;

    background: #4CAF50;
    color: #fff;

    font-weight: bold;
    cursor: pointer;

}

.pokemon-add button:hover {

    background: #43A047;

}

/* Lista de capturados */

#caughtList {

    max-height: 420px;
    overflow-y: auto;

}

.pokemon-item {

    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;

    background: #f1f4fb;
    border: 1px solid #d5dcee;
    border-radius: 10px;

    padding: 10px 12px;
    margin-bottom: 8px;

}

.pokemon-item.in-team {

    border-color: #4caf50;

}

.pokemon-name {

    font-weight: bold;

}

.pokemon-actions {

    display: flex;
    gap: 6px;

}

.pokemon-actions button,
.team-slot button {

    border: none;
    border-radius: 6px;

    padding: 7px 10px;

    color: #26304f;
    font-size: 13px;

    cursor: pointer;

}

.team-btn {

    background: #2196F3;

}

.remove-btn {

    background: #d32f2f;

}

.pokemon-actions button:disabled {

    opacity: .4;
    cursor: not-allowed;

}

/* Equipe (6 slots) */

.team-grid {

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;

}

.team-slot {

    min-height: 90px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;

    background: #f1f4fb;
    border: 1px solid #d5dcee;
    border-radius: 10px;

    padding: 12px;

    text-align: center;

}

.team-slot.empty {

    background: transparent;
    border-style: dashed;

    color: #6a7396;

}

/* Avistados */

.seen-details summary {

    cursor: pointer;
    color: #56608a;

    margin-bottom: 12px;

}

.seen-chip {

    display: inline-flex;
    align-items: center;
    gap: 6px;

    background: #f1f4fb;
    border: 1px solid #c5cde4;
    border-radius: 16px;

    padding: 4px 10px;
    margin: 0 6px 6px 0;

    font-size: 13px;

}

.seen-chip button {

    background: none;
    border: none;

    color: #5f6a92;
    font-size: 16px;
    line-height: 1;

    cursor: pointer;

}

.seen-chip button:hover {

    color: #c62828;

}

.empty-hint {

    color: #6a7396;
    font-size: 13px;

}

/* Responsivo */

@media (max-width: 600px) {

    .team-grid {

        grid-template-columns: repeat(2, 1fr);

    }

}


/* ===== css/pokemonSheet.css ===== */
/* Ficha individual do Pokémon (abas, atributos, golpes, efeitos, rolagens). */

[hidden] { display: none !important; }

.pokemon-sheet { padding: 20px; }
.pk { display: flex; flex-direction: column; gap: 16px; max-width: 1100px; margin: 0 auto; }

.pk input, .pk select, .pk textarea {
    background: #f1f4fb; color: #26304f; border: 1px solid #c5cde4; border-radius: 6px;
    padding: 7px; font-family: inherit; font-size: 14px; min-width: 0;
}
.pk textarea { width: 100%; min-height: 70px; resize: vertical; }
.pk label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #5f6a92; }
.pk button {
    border: none; border-radius: 6px; background: #e6ebf6; color: #26304f; cursor: pointer; padding: 5px 10px; font-family: inherit;
}
.pk button:hover:not(:disabled) { background: #4CAF50; }
.pk button:disabled { opacity: .4; cursor: not-allowed; }
.pk-back { align-self: flex-start; padding: 10px 16px !important; }

/* Cabeçalho com as cores da tipagem */
.pk-hero {
    display: grid; grid-template-columns: 140px 1fr minmax(220px, 300px); gap: 20px; align-items: center;
    padding: 20px; border-radius: 16px; border: 1px solid color-mix(in srgb, var(--c1) 60%, #dde3f2);
    background: linear-gradient(135deg, color-mix(in srgb, var(--c1) 45%, #ffffff), color-mix(in srgb, var(--c2) 30%, #ffffff));
}
.pk-photo {
    width: 140px; height: 140px; border-radius: 16px; background: rgba(38,48,79,.07);
    border: 2px dashed rgba(38,48,79,.3); display: flex !important; align-items: center; justify-content: center;
    cursor: pointer; overflow: hidden; text-align: center; font-size: 34px !important; color: #26304f !important;
}
.pk-photo img { width: 100%; height: 100%; object-fit: contain; }
.pk-photo small { display: block; font-size: 12px; color: #56608a; }
.pk-id h2 { font-size: 26px; margin-bottom: 6px; }
.pk-id h2 small { opacity: .6; font-size: 16px; }
.pk-types { margin: 8px 0; }
.pk-badge {
    display: inline-block; background: var(--tc); color: #111; font-weight: bold; font-size: 12px;
    padding: 3px 10px; border-radius: 12px; margin: 2px 4px 2px 0;
}
.pk-meta { display: flex; flex-wrap: wrap; gap: 8px; }

/* HP e penalidade de dor */
.pk-hp { display: flex; flex-direction: column; gap: 8px; --hp: #2ecc71; }
.pk-hero[data-state="half"] .pk-hp { --hp: #f1c40f; }
.pk-hero[data-state="low"] .pk-hp { --hp: #e74c3c; }
.pk-hero[data-state="ko"] .pk-hp { --hp: #888; }
.pk-hp-top { display: flex; justify-content: space-between; align-items: center; font-size: 22px; }
.pk-hp-top button { margin-left: 4px; }
.pk-bar { position: relative; height: 18px; background: rgba(38,48,79,.07); border-radius: 10px; overflow: hidden; }
.pk-bar i { position: absolute; inset: 0 auto 0 0; background: var(--hp); border-radius: 10px; transition: width .3s, background .3s; }
.pk-bar::after { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; background: rgba(38,48,79,.5); }
.pk-hero[data-state="low"] .pk-bar i { animation: pkPulse 1s infinite; }
@keyframes pkPulse { 50% { opacity: .45; } }
.pk-hp-msg { font-size: 13px; font-weight: bold; color: var(--hp); }

/* Rolagem combinada (reaproveita as classes da ficha do treinador) */
.pk .combined-controls button { background: #4CAF50; padding: 8px 14px; font-weight: bold; }
.pk .combined-controls .pk-gray { background: #e6ebf6; }
.pk .combined-controls button:disabled { opacity: .4; }

/* Abas */
.pk-tabs { display: flex; gap: 6px; border-bottom: 1px solid #d5dcee; }
.pk-tabs button { background: none; color: #5f6a92; padding: 10px 16px; border-bottom: 3px solid transparent; border-radius: 0; font-size: 15px; }
.pk-tabs button:hover:not(:disabled) { background: #f1f4fb; }
.pk-tabs button.on { color: #26304f; border-color: var(--c1); }
.pk-panel { display: flex; flex-direction: column; gap: 16px; }

/* Resumo */
.pk-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; }
.pk-tile {
    display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px;
    background: #f1f4fb; border: 1px solid #d5dcee; border-top: 3px solid var(--c1); border-radius: 12px;
}
.pk-tile small { color: #5f6a92; }
.pk-tile b { font-size: 26px; }
.pk-box { background: #ffffff; border: 1px solid #d5dcee; border-radius: 12px; padding: 14px; }
.pk-box h3 { font-size: 13px; color: #5f6a92; margin-bottom: 10px; font-weight: normal; text-transform: uppercase; }
.pk-box summary { cursor: pointer; color: #56608a; }
.pk-box details button { margin-top: 6px; }
.pk-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pk-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 12px 0; }
.pk .pk-chk { flex-direction: row; align-items: center; }
.pk-mu { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-bottom: 6px; font-size: 13px; }
.pk-mu > span:first-child { width: 90px; color: #5f6a92; }
.pk-status { display: flex; flex-wrap: wrap; gap: 6px; }
.pk .pk-status .chip { border-radius: 16px; }
.pk .pk-status .chip.on { background: #ffe3e3; border: 1px solid #e04848; }
.pk-ok { color: #1b8a4a; font-weight: bold; align-self: center; }

/* Atributos */
.pk-pools { display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: center; }
.pk-pools b { margin: 0 6px; font-size: 18px; }
.pk-left b { color: #1b8a4a; }
.pk-tables { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 16px; }
.pk-table input[type="number"] { width: 46px; padding: 4px; text-align: center; }
.pk-table td { padding: 4px 6px; }
.pk-total { font-weight: bold; font-size: 16px; text-align: center; }
.pk .pk-name label { flex-direction: row; align-items: center; gap: 6px; color: #26304f; font-size: 14px; }

/* Golpes */
.pk-addmove { display: flex; gap: 8px; align-items: center; }
.pk-addmove input { flex: 1; }
.pk-addmove button { padding: 9px 16px; background: #4CAF50; font-weight: bold; }
.pk-move {
    display: flex; flex-direction: column; gap: 8px; padding: 12px; background: #f1f4fb;
    border: 1px solid #d5dcee; border-left: 6px solid var(--tc); border-radius: 12px;
}
.pk-move header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; }
.pk-move header b { font-size: 17px; }
.pk-move header button { margin-left: auto; }
.pk-fx { font-size: 13px; color: #e0c97a; }
.pk-rolls { display: flex; flex-wrap: wrap; gap: 8px; }
.pk-rolls button { flex: 1; min-width: 130px; padding: 10px; font-size: 15px; }
.pk-move summary { cursor: pointer; color: #5f6a92; font-size: 13px; }
.pk-notes { min-height: 300px !important; }

@media (max-width: 800px) {
    .pk-hero { grid-template-columns: 1fr; justify-items: stretch; }
    .pk-photo { margin: 0 auto; }
    .pk-tables { grid-template-columns: 1fr; }
    .pk-two { grid-template-columns: 1fr; }
}

/* Pontos por grupo (atributos / skills / social) */
.pk-poolbar { background: #ffffff; border: 1px solid #d5dcee; border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; }
.pk-poolbar.over { border-color: #e04848; }
.pk-poolmain { display: flex; justify-content: space-between; align-items: center; }
.pk-poolmain strong { font-size: 24px; color: #1b8a4a; }
.pk-poolbar.over .pk-poolmain strong { color: #c62828; }
.pk-pooldetail { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 6px; font-size: 13px; color: #5f6a92; align-items: center; }
.pk-pooldetail b { margin: 0 6px; color: #26304f; }
.pk-table tr.over-limit .pk-total { color: #c62828; font-weight: bold; }

/* Explicação de habilidade / item */
.pk-box .pk-two + .pk-two { margin-top: 10px; }
.pk-info { background: #ffffff; border-left: 3px solid #4caf50; border-radius: 6px; padding: 8px 10px; font-size: 13px; line-height: 1.4; color: #3a4468; }
.pk-info small { display: block; color: #8a8a8a; margin: 2px 0 4px; }
.pk-info p { margin: 4px 0 0; }
.pk-info-desc { color: #5f6a92; font-style: italic; }
.pk-info-empty { color: #6a7396; }
.pk-custom { margin-left: 8px; font-size: 11px; background: #4CAF50; color: #fff; padding: 1px 6px; border-radius: 8px; }

/* Catálogo do mestre */
.pk-catalog textarea { width: 100%; min-height: 70px; margin: 8px 0; }
.pk-catlist { margin-top: 10px; font-size: 13px; color: #56608a; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.pk-catlist .chip button { margin: 0 0 0 4px; padding: 0 5px; }

/* Efeitos de habilidade / item */
.pk-fxlist { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.pk-fxchip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 16px; font-size: 12px; cursor: pointer; background: #f1f4fb; border: 1px solid #c5cde4; color: #3a4468; }
.pk-fxchip.ability { border-color: #8e5be8; }
.pk-fxchip.item { border-color: #26c6da; }
.pk-fxchip:has(input:checked) { background: #3b2d5a; border-color: #b388ff; color: #26304f; }
.pk-fxchip.item:has(input:checked) { background: #1d4a52; border-color: #4dd0e1; }
.pk-fxchip b { color: #9a6a00; }
.pk-fxchip small { color: #5f6a92; }
.pk-fxsec { margin: 10px 0; padding-top: 10px; border-top: 1px solid #dde3f2; display: flex; flex-direction: column; gap: 6px; }
.pk-fxrow { display: flex; align-items: center; gap: 8px; font-size: 13px; background: #ffffff; padding: 5px 8px; border-radius: 6px; }
.pk-fxrow small { flex: 1; color: #5f6a92; }
.pk-fxrow button { background: #d32f2f; color: #fff; border: none; border-radius: 50%; width: 22px; height: 22px; cursor: pointer; }
.pk-fxform { margin-top: 6px; }
.pk-hint { color: #5f6a92; font-size: 13px; margin: 8px 0; }

/* Habilidade e item no topo da ficha */
.pk-traits { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pk-trait { background: rgba(38,48,79,.07); border-radius: 12px; padding: 10px 12px; border-left: 4px solid #8e5be8; }
.pk-trait.item { border-left-color: #26c6da; }
.pk-trait label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #3a4468; }
.pk-trait .pk-info { margin-top: 8px; background: rgba(38,48,79,.07); cursor: pointer;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pk-trait .pk-info.open { display: block; }
@media (max-width: 800px) { .pk-traits { grid-template-columns: 1fr; } }

/* Tabela / estágio de crítico */
.pk-critbar { background: #ffffff; border: 1px solid #d5dcee; border-radius: 10px; padding: 10px 14px; margin-bottom: 12px; display: flex; flex-direction: column; gap: 8px; }
.pk-critbar b { margin: 0 8px; font-size: 18px; color: #9a6a00; }
.pk-critbar small { color: #5f6a92; margin-left: 8px; }
.pk-cttable { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; margin: 10px 0; }
.pk-ctrow { display: flex; justify-content: space-between; align-items: center; background: #ffffff; padding: 6px 10px; border-radius: 8px; font-size: 13px; }
.pk-ctrow input { width: 64px; text-align: center; }

/* ---------- Efeitos de status ---------- */
.sfx-panel { margin-top: 10px; display: grid; gap: 6px; }
.sfx-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 6px 10px; border-radius: 8px; background: #3a2222; border-left: 3px solid #e04848; font-size: 13px; }
.sfx-row > span { flex: 1 1 160px; opacity: .9; }
.sfx-row button, .sfx-row select { font-size: 12px; padding: 3px 8px; }
.sfx-imm { font-size: 12px; opacity: .7; }
.sfx-blocked { margin: 4px 0; padding: 4px 8px; border-radius: 6px; background: #ffe3e3; color: #c62828; font-size: 13px; }
.chip.imm { opacity: .5; text-decoration: line-through; }
.chip.imm.on { text-decoration: none; }

/* ---------- Dano recebido / chance ---------- */
.calc-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.calc-row input[type=number] { width: 80px; }
.calc-row select, .calc-row button { font-size: 13px; padding: 4px 8px; }
.calc-row label { font-size: 12px; opacity: .85; display: flex; align-items: center; gap: 4px; }


/* ===== css/customDice.css ===== */
/* Dado personalizado flutuante */

.cd-toggle {
    position: fixed; right: 18px; bottom: 18px; z-index: 50;
    width: 56px; height: 56px; border: none; border-radius: 50%;
    background: #4CAF50; color: #fff; font-size: 26px; cursor: pointer;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .5); transition: transform .2s;
}
.cd-toggle:hover { transform: scale(1.08); }

.cd-panel {
    position: fixed; right: 18px; bottom: 86px; z-index: 50;
    width: min(340px, calc(100vw - 36px)); max-height: calc(100vh - 110px); overflow-y: auto;
    display: flex; flex-direction: column; gap: 10px; padding: 14px;
    background: #ffffff; border: 1px solid #c5cde4; border-radius: 14px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .6); color: #26304f; font-size: 14px;
}
.cd-panel[hidden] { display: none; }
.cd-panel header { display: flex; justify-content: space-between; align-items: center; font-size: 16px; }
.cd-panel header button { background: none; border: none; color: #5f6a92; font-size: 22px; cursor: pointer; }

.cd-quick { display: flex; flex-wrap: wrap; gap: 6px; }
.cd-quick button {
    flex: 1; min-width: 42px; padding: 7px 4px; border: none; border-radius: 6px;
    background: #e6ebf6; color: #26304f; cursor: pointer;
}
.cd-quick button:hover { background: #4CAF50; }

.cd-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.cd-panel label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #5f6a92; }
.cd-panel input[type="number"], .cd-panel select {
    background: #f1f4fb; color: #26304f; border: 1px solid #c5cde4; border-radius: 6px;
    padding: 7px; font-size: 14px; min-width: 0; width: 100%;
}
.cd-panel .cd-check { flex-direction: row; align-items: center; gap: 8px; color: #3a4468; }
.cd-panel .cd-check[hidden] { display: none; }

.cd-roll {
    padding: 11px; border: none; border-radius: 8px; background: #4CAF50;
    color: #fff; font-size: 16px; font-weight: bold; cursor: pointer;
}
.cd-roll:hover { background: #43A047; }

.cd-result { text-align: center; min-height: 20px; }
.cd-expr { color: #5f6a92; margin-bottom: 4px; }
.cd-total { font-size: 15px; }
.cd-total b { font-size: 28px; color: #1b8a4a; }
.cd-total small { color: #6a7396; }
.die.cd-neutral { background: #e6ebf6; color: #26304f; border-color: #666; }

.cd-history { font-size: 12px; color: #6a7396; border-top: 1px solid #dde3f2; padding-top: 8px; display: flex; flex-direction: column; gap: 2px; }
.cd-history:empty { display: none; }


/* ===== css/profile.css ===== */
/* Visual mais vivo + perfil do treinador + conquistas */

:root {
    --red: #ee4b4b; --yellow: #ffcb05; --blue: #3b6fe0; --green: #4CAF50; --purple: #8e5be8;
}

body { background: radial-gradient(circle at 15% 0%, #ffe9ec 0, #eef2fb 45%) fixed, #eef2fb; }

body > header {
    background: linear-gradient(135deg, #b71c1c 0%, #ee4b4b 45%, #ff8a50 100%);
    border-bottom: 4px solid var(--yellow);
    position: relative; overflow: hidden;
}
body > header h1 { text-shadow: 0 2px 6px rgba(0, 0, 0, .45); letter-spacing: 1px; }
body > header h1::before { content: "⚡ "; color: var(--yellow); }


/* cada seção com sua cor */
.card { border-top: 4px solid var(--accent, #c5cde4); transition: transform .2s, box-shadow .2s; }
.card:hover { box-shadow: 0 8px 20px rgba(0, 0, 0, .4); }
.card h2 { color: var(--accent, #26304f); }
.personagem { --accent: var(--red); background: linear-gradient(160deg, #f1f4fb, #ffffff 55%); }
.conquistas { --accent: var(--yellow); background: linear-gradient(160deg, #f1f4fb, #ffffff 55%); }
.atributos { --accent: var(--blue); }
.inventario { --accent: var(--green); }
.diario { --accent: var(--purple); }
.capturados { --accent: #ff8a50; }
.avistados { --accent: #26c6da; }
.equipe { --accent: #ec407a; }

button { transition: filter .15s, transform .1s; }
button:hover:not(:disabled) { filter: brightness(1.15); }
button:active:not(:disabled) { transform: scale(.96); }

/* Perfil */
.character-info { align-items: flex-start; }
.avatar {
    position: relative; display: flex; align-items: center; justify-content: center;
    width: 230px; height: 340px; cursor: pointer; background: #ffffff;
    border: 3px solid var(--red); border-radius: 16px; box-shadow: 0 0 14px rgba(238, 75, 75, .35);
}
.avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-position: center top; border-radius: 13px; }
.avatar { overflow: hidden; }
.avatar img[hidden] { display: none; }
#avatarEmpty { font-size: 44px; text-align: center; line-height: 1.1; }
#avatarEmpty small { display: block; font-size: 11px; color: #5f6a92; }
.avatar:hover { border-color: var(--yellow); }

.profile-fields { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; align-content: start; }
.profile-fields label, .hp-edit label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: #5f6a92; }
.profile-fields .wide { grid-column: 1 / -1; }
.profile-fields input, .hp-box input[type="number"], .ach input, .ach textarea, #achTitle, #moneyDelta {
    background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 8px; padding: 7px 9px;
    font-size: 14px; min-width: 0; width: 100%; outline: none;
}
.profile-fields input:focus, .hp-box input:focus, .ach input:focus, .ach textarea:focus, #achTitle:focus {
    border-color: var(--yellow); box-shadow: 0 0 8px rgba(255, 203, 5, .3);
}
.money-row { display: flex; gap: 6px; align-items: center; }
.money-row span { color: var(--yellow); font-weight: bold; }
.money-row #moneyDelta { width: 90px; }
.money-row button, .hp-box button, .avatar-tools button {
    border: none; border-radius: 8px; background: #e6ebf6; color: #26304f; cursor: pointer; padding: 6px 11px; font-weight: bold;
}
.avatar-tools { margin-top: 6px; text-align: center; }
.avatar-tools button { font-size: 12px; padding: 4px 10px; }

.hp-box { margin-top: 6px; }
.hp-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; gap: 8px; flex-wrap: wrap; }
.hp-top b { color: #1b8a4a; font-size: 18px; }
.hp-edit { display: flex; align-items: center; gap: 6px; }
.hp-edit input { width: 60px !important; text-align: center; }
.hp-box .progress { height: 22px; border: 1px solid #d5dcee; }
.hp-box .bar { background: linear-gradient(90deg, #27ae60, #2ecc71); transition: width .3s, background .3s; }
#profileCard[data-hp="half"] .bar { background: linear-gradient(90deg, #f39c12, #f1c40f); }
#profileCard[data-hp="low"] .bar, #profileCard[data-hp="ko"] .bar { background: linear-gradient(90deg, #c0392b, #e74c3c); }
#profileCard[data-hp="low"] .hp-top b, #profileCard[data-hp="ko"] .hp-top b { color: #c62828; }
#profileCard[data-hp="half"] .hp-top b { color: #9a6a00; }
#hpMsg { display: block; margin-top: 5px; color: #5f6a92; font-size: 12px; }

/* Conquistas */
.ach-add { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.ach-add #achTitle { flex: 1; min-width: 140px; }
.ach-file { display: inline-flex; align-items: center; padding: 7px 12px; background: #e6ebf6; border-radius: 8px; cursor: pointer; font-size: 13px; white-space: nowrap; }
.ach-file:hover { background: #e6ebf6; }
#achAdd { border: none; border-radius: 8px; background: var(--yellow); color: #222; font-weight: bold; padding: 8px 14px; cursor: pointer; }
#achCount { background: #f1f4fb; border: 1px solid #c5cde4; border-radius: 20px; padding: 6px 12px; font-size: 14px; }

.ach-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 12px; }
.ach {
    position: relative; display: flex; flex-direction: column; gap: 5px; padding: 10px 8px;
    background: #f1f4fb; border: 1px solid #d5dcee; border-radius: 12px; text-align: center;
    transition: transform .2s, border-color .2s, box-shadow .2s;
}
.ach:hover { transform: translateY(-3px); border-color: var(--yellow); box-shadow: 0 6px 14px rgba(255, 203, 5, .18); }
.ach-img {
    width: 72px; height: 72px; margin: 0 auto; border-radius: 50%; overflow: hidden; cursor: pointer;
    display: flex; align-items: center; justify-content: center; font-size: 34px;
    background: #ffffff; border: 2px solid var(--yellow); box-shadow: 0 0 10px rgba(255, 203, 5, .3);
}
.ach-img img { width: 100%; height: 100%; object-fit: cover; }
.ach-name { text-align: center; font-weight: bold; }
.ach-desc { min-height: 44px; font-size: 12px !important; resize: vertical; }
.ach-x { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; border: none; border-radius: 50%; background: #d32f2f; color: #fff; cursor: pointer; opacity: 0; transition: opacity .2s; line-height: 1; }
.ach:hover .ach-x { opacity: 1; }
.conquistas .empty-hint { grid-column: 1 / -1; color: #5f6a92; text-align: center; padding: 24px; border: 2px dashed #d5dcee; border-radius: 10px; }

@media (max-width: 800px) {
    .dashboard { grid-template-columns: 1fr; }
    .character-info { flex-direction: column; align-items: center; }
    .profile-fields { width: 100%; }
}

/* Equipe com fotos */
.equipe { --accent: #ec407a; }
.equipe { min-height: 0; }
.team-grid { grid-template-columns: repeat(6, 1fr) !important; gap: 12px; }
.team-slot { position: relative; padding: 0 !important; justify-content: flex-start !important; gap: 0 !important; overflow: hidden; border-width: 2px; border-color: var(--tc, #d5dcee); min-height: 190px !important; }
.team-slot.empty { justify-content: center !important; border-width: 2px; }
.team-photo { width: 100%; aspect-ratio: 1; background: radial-gradient(circle, color-mix(in srgb, var(--tc, #d9e0f0) 45%, #ffffff), #ffffff); display: flex; align-items: center; justify-content: center; font-size: 40px; cursor: pointer; }
.team-photo img { width: 100%; height: 100%; object-fit: cover; }
.team-info { padding: 8px 6px 4px; display: flex; flex-direction: column; gap: 2px; align-items: center; }
.team-info small { color: #5f6a92; }
.team-slot .team-btn, .team-slot .remove-btn { margin: 3px 6px 8px; width: calc(100% - 12px); }
.team-slot .team-btn { margin-bottom: 0; }
.mini-photo { width: 38px; height: 38px; border-radius: 8px; object-fit: cover; flex-shrink: 0; background: #ffffff; border: 2px solid var(--tc, #c5cde4); display: flex; align-items: center; justify-content: center; font-size: 18px; overflow: hidden; }
.pokemon-item .pokemon-name { display: flex; align-items: center; gap: 10px; flex: 1; }

@media (max-width: 1100px) { .team-grid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 800px) { .avatar { width: 100%; max-width: 260px; } }
@media (max-width: 520px) { .team-grid { grid-template-columns: repeat(2, 1fr) !important; } }

/* Equipe: cards menores (foto preenche o quadro) */
.team-grid { grid-template-columns: repeat(auto-fill, 135px) !important; justify-content: start; gap: 10px; }
.team-slot { min-height: 150px !important; }
.team-photo { aspect-ratio: 1; }
.team-info { padding: 5px 4px 2px; font-size: 13px; }
.team-slot .team-btn, .team-slot .remove-btn { font-size: 11px !important; padding: 5px 6px !important; margin: 3px 5px 5px; width: calc(100% - 10px); }

/* Exportar / importar */
body > header { position: relative; }
.backup-bar { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); display: flex; gap: 8px; }
.backup-bar button { border: 1px solid rgba(255, 255, 255, .5); background: rgba(0, 0, 0, .3); color: #26304f; padding: 8px 12px; border-radius: 8px; cursor: pointer; font-weight: bold; font-size: 13px; }
.backup-bar button:hover { background: rgba(0, 0, 0, .5); }
@media (max-width: 800px) { .backup-bar { position: static; transform: none; justify-content: center; margin-top: 10px; } }

.rank-group { display: flex; gap: 14px; flex-wrap: wrap; }

.team-head { display: flex; align-items: center; gap: 10px; }
.battle-btn { border: none; border-radius: 8px; padding: 8px 14px; background: linear-gradient(135deg, #c62828, #ef5350); color: #fff; font-weight: bold; cursor: pointer; }

/* ---------- Personagens ---------- */
.char-bar { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); display: flex; align-items: center; gap: 6px; }
.char-bar select { max-width: 170px; background: rgba(0, 0, 0, .35); color: #26304f; border: 1px solid rgba(255, 255, 255, .5); border-radius: 8px; padding: 7px 8px; font-weight: bold; }
.char-bar select option { color: #000; }
.char-bar button { border: 1px solid rgba(255, 255, 255, .5); background: rgba(0, 0, 0, .3); color: #26304f; padding: 6px 8px; border-radius: 8px; cursor: pointer; }
.char-bar button:hover:not(:disabled) { background: rgba(0, 0, 0, .5); }
.char-bar button:disabled { opacity: .35; cursor: default; }
@media (max-width: 1100px) {
    .char-bar, .backup-bar { position: static; transform: none; justify-content: center; margin-top: 8px; flex-wrap: wrap; }
}

/* Sininho de lembrete de backup */
.backup-bar button { position: relative; }
.bk-bell { position: absolute; top: -9px; right: -7px; font-size: 16px; line-height: 1; filter: drop-shadow(0 1px 2px rgba(0,0,0,.6)); transform-origin: 50% 0; animation: bkRing 2.6s ease-in-out infinite; pointer-events: none; }
@keyframes bkRing { 0%, 55%, 100% { transform: rotate(0); } 60% { transform: rotate(16deg); } 66% { transform: rotate(-14deg); } 72% { transform: rotate(10deg); } 78% { transform: rotate(-6deg); } 84% { transform: rotate(0); } }
@media (prefers-reduced-motion: reduce) { .bk-bell { animation: none; } }


/* ===== css/battle.css ===== */
/* Ficha de batalha */
.battle-sheet { padding: 20px; max-width: 1400px; margin: 0 auto; }
.battle-sheet[hidden] { display: none; }
.bt-top { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin: 12px 0; padding: 16px 20px; border-radius: 14px;
    background: linear-gradient(135deg, #ffd7d7, #ffe9ec); border: 1px solid #e8a8a8; }
.bt-top h2 { margin: 0; }
.bt-round { font-size: 20px; } .bt-round b { font-size: 34px; color: #9a6a00; margin-left: 6px; }
.bt-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-left: auto; }
.bt-tools button, .bt-add button { border: none; border-radius: 8px; padding: 9px 14px; background: #e6ebf6; color: #26304f; cursor: pointer; font-weight: bold; }
.bt-tools .bt-primary { background: #4CAF50; }
.bt-tools .bt-danger { background: #e05a5a; }
.bt-apr { font-size: 13px; color: #3a4468; display: flex; align-items: center; gap: 6px; }
.bt-apr input { width: 56px; }
.bt-add { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 14px; padding: 10px 14px; background: #ffffff; border: 1px solid #d5dcee; border-radius: 12px; }
.bt-add input { background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 8px; padding: 8px; }
.bt-add input[type="text"] { flex: 1; min-width: 160px; } .bt-add input[type="number"] { width: 70px; }
.bt-add small { color: #6a7396; }

.bt-main { display: grid; grid-template-columns: 1fr 320px; gap: 16px; align-items: start; }
.bt-order { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 14px; }
.bt-log { position: sticky; top: 10px; max-height: calc(100vh - 30px); overflow-y: auto; background: #ffffff; border: 1px solid #d5dcee; border-radius: 12px; padding: 12px; }
.bt-log h3 { margin-bottom: 8px; color: #9a6a00; }
.bt-log-item { padding: 8px 0; border-bottom: 1px solid #dde3f2; font-size: 13px; }
.bt-log-item small { display: block; color: #5f6a92; }
.bt-log-item .dice-row { justify-content: flex-start; margin: 4px 0; }
.bt-log-item .die { width: 26px; height: 26px; font-size: 13px; border-radius: 6px; }
.bt-big { font-size: 17px; color: #9a6a00; }
.bt-crit { color: #9a6a00; font-size: 15px; }

.bt-card { background: #ffffff; border: 2px solid var(--tc, #c5cde4); border-radius: 14px; padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.bt-card.foe { --tc: #b23a3a; background: linear-gradient(160deg, #fdeaea, #ffffff 60%); }
.bt-card[data-state="ko"] { opacity: .55; filter: grayscale(.7); }
.bt-card header { display: flex; align-items: center; gap: 10px; }
.bt-photo { width: 52px; height: 52px; border-radius: 10px; background: #ffffff; border: 2px solid var(--tc); display: flex; align-items: center; justify-content: center; font-size: 26px; overflow: hidden; flex-shrink: 0; }
.bt-photo img { width: 100%; height: 100%; object-fit: contain; }
.bt-who { flex: 1; min-width: 0; } .bt-who b { display: block; }
.bt-init { display: flex; align-items: center; gap: 4px; font-size: 12px; color: #56608a; }
.bt-init input { width: 52px; text-align: center; background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 6px; padding: 5px; }
.bt-card button { border: none; border-radius: 6px; background: #e6ebf6; color: #26304f; cursor: pointer; padding: 5px 9px; }
.bt-x { background: #e05a5a !important; }
.bt-hp-top { display: flex; justify-content: space-between; align-items: center; font-size: 17px; margin-bottom: 4px; }
.bt-hp-top button { margin-left: 4px; }
.bt-bar { height: 14px; background: #e6ebf6; border-radius: 8px; overflow: hidden; }
.bt-bar i { display: block; height: 100%; background: #2ecc71; transition: width .3s, background .3s; }
.bt-card[data-state="half"] .bt-bar i { background: #f1c40f; }
.bt-card[data-state="low"] .bt-bar i, .bt-card[data-state="ko"] .bt-bar i { background: #e74c3c; }
.bt-hp-msg { font-size: 12px; color: #5f6a92; margin: 3px 0 6px; }
.bt-amt { display: flex; gap: 6px; } .bt-amt input { width: 60px; background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 6px; padding: 5px; text-align: center; }
.bt-actions { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #3a4468; }
.bt-act { width: 30px; height: 30px; border-radius: 50% !important; background: #2e7d32 !important; font-size: 14px; }
.bt-act.used { background: #d9e0f0 !important; color: #5f6a92; }
.bt-status { display: flex; flex-wrap: wrap; gap: 4px; }
.bt-moves { display: flex; flex-direction: column; gap: 5px; }
.bt-move { display: flex; align-items: center; gap: 5px; padding: 5px 8px; background: #ffffff; border-left: 4px solid var(--tc); border-radius: 6px; font-size: 13px; }
.bt-mname { flex: 1; min-width: 0; } .bt-mname small { color: #5f6a92; }
.bt-move button { padding: 4px 7px; font-size: 12px; white-space: nowrap; }
@media (max-width: 900px) { .bt-main { grid-template-columns: 1fr; } .bt-log { position: static; max-height: none; } .bt-tools { margin-left: 0; } }

/* o estilo global de <header> não deve valer dentro dos cards */
.bt-card header { background: none; padding: 0; border: 0; text-align: left; }
.bt-init { white-space: nowrap; }
.bt-who { overflow: hidden; }

/* Escolha de participantes, DEF/SDEF, buffs, ações */
.bt-who-fights { background: #ffffff; border: 1px solid #d5dcee; border-radius: 12px; padding: 10px 14px; margin-bottom: 14px; }
.bt-who-fights summary { cursor: pointer; font-weight: bold; color: #9a6a00; }
.bt-picker { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.bt-pick { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 5px; border-radius: 22px; border: 2px solid #c5cde4; background: #f1f4fb; color: #3a4468; cursor: pointer; font-size: 13px; }
.bt-pick.on { border-color: #4caf50; background: #dff5e6; color: #26304f; }
.bt-pick-img { width: 30px; height: 30px; border-radius: 50%; background: #ffffff; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.bt-pick-img img { width: 100%; height: 100%; object-fit: cover; }
.bt-defs { display: flex; flex-wrap: wrap; gap: 6px; align-items: stretch; }
.bt-def { background: #ffffff; border-radius: 8px; padding: 4px 12px; text-align: center; min-width: 54px; }
.bt-def small { display: block; color: #5f6a92; font-size: 11px; } .bt-def b { font-size: 18px; }
.bt-defs button { font-size: 12px; } .bt-defs button b { color: #9a6a00; }
.bt-sect { font-size: 11px; text-transform: uppercase; color: #5f6a92; display: flex; justify-content: space-between; align-items: center; margin-top: 2px; }
.bt-link { background: none !important; color: #2f5fd0 !important; font-size: 11px; text-decoration: underline; padding: 0 !important; }
.bt-buffs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
.bt-buff { background: #ffffff; border-radius: 8px; padding: 4px; text-align: center; border: 1px solid transparent; }
.bt-buff small { display: block; color: #5f6a92; font-size: 10px; }
.bt-buff div { display: flex; align-items: center; justify-content: center; gap: 3px; }
.bt-buff button { padding: 1px 6px !important; }
.bt-buff b { min-width: 16px; font-size: 15px; }
.bt-buff.up { border-color: #4caf50; } .bt-buff.up b { color: #66bb6a; }
.bt-buff.down { border-color: #e04848; } .bt-buff.down b { color: #ef5350; }
.bt-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; color: #3a4468; background: #ffffff; padding: 6px 10px; border-radius: 8px; }
.bt-actions b { color: #9a6a00; } .bt-actions small { color: #5f6a92; margin-left: auto; } .bt-actions small b { color: #9a6a00; }
.bt-actions button { margin-left: 3px; }
.bt-apr { display: flex; align-items: center; gap: 6px; }
.bt-order { align-items: start; }

/* buffs cabem no card */
.bt-buffs { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
.bt-buff { padding: 3px 2px; min-width: 0; }
.bt-buff div { gap: 1px; }
.bt-buff button { padding: 0 4px !important; font-size: 12px; }
.bt-buff b { min-width: 14px; font-size: 14px; }
.bt-order { grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); }

.bt-card .calc-row input[type=number] { width: 64px; }

/* golpes em área: nº de alvos */
.bt-tg { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; color: #5f6a92; }
.bt-tg input { width: 42px; padding: 3px 4px; font-size: 12px; }
.bt-held { display: block; font-size: 11px; color: #5f6a92; margin-top: 2px; }


/* ===== css/field.css ===== */
/* Efeitos visuais de campo — só CSS, transform/opacity (leve). Desligue em "efeitos visuais". */
#fieldFx { position: fixed; inset: 0; pointer-events: none; z-index: 40; overflow: hidden; }
#fieldFx:empty { display: none; }
.fx { position: absolute; inset: 0; overflow: hidden; }
.fx i { position: absolute; left: 0; top: 0; width: 100%; will-change: transform; display: block; }

/* chuva */
.fx-rain { background: rgba(40, 70, 120, .10); }
.fx-rain i:nth-child(1) { height: calc(100% + 140px); background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='90'%20height='140'%3E%3Cg%20stroke='rgb(175%2C210%2C255)'%20stroke-opacity='.8'%20stroke-width='1.4'%20stroke-linecap='round'%3E%3Cpath%20d='M10%208l-3%2020M52%2050l-3%2020M80%20100l-3%2020M30%2092l-3%2016'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 90px 140px; opacity: .55; animation: fxFall140 .7s linear infinite; }
.fx-rain i:nth-child(2) { height: calc(100% + 210px); background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='90'%20height='140'%3E%3Cg%20stroke='rgb(175%2C210%2C255)'%20stroke-opacity='.8'%20stroke-width='1.4'%20stroke-linecap='round'%3E%3Cpath%20d='M10%208l-3%2020M52%2050l-3%2020M80%20100l-3%2020M30%2092l-3%2016'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 135px 210px; opacity: .32; animation: fxFall210 1s linear infinite; }
/* tufão */
.fx-typhoon { background: rgba(15, 50, 110, .24); }
.fx-typhoon i:nth-child(1) { height: calc(100% + 140px); background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='90'%20height='140'%3E%3Cg%20stroke='rgb(175%2C210%2C255)'%20stroke-opacity='.8'%20stroke-width='1.4'%20stroke-linecap='round'%3E%3Cpath%20d='M10%208l-3%2020M52%2050l-3%2020M80%20100l-3%2020M30%2092l-3%2016'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 70px 109px; opacity: .7; animation: fxFall109 .38s linear infinite; }
.fx-typhoon i:nth-child(2) { top: auto; bottom: 0; left: -200px; width: calc(100% + 200px); height: 110px; background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='200'%20height='110'%3E%3Cpath%20d='M0%2030Q50%200%20100%2030T200%2030V110H0Z'%20fill='rgb(40%2C110%2C200)'%20fill-opacity='.35'/%3E%3C/svg%3E") repeat-x 0 0 / 200px 110px; animation: fxSlideX200 4s linear infinite; }
/* granizo */
.fx-hail { background: rgba(170, 215, 255, .09); }
.fx-hail i:nth-child(1) { height: calc(100% + 160px); background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='120'%20height='160'%3E%3Cg%20fill='rgb(235%2C248%2C255)'%20fill-opacity='.85'%3E%3Ccircle%20cx='14'%20cy='20'%20r='2.6'/%3E%3Ccircle%20cx='70'%20cy='52'%20r='3.2'/%3E%3Ccircle%20cx='104'%20cy='96'%20r='2.4'/%3E%3Ccircle%20cx='38'%20cy='120'%20r='3'/%3E%3Ccircle%20cx='88'%20cy='146'%20r='2'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 120px 160px; opacity: .8; animation: fxFall160 2.4s linear infinite; }
.fx-hail i:nth-child(2) { height: calc(100% + 240px); background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='120'%20height='160'%3E%3Cg%20fill='rgb(235%2C248%2C255)'%20fill-opacity='.85'%3E%3Ccircle%20cx='14'%20cy='20'%20r='2.6'/%3E%3Ccircle%20cx='70'%20cy='52'%20r='3.2'/%3E%3Ccircle%20cx='104'%20cy='96'%20r='2.4'/%3E%3Ccircle%20cx='38'%20cy='120'%20r='3'/%3E%3Ccircle%20cx='88'%20cy='146'%20r='2'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 180px 240px; opacity: .5; animation: fxFall240 3.6s linear infinite; }
/* tempestade de areia */
.fx-sandstorm { background: rgba(205, 150, 70, .17); }
.fx-sandstorm i { left: -220px; width: calc(100% + 220px); height: 100%; }
.fx-sandstorm i:nth-child(1) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='220'%20height='90'%3E%3Cg%20stroke='rgb(225%2C180%2C100)'%20stroke-opacity='.75'%20stroke-width='1.6'%20stroke-linecap='round'%3E%3Cpath%20d='M6%2014h58M110%2038h92M30%2068h74M160%2080h44'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 220px 90px; opacity: .65; animation: fxSlideX220 1.1s linear infinite; }
.fx-sandstorm i:nth-child(2) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='220'%20height='90'%3E%3Cg%20stroke='rgb(225%2C180%2C100)'%20stroke-opacity='.75'%20stroke-width='1.6'%20stroke-linecap='round'%3E%3Cpath%20d='M6%2014h58M110%2038h92M30%2068h74M160%2080h44'/%3E%3C/g%3E%3C/svg%3E") 0 30px / 330px 135px; opacity: .4; animation: fxSlideX330 1.7s linear infinite; }
/* ventos fortes */
.fx-wind { background: rgba(200, 225, 245, .06); }
.fx-wind i { left: -260px; width: calc(100% + 260px); height: 100%; }
.fx-wind i:nth-child(1) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='260'%20height='120'%3E%3Cg%20fill='none'%20stroke='rgb(235%2C245%2C255)'%20stroke-opacity='.8'%20stroke-width='1.5'%20stroke-linecap='round'%3E%3Cpath%20d='M10%2022q35-12%2070%200t60%200'/%3E%3Cpath%20d='M140%2070q35-12%2070%200t40%200'/%3E%3Cpath%20d='M30%20102q25-8%2050%200'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 260px 120px; opacity: .6; animation: fxSlideX260 .8s linear infinite; }
.fx-wind i:nth-child(2) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='260'%20height='120'%3E%3Cg%20fill='none'%20stroke='rgb(235%2C245%2C255)'%20stroke-opacity='.8'%20stroke-width='1.5'%20stroke-linecap='round'%3E%3Cpath%20d='M10%2022q35-12%2070%200t60%200'/%3E%3Cpath%20d='M140%2070q35-12%2070%200t40%200'/%3E%3Cpath%20d='M30%20102q25-8%2050%200'/%3E%3C/g%3E%3C/svg%3E") 0 40px / 390px 180px; opacity: .35; animation: fxSlideX390 1.3s linear infinite; }
/* sol */
.fx-sun { background: radial-gradient(circle at 100% 0%, rgba(255, 214, 90, .26), transparent 55%); animation: fxPulse 5s ease-in-out infinite alternate; }
.fx-sun i:nth-child(1), .fx-harsh i:nth-child(1) { left: auto; right: -45vmax; top: -45vmax; width: 90vmax; height: 90vmax; border-radius: 50%;
    background: repeating-conic-gradient(rgba(255, 230, 120, .16) 0 7deg, transparent 7deg 18deg);
    -webkit-mask-image: radial-gradient(circle, #000 0, transparent 68%); mask-image: radial-gradient(circle, #000 0, transparent 68%);
    animation: fxSpin 90s linear infinite; }
.fx-sun i:nth-child(2) { display: none; }
/* sol escaldante */
.fx-harsh { background: radial-gradient(circle at 100% 0%, rgba(255, 120, 30, .34), transparent 60%); animation: fxPulse 3.5s ease-in-out infinite alternate; }
.fx-harsh i:nth-child(1) { background: repeating-conic-gradient(rgba(255, 150, 60, .2) 0 7deg, transparent 7deg 18deg); }
.fx-harsh i:nth-child(2) { top: auto; bottom: 0; height: 38%; background: linear-gradient(to top, rgba(255, 70, 0, .3), transparent); animation: fxHeat 2.2s ease-in-out infinite alternate; }
/* neblina */
.fx-fog { background: rgba(210, 220, 232, .10); box-shadow: inset 0 0 170px rgba(18, 24, 34, .5); }
.fx-fog i { width: 70vw; height: 60vh; background: radial-gradient(closest-side, rgba(235, 240, 246, .30), transparent); }
.fx-fog i:nth-child(1) { top: 5%; left: -20vw; animation: fxDrift 22s ease-in-out infinite alternate; }
.fx-fog i:nth-child(2) { top: 42%; left: 40vw; animation: fxDrift 30s ease-in-out infinite alternate-reverse; }
/* lama */
.fx-mud { background: linear-gradient(to top, rgba(110, 70, 30, .34), transparent 28%); }
.fx-mud i { display: none; }
/* chão em chamas */
.fx-fire { background: linear-gradient(to top, rgba(255, 90, 0, .38), transparent 42%); animation: fxFlicker .9s ease-in-out infinite alternate; }
.fx-fire i:nth-child(1) { height: calc(100% + 240px); background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='160'%20height='240'%3E%3Cg%20fill='rgb(255%2C150%2C40)'%20fill-opacity='.85'%3E%3Ccircle%20cx='20'%20cy='30'%20r='2'/%3E%3Ccircle%20cx='84'%20cy='90'%20r='2.6'/%3E%3Ccircle%20cx='130'%20cy='160'%20r='1.8'/%3E%3Ccircle%20cx='50'%20cy='200'%20r='2.2'/%3E%3Ccircle%20cx='110'%20cy='20'%20r='1.6'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 160px 240px; opacity: .8; animation: fxRise240 3s linear infinite; }
.fx-fire i:nth-child(2) { display: none; }
/* postes elétricos */
.fx-poles { box-shadow: inset 0 0 100px rgba(255, 220, 60, .26); animation: fxFlash 5s linear infinite; }
.fx-poles i { display: none; }

@keyframes fxFall109 { from { transform: translateY(-109px); } to { transform: translateY(0); } }
@keyframes fxFall140 { from { transform: translateY(-140px); } to { transform: translateY(0); } }
@keyframes fxFall160 { from { transform: translateY(-160px); } to { transform: translateY(0); } }
@keyframes fxFall210 { from { transform: translateY(-210px); } to { transform: translateY(0); } }
@keyframes fxFall240 { from { transform: translateY(-240px); } to { transform: translateY(0); } }
@keyframes fxRise240 { from { transform: translateY(0); } to { transform: translateY(-240px); } }
@keyframes fxSlideX200 { from { transform: translateX(0); } to { transform: translateX(200px); } }
@keyframes fxSlideX220 { from { transform: translateX(0); } to { transform: translateX(220px); } }
@keyframes fxSlideX260 { from { transform: translateX(0); } to { transform: translateX(260px); } }
@keyframes fxSlideX330 { from { transform: translateX(0); } to { transform: translateX(330px); } }
@keyframes fxSlideX390 { from { transform: translateX(0); } to { transform: translateX(390px); } }
@keyframes fxSpin { to { transform: rotate(360deg); } }
@keyframes fxPulse { from { opacity: .7; } to { opacity: 1; } }
@keyframes fxHeat { from { opacity: .5; transform: scaleY(.9); transform-origin: bottom; } to { opacity: 1; transform: scaleY(1.08); transform-origin: bottom; } }
@keyframes fxFlicker { from { opacity: .6; } to { opacity: 1; } }
@keyframes fxDrift { from { transform: translateX(0); } to { transform: translateX(45vw); } }
@keyframes fxFlash { 0%, 90%, 100% { background: transparent; } 92% { background: rgba(255, 240, 120, .24); } 93% { background: transparent; } 95% { background: rgba(255, 240, 120, .14); } 96% { background: transparent; } }
@media (prefers-reduced-motion: reduce) { .fx, .fx i { animation: none !important; } }

/* painel do campo */
.bt-field { margin: 0 0 12px; padding: 12px 16px; border-radius: 12px; background: #ffffff; border: 1px solid #d5dcee; }
.fld-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.fld-row select { background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 8px; padding: 6px 8px; }
.fld-env { display: flex; flex-wrap: wrap; gap: 6px; }
.fld-chip { display: flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 16px; background: #f1f4fb; font-size: 13px; cursor: pointer; border: 1px solid transparent; }
.fld-chip.on { background: #3b3322; border-color: #d9a900; }
.fld-chip input { display: none; }
.fld-vis { margin-left: auto; font-size: 12px; color: #5f6a92; display: flex; gap: 4px; align-items: center; }
.fld-list { margin-top: 10px; display: grid; gap: 4px; }
.fld-fx { font-size: 13px; padding: 5px 10px; border-radius: 8px; background: #f1f4fb; border-left: 3px solid #d9a900; }
.fld-fx b { margin-right: 8px; }
.fld-fx span { color: #56608a; }
.bt-field.w-sun, .bt-field.w-harsh { border-color: #c99a2a; } .bt-field.w-rain, .bt-field.w-typhoon { border-color: #3a6aa8; }
.bt-field.w-sandstorm { border-color: #a8742e; } .bt-field.w-hail, .bt-field.w-wind { border-color: #8fb4cc; }

/* efeitos com duração */
.tm-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 8px; }
.tm-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px 4px 10px; background: rgba(38,48,79,.07); border: 1px solid #666; border-radius: 999px; font-size: 13px; }
.tm-chip.last { border-color: #ff8a3d; }
.tm-chip.tm-w { border-color: #6ab7ff; }
.tm-chip small { color: #5f6a92; } .tm-chip b { color: #9a6a00; }
.tm-chip button, .tm-add button { border: none; border-radius: 6px; padding: 2px 7px; background: #e6ebf6; color: #26304f; cursor: pointer; font-weight: bold; }
.tm-add { display: inline-flex; gap: 4px; margin-left: auto; }
.tm-add input { background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 6px; padding: 5px 8px; font: inherit; font-size: 13px; }
.tm-add input[type=number] { width: 56px; }


/* ===== css/master.css ===== */
/* Ficha do Mestre */
.master-sheet { padding: 20px; max-width: 1500px; margin: 0 auto; }
.master-sheet[hidden] { display: none; }
.ms-top { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 4px 0 14px; padding: 14px 20px; border-radius: 14px;
    background: linear-gradient(135deg, #ffe9ec, #ece6fb); border: 1px solid #d5c8f0; }
.ms-top h2 { margin: 0; }
.ms-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.ms-tabs button, .ms-bar > button, .ms-new button { border: none; border-radius: 8px; padding: 8px 14px; background: #e6ebf6; color: #26304f; cursor: pointer; font-weight: bold; }
.ms-tabs button.on { background: #ffcb05; color: #222; }
.ms-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 12px; padding: 10px 14px; background: #ffffff; border: 1px solid #d5dcee; border-radius: 12px; }
.ms-bar .bt-primary { background: #4CAF50; }
.ms-new { display: flex; gap: 6px; margin-left: auto; align-items: center; }
.ms-new input { background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 8px; padding: 8px; width: 190px; }

.ms-foes { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; align-items: start; }
.ms-foe { background: #ffffff; border: 2px solid var(--tc, #b23a3a); border-radius: 14px; padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.ms-foe.fighting { box-shadow: 0 0 0 2px #ffcb05 inset, 0 0 16px rgba(255, 203, 5, .25); }
.ms-foe[data-state="ko"] { opacity: .55; filter: grayscale(.7); }
.ms-foe button, .ms-card button { border: none; border-radius: 6px; background: #e6ebf6; color: #26304f; cursor: pointer; padding: 5px 9px; }
.ms-foe input, .ms-foe select, .ms-foe textarea, .ms-card input, .ms-card select, .ms-card textarea { background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 6px; padding: 5px 7px; font: inherit; }
.ms-foe header { display: flex; align-items: center; gap: 10px; }
.ms-photo { width: 72px; height: 90px; padding: 0 !important; border-radius: 10px !important; border: 2px solid var(--tc) !important; background: #ffffff !important; font-size: 30px; overflow: hidden; flex-shrink: 0; }
.ms-photo img, .ms-cimg img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ms-who { flex: 1; min-width: 0; display: grid; gap: 4px; }
.ms-name { font-weight: bold; font-size: 16px; width: 100%; box-sizing: border-box; }
.ms-kind { width: 90px; font-size: 12px; margin-right: 6px; }
.ms-init { display: flex; align-items: center; gap: 4px; font-size: 12px; color: #56608a; }
.ms-init input { width: 52px; text-align: center; }
.ms-hp-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.ms-hp-top button, .ms-amt button { margin-left: 4px; }
.ms-amt { display: flex; gap: 6px; margin-top: 6px; } .ms-amt input { width: 64px; }
.ms-calc { display: flex; flex-wrap: wrap; gap: 6px; } .ms-calc input { width: 64px; } .ms-calc select { max-width: 140px; }
.ms-defs, .ms-status { display: flex; flex-wrap: wrap; gap: 6px; }
.ms-fight.on { background: #ffcb05 !important; color: #222 !important; font-weight: bold; }
.ms-status .chip { border-radius: 16px; font-size: 12px; padding: 3px 9px; }
.ms-status .chip.on { background: #ffe3e3; border: 1px solid #e04848; }
.ms-moves { display: grid; gap: 6px; }
.ms-move { border-left: 4px solid var(--tc); background: #f1f4fb; border-radius: 6px; padding: 6px 8px; display: grid; gap: 6px; }
.ms-move-edit { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; font-size: 11px; color: #5f6a92; }
.ms-move-edit input[type=text] { width: 100px; } .ms-move-edit input[type=number] { width: 44px; }
.ms-move-edit label { display: grid; gap: 1px; }
.ms-move-roll { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ms-move-roll b { margin-right: auto; }
.ms-edit summary { cursor: pointer; color: #9a6a00; font-weight: bold; }
.ms-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 6px; margin: 8px 0; }
.ms-stats label, .ms-types label, .ms-notes { display: grid; gap: 2px; font-size: 12px; color: #5f6a92; }
.ms-stats input { width: 100%; box-sizing: border-box; }
.ms-types { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; }
.ms-sect { margin: 10px 0 6px; font-size: 12px; color: #56608a; } .ms-sect small { color: #6a7396; }
.ms-mods { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 4px; }
.ms-mod { display: flex; justify-content: space-between; align-items: center; gap: 4px; font-size: 11px; border-left: 4px solid var(--tc) !important; }
.ms-mod.up { background: #ffe3e3 !important; } .ms-mod.dn { background: #1f3a2a !important; } .ms-mod.im { background: #f1f4fb !important; opacity: .8; }
.ms-notes textarea { width: 100%; box-sizing: border-box; }
.ms-foot { display: flex; gap: 8px; margin-top: 8px; }

.ms-scene { display: flex; gap: 16px; align-items: center; margin: 0 0 12px; padding: 14px; background: linear-gradient(135deg, #f1f4fb, #ffffff); border: 1px solid #c9a52a; border-radius: 12px; }
.ms-scene img { width: 180px; max-height: 220px; object-fit: contain; background: #ffffff; border-radius: 10px; }
.ms-scene > div { flex: 1; } .ms-scene h3 { margin: 2px 0 6px; color: #9a6a00; } .ms-scene p { margin: 0; white-space: pre-wrap; color: #3a4468; } .ms-scene small { color: #5f6a92; }
.ms-scene > button { background: #e6ebf6; color: #26304f; border: none; border-radius: 6px; padding: 5px 10px; cursor: pointer; }
.ms-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.ms-card { background: #ffffff; border: 2px solid #d5dcee; border-radius: 14px; padding: 10px; display: grid; gap: 8px; }
.ms-card.scene { border-color: #d9a900; }
.ms-cimg { height: 220px; padding: 0 !important; border-radius: 10px !important; background: #ffffff !important; font-size: 34px; overflow: hidden; }
.ms-card textarea { width: 100%; box-sizing: border-box; resize: vertical; }
.ms-card > input { font-weight: bold; }
.ms-cbtn { display: flex; gap: 6px; align-items: center; } .ms-cbtn select { margin-left: auto; }
@media (max-width: 700px) { .ms-foes { grid-template-columns: 1fr; } .ms-new { margin-left: 0; } .ms-scene { flex-direction: column; align-items: stretch; } .ms-scene img { width: 100%; } }

.ms-addmove { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.ms-addmove input { flex: 1; min-width: 140px; }
.ms-fxin { flex: 1 1 100%; } .ms-fxin input { width: 100%; box-sizing: border-box; }
.ms-fxtxt { display: block; font-weight: normal; color: #5f6a92; font-size: 11px; }

.ms-sum { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; font-size: 11px; }
.ms-chip { background: #f1f4fb; border-radius: 10px; padding: 1px 8px; color: #3a4468; }
.ms-chip.ab { background: #f1f4fb; color: #9a6a00; }
.ms-attrs { display: flex; gap: 6px; color: #5f6a92; } .ms-attrs b { font-weight: normal; }
.ms-info { margin: 8px 0; font-size: 12px; }

.ms-pts { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 8px 0; padding: 6px 10px; background: #ffffff; border-radius: 8px; font-size: 12px; color: #56608a; }
.ms-pts b { color: #9a6a00; } .ms-pts .over b { color: #ff6b6b; } .ms-pts small { color: #6a7396; }

/* Seletor / abas de inimigos */
.ms-pick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0 0 8px; }
.ms-pick label { display: flex; align-items: center; gap: 8px; color: #5f6a92; font-size: 13px; flex: 1 1 280px; max-width: 460px; }
.ms-pick select { flex: 1; min-width: 0; background: #ffffff; color: #26304f; border: 1px solid #5a5a5a; border-radius: 8px; padding: 9px 10px; font: inherit; font-weight: bold; }
.ms-pick button { border: none; border-radius: 8px; padding: 8px 12px; background: #e6ebf6; color: #26304f; cursor: pointer; font-weight: bold; }
.ms-pick button:disabled, .ms-pick select:disabled { opacity: .4; cursor: default; }
.ms-count { color: #5f6a92; font-size: 13px; }
.ms-viewsw { margin-left: auto; display: flex; gap: 4px; }
.ms-viewsw button.on { background: #ffcb05; color: #222; }
.ms-ftabs { display: flex; gap: 6px; overflow-x: auto; padding: 4px 2px 10px; margin: 0 0 6px; scrollbar-width: thin; }
.ms-ftab { position: relative; flex: 0 0 auto; display: flex; align-items: center; gap: 8px; min-width: 130px; max-width: 200px; padding: 6px 10px 9px; border: 2px solid #d5dcee !important; border-radius: 10px !important; background: #ffffff !important; color: #3a4468; cursor: pointer; overflow: hidden; text-align: left; }
.ms-ftab.fight { border-color: #d9a900 !important; }
.ms-ftab.on { background: #f1f4fb !important; border-color: var(--tc) !important; box-shadow: 0 0 0 2px var(--tc) inset; color: #26304f; }
.ms-ftab.ko { opacity: .55; }
.ms-ftab-img { width: 30px; height: 38px; border-radius: 6px; background: #ffffff; display: grid; place-items: center; overflow: hidden; flex-shrink: 0; }
.ms-ftab-img img { width: 100%; height: 100%; object-fit: contain; }
.ms-ftab-txt { display: grid; min-width: 0; } .ms-ftab-txt b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13px; } .ms-ftab-txt small { color: #5f6a92; }
.ms-ftab > i { position: absolute; left: 0; bottom: 0; height: 4px; background: #4CAF50; }
.ms-foes.one { grid-template-columns: minmax(0, 820px); }

.ms-kind { width: 150px; }
.ms-undo { margin-left: auto; }
.ms-undo button, .bt-tools button[data-undo] { border: none; border-radius: 8px; padding: 8px 14px; background: #e6ebf6; color: #26304f; cursor: pointer; font-weight: bold; }
button[data-undo]:disabled { opacity: .4; cursor: default; }
/* ordem de combate */
.ms-order { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 10px; padding: 8px 12px; background: #ffffff; border: 1px solid #d9a900; border-radius: 12px; }
.ms-order > b { margin-right: 6px; color: #9a6a00; }
.ms-ochip { border: 2px solid #d5dcee !important; border-radius: 999px !important; background: #f1f4fb !important; color: #3a4468; padding: 4px 12px !important; cursor: pointer; font-weight: bold; }
.ms-ochip small { background: #e6ebf6; border-radius: 999px; padding: 1px 7px; margin-right: 4px; }
.ms-ochip.cur { border-color: #d9a900 !important; background: #5a4a00 !important; color: #fff; box-shadow: 0 0 10px rgba(255, 203, 5, .5); }
.ms-ochip.done { opacity: .5; } .ms-ochip.ko { text-decoration: line-through; }
.ms-oarrow { color: #6a7396; }
.ms-ocmd { margin-left: auto; display: flex; gap: 6px; }
.ms-ocmd button { border: none; border-radius: 8px; padding: 7px 12px; background: #e6ebf6; color: #26304f; cursor: pointer; font-weight: bold; }
.ms-ocmd .bt-primary { background: #4CAF50; }
/* encontros salvos */
.ms-enc { margin: 0 0 10px; padding: 8px 12px; background: #ffffff; border: 1px solid #d5dcee; border-radius: 12px; }
.ms-enc summary { cursor: pointer; font-weight: bold; color: #9a6a00; }
.ms-enc-add { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.ms-enc-add input { flex: 1 1 240px; background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 8px; padding: 8px; }
.ms-enc button { border: none; border-radius: 8px; padding: 7px 12px; background: #e6ebf6; color: #26304f; cursor: pointer; font-weight: bold; }
.ms-enc button:disabled { opacity: .4; }
.ms-enc-item { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; padding: 6px 0; border-top: 1px solid #dde3f2; }
.ms-enc-item > div { flex: 1 1 220px; display: grid; } .ms-enc-item small { color: #5f6a92; }
.ms-dup { display: flex; align-items: center; gap: 4px; color: #5f6a92; } .ms-dup input { width: 52px; background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 6px; padding: 6px; }
.ms-dis { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #3a4468; } .ms-dis select { background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 6px; padding: 5px; }
/* efeitos com duração */

/* tabela de iniciativa */
.ms-ini { margin: 0 0 10px; padding: 8px 12px; background: #ffffff; border: 1px solid #d9a900; border-radius: 12px; }
.ms-ini summary { cursor: pointer; font-weight: bold; color: #9a6a00; } .ms-ini summary b { color: #26304f; }
.ms-ini-add { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 8px 0; }
.ms-ini-add input[type=text] { flex: 1 1 140px; min-width: 0; } .ms-ini-add input[type=number] { width: 78px; }
.ms-ini input, .ms-ini button { font: inherit; }
.ms-ini input { background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 6px; padding: 6px 8px; box-sizing: border-box; }
.ms-ini button { border: none; border-radius: 8px; padding: 7px 12px; background: #e6ebf6; color: #26304f; cursor: pointer; font-weight: bold; }
.ms-ini button:disabled { opacity: .35; cursor: default; }
.ms-ini .bt-primary { background: #4CAF50; }
.ms-ini-wrap { overflow-x: auto; }
.ms-ini-t { width: 100%; border-collapse: collapse; font-size: 14px; }
.ms-ini-t th { text-align: left; color: #5f6a92; font-weight: normal; font-size: 12px; padding: 2px 6px; }
.ms-ini-t td { padding: 4px 6px; border-top: 1px solid #dde3f2; vertical-align: middle; }
.ms-ini-t td input[type=text] { width: 100%; min-width: 90px; }
.ms-ini-in { white-space: nowrap; } .ms-ini-in input { width: 64px; }
.ms-ini-mv { white-space: nowrap; text-align: right; } .ms-ini-mv button { padding: 4px 8px; margin-left: 2px; }
.ms-ini-t tr.cur td { background: rgba(255, 203, 5, .16); }
.ms-ini-t tr.cur .ms-turnbtn { background: #ffcb05; color: #222; }
.ms-ini-t tr.done { opacity: .5; } .ms-ini-t tr.ko .ms-link { text-decoration: line-through; }
.ms-ini-t tr.foe td:nth-child(2) { color: #c62828; }
.ms-turnbtn { min-width: 34px; }
.ms-link { background: none !important; color: #2f5fd0 !important; text-decoration: underline; padding: 2px 4px !important; text-align: left; }
.ms-ini-foot { margin-top: 8px; text-align: right; } .ms-ini-foot button { background: #5a2a2a; }

/* prioridade na iniciativa */
.ms-ini-pr select { width: 58px; padding: 2px; }
.ms-ini-pr select.on { background: #ffe9a8; color: #000; font-weight: 700; }
.ms-ini-t tr.pr td:first-child { box-shadow: inset 3px 0 0 #f5a623; }
.ms-tag { background: #ffe9a8; color: #000; border-radius: 6px; padding: 0 5px; font-size: .85em; }


/* ===== css/dialog.css ===== */
/* Diálogos próprios (Dlg.alert/confirm/choice/prompt, ver js/dialog.js). */

.dlg-wrap { position: fixed; inset: 0; background: rgba(38, 48, 79, .55); animation: dlgIn .15s ease-out; display: flex; align-items: center; justify-content: center; z-index: 10000; padding: 16px; }
.dlg { animation: dlgPop .18s ease-out; background: #fff; color: #26304f; border: 2px solid #ffcb05; border-radius: 12px; padding: 18px 20px; width: min(440px, 100%); box-shadow: 0 10px 40px rgba(0, 0, 0, .6); }
.dlg h3 { margin: 0 0 8px; color: #d62839; }
.dlg p { margin: 0 0 14px; line-height: 1.45; }
.dlg-in { width: 100%; box-sizing: border-box; margin-bottom: 14px; padding: 8px; }
.dlg-btns { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.dlg-btns button { padding: 8px 14px; border-radius: 8px; border: 1px solid #c5cde4; background: #f1f4fb; color: #26304f; cursor: pointer; }
.dlg-btns button.pri { background: #3b6fe0; border-color: #3b6fe0; color: #fff; }
.dlg-btns button.danger { background: #ee4b4b; border-color: #ee4b4b; color: #fff; }
.dlg-btns button:focus-visible { outline: 2px solid #ffcb05; outline-offset: 2px; }

@keyframes dlgIn { from { opacity: 0; } }
@keyframes dlgPop { from { transform: translateY(8px) scale(.97); opacity: 0; } }


/* ===== css/inventario.css ===== */
/* Inventário compacto + bolsa */
:root { --inv-bg: #f1f4fb; --inv-line: #d5dcee; --inv-ink: #26304f; --inv-muted: #5f6a92; --inv-fav: #fff4cf; --inv-favline: #e8c04a; --inv-panel: #ffffff; --inv-star: #d9a900; }
html[data-tema="escuro"] { --inv-bg: #2d2d2d; --inv-line: #444; --inv-ink: #fff; --inv-muted: #aaa; --inv-fav: #3a3320; --inv-favline: #8a6d12; --inv-panel: #252525; --inv-star: #ffcb05; }

.inventario .inv-tools { display: flex; gap: 8px; margin-bottom: 8px; }
.inventario .inv-tools input { flex: 1; min-width: 0; }
.inventario .inv-tools button, .inv-form-btns button, .inv-bag footer button { border: none; border-radius: 8px; padding: 8px 12px; cursor: pointer; font-weight: 700; background: var(--inv-bg); color: var(--inv-ink); white-space: nowrap; }
.inventario .inv-tools #invBag, .inv-form-btns #saveItem { background: #3b6fe0; color: #fff; }
.inv-form-btns { display: flex; gap: 8px; }
.inv-form-btns #saveItem { flex: 1; }
.inventario .inventory-form[hidden] { display: none; }
.inventario hr { display: none; }

.inv-row { display: flex; align-items: center; gap: 8px; padding: 5px 8px; margin-bottom: 4px; background: var(--inv-bg); border: 1px solid var(--inv-line); border-radius: 10px; color: var(--inv-ink); }
.inv-row.fav { background: var(--inv-fav); border-color: var(--inv-favline); }
.inv-row.zero { opacity: .55; }
.inv-name { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.inv-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inv-name small { color: var(--inv-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.inv-row button { border: none; background: transparent; color: inherit; cursor: pointer; border-radius: 6px; padding: 3px 6px; font-size: 14px; }
.inv-row button:hover { background: rgba(127, 140, 180, .25); }
.inv-star { font-size: 18px !important; color: var(--inv-star) !important; padding: 0 4px !important; }
.inv-qty { display: inline-flex; align-items: center; gap: 2px; }
.inv-qty b { min-width: 22px; text-align: center; }
.inv-qty button { background: rgba(127, 140, 180, .2); width: 24px; height: 24px; padding: 0 !important; font-weight: 700; }
.inv-more { width: 100%; margin-top: 2px; padding: 7px; border: 1px dashed var(--inv-line); background: transparent; color: var(--inv-muted); border-radius: 10px; cursor: pointer; font-size: 13px; }
.inv-more:hover { color: var(--inv-ink); border-color: var(--inv-ink); }

.inv-bag-wrap { position: fixed; inset: 0; z-index: 8000; background: rgba(38, 48, 79, .55); display: flex; align-items: center; justify-content: center; padding: 16px; animation: dlgIn .15s ease-out; }
.inv-bag { background: var(--inv-panel); color: var(--inv-ink); border: 2px solid #ffcb05; border-radius: 14px; width: min(640px, 100%); max-height: 86vh; display: flex; flex-direction: column; gap: 10px; padding: 16px; box-shadow: 0 10px 40px rgba(0, 0, 0, .5); animation: dlgPop .18s ease-out; }
.inv-bag header { display: flex; justify-content: space-between; align-items: center; }
.inv-bag header h3 { margin: 0; } .inv-bag header small { color: var(--inv-muted); font-weight: 400; margin-left: 6px; }
.inv-x { border: none; background: var(--inv-bg); color: var(--inv-ink); font-size: 20px; width: 34px; height: 34px; border-radius: 8px; cursor: pointer; }
.inv-bag input { width: 100%; box-sizing: border-box; }
#invBagList { overflow-y: auto; flex: 1; min-height: 120px; padding-right: 4px; }
.inv-bag footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; color: var(--inv-muted); }
.inventario .inv-tools { align-items: center; }
.inventario .inv-tools button { height: 38px; padding: 0 12px; }
.inv-bag header { background: none !important; padding: 0 !important; border: 0 !important; text-align: left; }
.inv-bag input { padding: 9px 10px; border: 1px solid var(--inv-line); border-radius: 8px; background: var(--inv-bg); color: var(--inv-ink); font-size: 14px; }
.inv-row { margin-bottom: 5px; }


/* ===== css/itens-batalha.css ===== */
/* Itens de batalha */
.bt-items { background: #fff; border: 1px solid #d5dcee; border-radius: 14px; padding: 8px 12px; margin: 10px 0; color: #26304f; }
.bt-items > summary { cursor: pointer; font-weight: 800; font-size: 15px; }
.bi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; margin-top: 8px; }
.bi-box { background: #f1f4fb; border-radius: 12px; padding: 8px 10px; display: flex; flex-direction: column; gap: 5px; }
.bi-box h4 { margin: 6px 0 2px; font-size: 13px; }
.bi-target { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.bi-target select { flex: 1; min-width: 0; }
.bi-chk { font-size: 13px; display: flex; gap: 6px; align-items: center; }
.bi-hint { font-size: 12px; color: #5f6a92; }
.bi-row { display: flex; align-items: center; gap: 6px; background: #fff; border: 1px solid #d5dcee; border-radius: 10px; padding: 3px 8px; font-size: 13px; }
.bi-row.empty { opacity: .55; }
.bi-name { flex: 1; min-width: 0; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bi-qty { font-weight: 800; color: #3b6fe0; }
.bi-row small { color: #5f6a92; font-size: 11px; }
.bi-row input[type=number] { width: 44px; }
.bi-row button { border: none; border-radius: 8px; padding: 3px 10px; cursor: pointer; font-weight: 700; background: #3b6fe0; color: #fff; }
.bi-row button:disabled { background: #b9c3de; cursor: not-allowed; }
.bi-row button.bi-plus { background: #e4e9f6; color: #26304f; padding: 3px 7px; }
html[data-tema="escuro"] .bt-items { background: #252525; border-color: #444; color: #fff; }
html[data-tema="escuro"] .bi-box { background: #2d2d2d; }
html[data-tema="escuro"] .bi-row { background: #252525; border-color: #444; }
html[data-tema="escuro"] .bi-hint, html[data-tema="escuro"] .bi-row small { color: #aaa; }
html[data-tema="escuro"] .bi-row button:disabled { background: #444; color: #888; }
html[data-tema="escuro"] .bi-row button.bi-plus { background: #3a3a3a; color: #fff; }
.bi-in { display:flex; align-items:center; gap:3px; font-size:11px; color:#5f6a92; } html[data-tema="escuro"] .bi-in { color:#aaa; }

/* animação de captura: suspense (bola balança) → verde (capturou) ou vermelho com bola abrindo (escapou) */
.bi-cap { position: fixed; inset: 0; z-index: 9500; pointer-events: all; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; background: rgba(20, 26, 48, .55); }
.bi-cap-ok { animation: biFlashOk 1.3s ease-out forwards; background: radial-gradient(circle, rgba(47,191,113,.6), rgba(47,191,113,.15) 70%); }
.bi-cap-fail { animation: biFlashFail 1.3s ease-out forwards; background: radial-gradient(circle, rgba(230,57,70,.6), rgba(230,57,70,.15) 70%); }
.bi-capball { position: relative; width: 120px; height: 120px; border-radius: 50%; border: 8px solid #26304f; overflow: hidden; background: #fff; box-shadow: 0 0 0 6px rgba(255,255,255,.7), 0 0 40px rgba(255,255,255,.5); }
.bi-capball .bi-top { position: absolute; left: 0; right: 0; top: 0; height: 44%; background: #e63946; }
.bi-capball .bi-bot { position: absolute; left: 0; right: 0; bottom: 0; height: 44%; background: #fff; }
.bi-capball::before { content: ""; position: absolute; left: 0; right: 0; top: 44%; height: 12%; background: #26304f; z-index: 1; }
.bi-capball .bi-btn { position: absolute; left: 50%; top: 50%; width: 30px; height: 30px; margin: -15px 0 0 -15px; border-radius: 50%; background: #fff; border: 6px solid #26304f; z-index: 2; }
.bi-cap-wait .bi-capball { animation: biDrop .5s cubic-bezier(.3,1.5,.5,1) both, biWobble 1.5s .5s ease-in-out both; }
.bi-cap-ok .bi-capball { animation: biGlowOk 1.3s ease-out forwards; }
.bi-cap-fail .bi-capball { animation: biBreak 1.3s ease-out forwards; }
.bi-captext { font-size: 26px; font-weight: 800; color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.6); }
.bi-cap-wait .bi-captext { animation: biDots 1s steps(3, end) infinite; }
@keyframes biDrop { 0% { transform: translateY(-260px) scale(.6); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes biWobble { 0%, 100% { transform: rotate(0); } 12% { transform: rotate(-24deg); } 24% { transform: rotate(20deg); } 34% { transform: rotate(0); } 50% { transform: rotate(-22deg); } 62% { transform: rotate(18deg); } 72% { transform: rotate(0); } 84% { transform: rotate(-14deg); } 92% { transform: rotate(10deg); } }
@keyframes biDots { 0% { opacity: .3; } 100% { opacity: 1; } }
@keyframes biFlashOk { 0%, 30%, 60% { opacity: 1; } 15%, 45%, 75% { opacity: .35; } 100% { opacity: 0; } }
@keyframes biFlashFail { 0% { opacity: 1; } 10%, 30%, 50% { opacity: .35; } 20%, 40%, 60% { opacity: 1; } 100% { opacity: 0; } }
@keyframes biGlowOk { 0% { transform: scale(1); box-shadow: 0 0 0 6px rgba(255,255,255,.7), 0 0 30px rgba(47,191,113,.8); } 40% { transform: scale(1.2); } 100% { transform: scale(1.7); opacity: 0; box-shadow: 0 0 0 20px rgba(47,191,113,.6), 0 0 80px rgba(47,191,113,1); } }
@keyframes biBreak { 0% { transform: translateX(0); } 10% { transform: translateX(-10px) rotate(-6deg); } 20% { transform: translateX(10px) rotate(6deg); } 30% { transform: translateX(-8px); } 40% { transform: translateX(0); } 100% { transform: translateY(40px) scale(.9); opacity: 0; } }
.bi-cap-fail .bi-top { animation: biTopFly 1.3s ease-in forwards; transform-origin: 20% 100%; }
@keyframes biTopFly { 0%, 35% { transform: none; } 100% { transform: translate(-30px, -80px) rotate(-40deg); } }
@media (prefers-reduced-motion: reduce) { .bi-cap, .bi-capball, .bi-top { animation-duration: .4s !important; } }


/* ===== css/regras.css ===== */
/* Janela de regras — classes próprias e seletores fortes para não herdar estilos genéricos (botões, header, label...) */
.rg-wrap { position: fixed; inset: 0; background: rgba(38,48,79,.55); display: flex; align-items: center; justify-content: center; z-index: 9000; padding: 12px; box-sizing: border-box; }
.rg-wrap .rg { background: #fff; color: #26304f; border: 2px solid #ffcb05; border-radius: 16px; width: min(660px, 100%); height: min(720px, 100%); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,.5); box-sizing: border-box; }
.rg-wrap .rg-head { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px 8px; background: transparent; flex: none; }
.rg-wrap .rg-title { font-size: 20px; font-weight: 800; color: #d62839; }
.rg-wrap .rg button.rg-x { background: transparent; border: none; box-shadow: none; color: inherit; font-size: 20px; line-height: 1; width: 36px; height: 36px; padding: 0; cursor: pointer; border-radius: 8px; }
.rg-wrap .rg-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 18px 10px; border-bottom: 1px solid #d5dcee; flex: none; }
.rg-wrap .rg button.rg-tab { flex: 1 1 auto; min-height: 40px; padding: 8px 14px; font-size: 14px; font-weight: 700; line-height: 1.2; white-space: nowrap; border: 1px solid #c5cde4; border-radius: 10px; background: #f1f4fb; color: #26304f; cursor: pointer; box-shadow: none; }
.rg-wrap .rg button.rg-tab.on { background: #3b6fe0; border-color: #3b6fe0; color: #fff; }
.rg-wrap .rg-dot { color: #ffcb05; font-size: 11px; }
.rg-wrap .rg-body { flex: 1; overflow-y: auto; padding: 8px 18px 12px; min-height: 0; }
.rg-wrap .rg-hint { margin: 4px 0 8px; font-size: 13px; color: #5f6a92; }
.rg-wrap .rg-sec { margin-bottom: 14px; }
.rg-wrap .rg-sech { font-weight: 800; font-size: 14px; margin: 6px 0; }
.rg-wrap .rg div.rg-row { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 8px 12px; border-radius: 10px; background: #f1f4fb; margin-bottom: 6px; font-size: 14px; box-sizing: border-box; }
.rg-wrap .rg-lbl { min-width: 0; flex: 1; line-height: 1.3; }
.rg-wrap .rg-def { display: block; color: #5f6a92; font-size: 11px; }
.rg-wrap .rg div.rg-row.changed { background: #fff4cf; box-shadow: inset 0 0 0 1px #e8c04a; }
.rg-wrap .rg input.rg-in { flex: none; width: 76px; padding: 6px 8px; font-size: 15px; box-sizing: border-box; text-align: center; }
.rg-wrap .rg input.rg-chk { width: 22px; height: 22px; padding: 0; }
.rg-wrap .rg-foot { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 12px 18px 16px; border-top: 1px solid #d5dcee; flex: none; }
.rg-wrap .rg button.rg-btn { min-height: 42px; padding: 9px 18px; font-size: 14px; font-weight: 700; border-radius: 10px; border: 1px solid #c5cde4; background: #f1f4fb; color: #26304f; cursor: pointer; box-shadow: none; }
.rg-wrap .rg button.rg-btn.pri { background: #3b6fe0; border-color: #3b6fe0; color: #fff; margin-left: auto; min-width: 110px; }

/* escuro */
html[data-tema="escuro"] .rg-wrap .rg { background: #252525; color: #fff; }
html[data-tema="escuro"] .rg-wrap .rg-tabs, html[data-tema="escuro"] .rg-wrap .rg-foot { border-color: #444; }
html[data-tema="escuro"] .rg-wrap .rg button.rg-tab, html[data-tema="escuro"] .rg-wrap .rg button.rg-btn { background: #333; color: #fff; border-color: #555; }
html[data-tema="escuro"] .rg-wrap .rg button.rg-tab.on, html[data-tema="escuro"] .rg-wrap .rg button.rg-btn.pri { background: #3b6fe0; border-color: #3b6fe0; }
html[data-tema="escuro"] .rg-wrap .rg div.rg-row { background: #2f2f2f; }
html[data-tema="escuro"] .rg-wrap .rg div.rg-row.changed { background: #3a3320; box-shadow: inset 0 0 0 1px #8a6d12; }
html[data-tema="escuro"] .rg-wrap .rg-hint, html[data-tema="escuro"] .rg-wrap .rg-def { color: #aaa; }
html[data-tema="escuro"] .rg-wrap .rg-title { color: #ff6b7a; }

@media (max-width: 520px) { .rg-wrap .rg-tabs, .rg-wrap .rg-head, .rg-wrap .rg-body, .rg-wrap .rg-foot { padding-left: 12px; padding-right: 12px; } .rg-wrap .rg button.rg-tab { flex: 1 1 45%; } }
.rg-wrap .rg-crit-btns { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.rg-wrap .rg-crit-btns .rg-btn { min-height: 38px; padding: 7px 14px; }


/* ===== css/natureza.css ===== */
/* Natureza do treinador + janela de História */
.profile-fields select { background: #ffffff; color: #26304f; border: 1px solid #d5dcee; border-radius: 8px; padding: 7px 9px; font-size: 14px; min-width: 0; width: 100%; outline: none; }
.profile-fields select:focus { border-color: var(--yellow); box-shadow: 0 0 8px rgba(255, 203, 5, .3); }
.nature-box { border: 1px solid #d5dcee; border-left: 4px solid var(--yellow); border-radius: 8px; padding: 8px 10px; background: #f6f8fd; color: #26304f; font-size: 13px; line-height: 1.4; }
.nature-box[hidden] { display: none; }
.nature-box p { margin: 6px 0; }
.nature-box small { color: #5f6a92; display: block; }
.nat-top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.nat-top b { font-size: 15px; }
.nat-kw { background: #e6ecfb; color: #26304f; border-radius: 999px; padding: 1px 9px; font-size: 12px; }
.nat-alt { color: #5f6a92; }
.pf-actions { display: flex; gap: 8px; }
.pf-actions button { padding: 7px 14px; border-radius: 8px; border: 1px solid #c5cde4; background: #f1f4fb; color: #26304f; cursor: pointer; font-size: 14px; }
.pf-actions button.has-story { border-color: var(--yellow); }

.hist-wrap { position: fixed; inset: 0; background: rgba(38, 48, 79, .55); display: flex; align-items: center; justify-content: center; z-index: 9000; padding: 16px; animation: dlgIn .15s ease-out; }
.hist { background: #fff; color: #26304f; border: 2px solid #ffcb05; border-radius: 12px; padding: 14px 16px; width: min(760px, 100%); height: min(640px, 90vh); display: flex; flex-direction: column; gap: 10px; box-shadow: 0 10px 40px rgba(0, 0, 0, .6); animation: dlgPop .18s ease-out; }
.hist-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.hist-top h3 { margin: 0; color: #d62839; font-size: 18px; }
.hist-x { width: 32px; height: 32px; border-radius: 8px; border: 1px solid #c5cde4; background: #f1f4fb; color: #26304f; font-size: 20px; line-height: 1; cursor: pointer; }
.hist-text { flex: 1; width: 100%; box-sizing: border-box; resize: none; padding: 10px 12px; font: inherit; font-size: 15px; line-height: 1.55; border: 1px solid #d5dcee; border-radius: 8px; background: #fff; color: #26304f; outline: none; }
.hist-text:focus { border-color: var(--yellow); box-shadow: 0 0 8px rgba(255, 203, 5, .3); }
.hist-foot { display: flex; justify-content: space-between; gap: 10px; color: #5f6a92; }

html[data-tema="escuro"] .profile-fields select { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .nature-box { background: #262626; border-color: #4a4a4a; border-left-color: var(--yellow); color: #eee; }
html[data-tema="escuro"] .nature-box small, html[data-tema="escuro"] .nat-alt { color: #aaa; }
html[data-tema="escuro"] .nat-kw { background: #3a3a3a; color: #eee; }
html[data-tema="escuro"] .pf-actions button { border-color: #555; background: #333; color: #eee; }
html[data-tema="escuro"] .pf-actions button.has-story { border-color: var(--yellow); }
html[data-tema="escuro"] .hist-wrap { background: rgba(0, 0, 0, .6); }
html[data-tema="escuro"] .hist { background: #242424; color: #eee; }
html[data-tema="escuro"] .hist-top h3 { color: #ffcb05; }
html[data-tema="escuro"] .hist-x { border-color: #555; background: #333; color: #eee; }
html[data-tema="escuro"] .hist-text { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .hist-foot { color: #aaa; }


/* ===== css/tema.css ===== */
/* Tema Poké Center — partes comuns (fontes e animações). Cores: tema-claro.css / tema-escuro.css */
:root {
    --pc-bg: #eef2fb; --pc-card: #ffffff; --pc-ink: #26304f; --pc-muted: #5f6a92; --pc-line: #d5dcee;
    --pc-red: #d62839; --pc-yellow: #ffcb05; --pc-ok: #2fbf71; --pc-warn: #f5a623; --pc-bad: #e63946;
}
body { font-family: "Nunito", "Segoe UI", Arial, sans-serif; }
h1, h2, h3 { font-family: "Baloo 2", "Nunito", "Segoe UI", sans-serif; }

/* botões */
button { transition: transform .12s, box-shadow .12s, background-color .15s; }
button:not(:disabled):active { transform: translateY(1px) scale(.98); }

/* movimento reduzido */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ===== animações de batalha ===== */
.bt-card, .ms-foe { transition: box-shadow .25s, transform .25s, opacity .3s; }
.bt-bar i { transition: width .6s cubic-bezier(.22, 1, .36, 1), background .3s; }

.fx-hit { animation: fxShake .45s ease-in-out, fxRedFlash .7s ease-out; }
.fx-heal { animation: fxHealGlow .7s ease-out; }
@keyframes fxShake { 0%, 100% { transform: translateX(0); } 15% { transform: translateX(-7px) rotate(-.6deg); } 35% { transform: translateX(6px) rotate(.5deg); } 55% { transform: translateX(-4px); } 75% { transform: translateX(3px); } }
@keyframes fxRedFlash { 0% { box-shadow: 0 0 0 4px rgba(230,57,70,.65), 0 0 24px rgba(230,57,70,.6); } 100% { box-shadow: 0 0 0 0 rgba(230,57,70,0); } }
@keyframes fxHealGlow { 0% { box-shadow: 0 0 0 4px rgba(47,191,113,.6), 0 0 24px rgba(47,191,113,.6); } 100% { box-shadow: 0 0 0 0 rgba(47,191,113,0); } }

/* crítico: clarão dourado na tela */
.fx-critflash { position: fixed; inset: 0; z-index: 9000; pointer-events: none; background: radial-gradient(circle, rgba(255,203,5,.55), rgba(255,203,5,0) 70%); animation: fxCrit .8s ease-out forwards; }
@keyframes fxCrit { 0% { opacity: 0; transform: scale(.8); } 20% { opacity: 1; } 100% { opacity: 0; transform: scale(1.3); } }
.bt-crit { display: inline-block; animation: fxPop .5s cubic-bezier(.3, 1.6, .5, 1); }

/* dados "rolam" ao aparecer, um depois do outro */
.die { animation: fxDie .5s cubic-bezier(.3, 1.4, .5, 1) both; }
.die:nth-child(2) { animation-delay: .05s; } .die:nth-child(3) { animation-delay: .1s; } .die:nth-child(4) { animation-delay: .15s; }
.die:nth-child(5) { animation-delay: .2s; } .die:nth-child(6) { animation-delay: .25s; } .die:nth-child(n+7) { animation-delay: .3s; }
@keyframes fxDie { 0% { transform: rotate(-200deg) scale(.2); opacity: 0; } 70% { transform: rotate(12deg) scale(1.15); opacity: 1; } 100% { transform: none; } }
.die.hit { box-shadow: 0 0 10px rgba(47,191,113,.55); }
@keyframes fxPop { 0% { transform: scale(.3); } 100% { transform: scale(1); } }

/* quem está na vez pulsa */
.ms-ini-t tr.cur td { animation: fxTurn 1.8s ease-in-out infinite; }
@keyframes fxTurn { 50% { background: rgba(255, 203, 5, .38); } }
.ms-foe.fighting { animation: fxFight 2.4s ease-in-out infinite; }
@keyframes fxFight { 50% { box-shadow: 0 0 0 2px #ffcb05 inset, 0 0 22px rgba(255, 203, 5, .45); } }

/* HP baixo: barra pulsa de leve */
.bt-card[data-state="low"] .bt-bar i, .ms-foe[data-state="low"] .bt-bar i { animation: fxLow 1.2s ease-in-out infinite; }
@keyframes fxLow { 50% { filter: brightness(1.25); } }

/* entrada suave dos cartões e do registro */
.bt-log-item:first-of-type { animation: fxSlide .35s ease-out; }
@keyframes fxSlide { from { opacity: 0; transform: translateY(-6px); } }

html { color-scheme: light; }
html[data-tema="escuro"] { color-scheme: dark; }
.tema-btn { font-size: 15px; line-height: 1; }

.dlg-wrap { animation: dlgIn .15s ease-out; }
.dlg { animation: dlgPop .18s ease-out; }

.pk-photowrap { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.pk-rmphoto { font-size: 11px; padding: 2px 8px; border-radius: 99px; border: 1px solid currentColor; background: transparent; color: inherit; cursor: pointer; opacity: .75; }
.pk-rmphoto:hover { opacity: 1; }

/* topo: com 5 botões à direita o título encostava; empilha mais cedo */


/* miniaturas (lista de capturados etc.): a imagem inteira cabe no quadrinho, sem estourar nem esticar */
.mini-photo, .ms-ftab-img { overflow: hidden; }
.mini-photo img, .ms-ftab-img img { width: 100%; height: 100%; object-fit: contain; display: block; }

/* ===== menu do topo (☰): tema, imagens, regras e backup ficam numa lista ===== */
.menu-wrap { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); z-index: 60; }
.menu-wrap .menu-btn { position: relative; border: 1px solid rgba(255,255,255,.6); background: rgba(0,0,0,.22); color: #fff; padding: 9px 16px; border-radius: 10px; cursor: pointer; font-weight: 800; font-size: 14px; }
.menu-wrap .menu-btn:hover { background: rgba(0,0,0,.38); }
.menu-wrap:has(.bk-bell) .menu-btn::after { content: "🔔"; position: absolute; top: -9px; right: -7px; font-size: 16px; }
.menu-wrap .backup-bar { display: none; position: absolute; top: calc(100% + 8px); right: 0; transform: none; flex-direction: column; align-items: stretch; gap: 4px; min-width: 230px; margin: 0; padding: 8px; background: #fff; border: 1px solid #d5dcee; border-radius: 14px; box-shadow: 0 12px 30px -8px rgba(0,0,0,.45); }
.menu-wrap.open .backup-bar { display: flex; animation: menuIn .14s ease-out; }
.menu-wrap .backup-bar button { position: relative; width: 100%; text-align: left; padding: 10px 12px; border: none; border-radius: 9px; background: transparent; color: #26304f; font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.menu-wrap .backup-bar button:hover { background: #eef2fb; }
.menu-wrap .backup-bar .bk-bell { top: 50%; right: 10px; margin-top: -9px; }
@keyframes menuIn { from { opacity: 0; transform: translateY(-6px); } }
html[data-tema="escuro"] .menu-wrap .backup-bar { background: #252525; border-color: #444; }
html[data-tema="escuro"] .menu-wrap .backup-bar button { color: #fff; background: transparent; }
html[data-tema="escuro"] .menu-wrap .backup-bar button:hover { background: #3a3a3a; }
@media (max-width: 1300px) { .menu-wrap { top: 12px; transform: none; } .char-bar { position: static; transform: none; justify-content: center; margin-top: 8px; flex-wrap: wrap; } }

/* correções do menu: o cabeçalho cortava a lista; estilos do tema claro/escuro dos botões do topo não valem dentro dela */
body > header { overflow: visible; z-index: 20; }
html:not([data-tema="escuro"]) .menu-wrap .backup-bar button { background: transparent; color: #26304f; border: none; }
html:not([data-tema="escuro"]) .menu-wrap .backup-bar button:hover { background: #eef2fb; }
html[data-tema="escuro"] .menu-wrap .backup-bar button { background: transparent; color: #fff; border: none; }
html[data-tema="escuro"] .menu-wrap .backup-bar button:hover { background: #3a3a3a; }
html:not([data-tema="escuro"]) .menu-wrap .menu-btn, html[data-tema="escuro"] .menu-wrap .menu-btn { color: #fff; background: rgba(0,0,0,.22); }
@media (max-width: 700px) { .menu-wrap { position: relative; top: auto; right: auto; transform: none; margin-top: 8px; display: flex; justify-content: center; } .menu-wrap .backup-bar { right: auto; left: 50%; transform: translateX(-50%); } }

/* campo de pesquisa das listas */
.list-search { width: 100%; box-sizing: border-box; margin: 4px 0 10px; padding: 9px 12px; border-radius: 10px; font-size: 14px; }


/* ===== css/tema-claro.css ===== */
/* Tema CLARO (padrão): vale só quando <html> não tem data-tema="escuro". */
html:not([data-tema="escuro"]) body { background: linear-gradient(180deg, #fff5f3 0, #eef2fb 380px) fixed, #eef2fb; color: var(--pc-ink); }
html:not([data-tema="escuro"]) body > header, html:not([data-tema="escuro"]) body > header h1, html:not([data-tema="escuro"]) body > header label, html:not([data-tema="escuro"]) body > header span { color: #fff; }
html:not([data-tema="escuro"]) .backup-bar button, html:not([data-tema="escuro"]) .char-bar button, html:not([data-tema="escuro"]) .char-bar select { color: #fff; background: rgba(0,0,0,.22); border-color: rgba(255,255,255,.6); }
html:not([data-tema="escuro"]) .backup-bar button:hover, html:not([data-tema="escuro"]) .char-bar button:hover:not(:disabled) { background: rgba(0,0,0,.38); }
html:not([data-tema="escuro"]) .char-bar select option { color: var(--pc-ink); background: #fff; }
html:not([data-tema="escuro"]) .card { background: var(--pc-card); border-color: var(--pc-line); box-shadow: 0 6px 18px -10px rgba(38,48,79,.35); }
html:not([data-tema="escuro"]) .card:hover { box-shadow: 0 10px 24px -10px rgba(38,48,79,.45); }
html:not([data-tema="escuro"]) input, html:not([data-tema="escuro"]) select, html:not([data-tema="escuro"]) textarea { color: var(--pc-ink); background: #fff; border-color: var(--pc-line); }
html:not([data-tema="escuro"]) input::placeholder, html:not([data-tema="escuro"]) textarea::placeholder { color: #8a93b4; }
html:not([data-tema="escuro"]) input:focus-visible, html:not([data-tema="escuro"]) select:focus-visible, html:not([data-tema="escuro"]) textarea:focus-visible, html:not([data-tema="escuro"]) button:focus-visible { outline: 3px solid rgba(59,111,224,.45); outline-offset: 1px; }
html:not([data-tema="escuro"]) .conquistas h2 { color: #9a6a00; }
html:not([data-tema="escuro"]) .inventario h2 { color: #1b8a4a; }
html:not([data-tema="escuro"]) .avistados h2 { color: #0e7f8c; }
html:not([data-tema="escuro"]) .capturados h2 { color: #c2561f; }
html:not([data-tema="escuro"]) .diario h2 { color: #6f3fd1; }
html:not([data-tema="escuro"]) .bt-primary, html:not([data-tema="escuro"]) .ms-ocmd .bt-primary, html:not([data-tema="escuro"]) .ms-ini .bt-primary, html:not([data-tema="escuro"]) .ms-bar .bt-primary, html:not([data-tema="escuro"]) .bt-tools .bt-primary, html:not([data-tema="escuro"]) .bt-danger, html:not([data-tema="escuro"]) .bt-tools .bt-danger, html:not([data-tema="escuro"]) .ms-bar .bt-danger { color: #fff !important; }
html:not([data-tema="escuro"]) .bt-primary { background: #2fa866; }
html:not([data-tema="escuro"]) .bt-danger { background: #d62839; }


/* ===== css/tema-escuro.css ===== */
/* Tema ESCURO: SÓ CORES. Tamanhos, fontes e formatos vêm do tema claro (css base); aqui ficam apenas cores, fundos, bordas e sombras. Gerado de backup_antes_tema/ filtrando as propriedades de cor. */
/* layout.css */
/* cards.css */
html[data-tema="escuro"] .card { background:#252525; border-color: #444; box-shadow:0px 5px 10px rgba(0,0,0,.25); }
html[data-tema="escuro"] .avatar { border-color: #555; }
html[data-tema="escuro"] .progress { background:#3a3a3a; }
html[data-tema="escuro"] .hp { background:#2ecc71; }
html[data-tema="escuro"] .energy { background:#3498db; }
html[data-tema="escuro"] .xp { background:#f1c40f; }
html[data-tema="escuro"] .inventory-form input, html[data-tema="escuro"] .inventory-form textarea { background:#2d2d2d; color:white; border-color: #555; }
html[data-tema="escuro"] .inventory-form input, html[data-tema="escuro"] .inventory-form textarea, html[data-tema="escuro"] #searchItem { background:#2d2d2d; color:#FFF; border-color: #555; }
html[data-tema="escuro"] .inventory-form input:focus, html[data-tema="escuro"] .inventory-form textarea:focus, html[data-tema="escuro"] #searchItem:focus { border-color:#4CAF50; box-shadow:0 0 8px rgba(76,175,80,.35); }
html[data-tema="escuro"] .inventory-form input::placeholder, html[data-tema="escuro"] .inventory-form textarea::placeholder, html[data-tema="escuro"] #searchItem::placeholder { color:#999; }
html[data-tema="escuro"] .card-header { border-bottom-color: #3a3a3a; }
html[data-tema="escuro"] #inventoryCount { background:#303030; border-color: #555; }
html[data-tema="escuro"] .inventory-form { background:#262626; border-color: #3f3f3f; }
html[data-tema="escuro"] .inventory-form button { background:#4CAF50; color:white; }
html[data-tema="escuro"] .inventory-form button:hover { background:#43A047; }
html[data-tema="escuro"] .inventory-card { background:#303030; border-color: #444; }
html[data-tema="escuro"] .edit-btn { background:#2196F3; color:white; }
html[data-tema="escuro"] .delete-btn { background:#d32f2f; color:white; }
html[data-tema="escuro"] .empty-list { color:#999; border-color: #444; }
/* style.css */
html[data-tema="escuro"] body { background:#181818; color:white; }
html[data-tema="escuro"] header { background:#101010; border-bottom-color: #333; }
html[data-tema="escuro"] .die { border-color: #888; }
html[data-tema="escuro"] .die.hit { background: #2e7d32; color: #fff; border-color: #1b5e20; }
html[data-tema="escuro"] .die.miss { background: #eee; color: #777; }
/* sheet.css */
html[data-tema="escuro"] .rank-select { color: #bcbcbc; }
html[data-tema="escuro"] .rank-select select { background: #2d2d2d; color: #fff; border-color: #555; }
html[data-tema="escuro"] .roll-panel { background: #1f1f1f; border-color: #3f3f3f; }
html[data-tema="escuro"] .combined-summary { color: #bcbcbc; }
html[data-tema="escuro"] .chip { background: #303030; border-color: #555; color: #fff; }
html[data-tema="escuro"] .chip b { color: #4CAF50; }
html[data-tema="escuro"] .combined-total { color: #fff; }
html[data-tema="escuro"] .combined-controls { border-bottom-color: #3a3a3a; }
html[data-tema="escuro"] .combined-controls label { color: #bcbcbc; }
html[data-tema="escuro"] .combined-controls input { background: #2d2d2d; color: #fff; border-color: #555; }
html[data-tema="escuro"] .combined-controls button { background: #4CAF50; color: #fff; }
html[data-tema="escuro"] .combined-controls button#clearSelection { background: #444; }
html[data-tema="escuro"] .roll-result:empty::before { color: #777; }
html[data-tema="escuro"] .sheet-group { background: #2b2b2b; border-color: #444; }
html[data-tema="escuro"] .pool { background: #1d1d1d; }
html[data-tema="escuro"] .pool-main strong { color: #4CAF50; }
html[data-tema="escuro"] .pool.over .pool-main strong { color: #ff5252; }
html[data-tema="escuro"] .pool-detail { color: #9f9f9f; }
html[data-tema="escuro"] .bonus-controls button { background: #444; color: #fff; }
html[data-tema="escuro"] .bonus-controls button:hover:not(:disabled) { background: #4CAF50; }
html[data-tema="escuro"] .sheet-table th { color: #9f9f9f; border-bottom-color: #444; }
html[data-tema="escuro"] .sheet-table td { border-bottom-color: #383838; }
html[data-tema="escuro"] .sheet-table tbody tr:hover { background: #333; }
html[data-tema="escuro"] .sheet-table tbody tr.selected { background: #2f3d30; }
html[data-tema="escuro"] .stat-name input[type="checkbox"] { accent-color: #4CAF50; }
html[data-tema="escuro"] .stat-actions button { background: #444; color: #fff; }
html[data-tema="escuro"] .stat-actions button:hover:not(:disabled) { background: #4CAF50; }
html[data-tema="escuro"] .diary-hint { color: #777; }
html[data-tema="escuro"] .diario textarea { background: #2d2d2d; color: #fff; border-color: #555; }
html[data-tema="escuro"] .diario textarea:focus { border-color: #4CAF50; box-shadow: 0 0 8px rgba(76, 175, 80, .35); }
html[data-tema="escuro"] .diario textarea::placeholder { color: #999; }
/* pokemon.css */
html[data-tema="escuro"] .counter { background: #303030; border-color: #555; }
html[data-tema="escuro"] .pokemon-add input { background: #2d2d2d; color: #fff; border-color: #555; }
html[data-tema="escuro"] .pokemon-add input:focus { border-color: #4CAF50; box-shadow: 0 0 8px rgba(76, 175, 80, .35); }
html[data-tema="escuro"] .pokemon-add input::placeholder { color: #999; }
html[data-tema="escuro"] .pokemon-add button { background: #4CAF50; color: #fff; }
html[data-tema="escuro"] .pokemon-add button:hover { background: #43A047; }
html[data-tema="escuro"] .pokemon-item { background: #303030; border-color: #444; }
html[data-tema="escuro"] .pokemon-item.in-team { border-color: #4CAF50; }
html[data-tema="escuro"] .pokemon-actions button, html[data-tema="escuro"] .team-slot button { color: #fff; }
html[data-tema="escuro"] .team-btn { background: #2196F3; }
html[data-tema="escuro"] .remove-btn { background: #d32f2f; }
html[data-tema="escuro"] .team-slot { background: #303030; border-color: #444; }
html[data-tema="escuro"] .team-slot.empty { background: transparent; color: #777; }
html[data-tema="escuro"] .seen-details summary { color: #bcbcbc; }
html[data-tema="escuro"] .seen-chip { background: #303030; border-color: #555; }
html[data-tema="escuro"] .seen-chip button { background: none; color: #999; }
html[data-tema="escuro"] .seen-chip button:hover { color: #ff5252; }
html[data-tema="escuro"] .empty-hint { color: #777; }
/* pokemonSheet.css */
html[data-tema="escuro"] .pk input, html[data-tema="escuro"] .pk select, html[data-tema="escuro"] .pk textarea { background: #2d2d2d; color: #fff; border-color: #555; }
html[data-tema="escuro"] .pk label { color: #9f9f9f; }
html[data-tema="escuro"] .pk button { background: #444; color: #fff; }
html[data-tema="escuro"] .pk button:hover:not(:disabled) { background: #4CAF50; }
html[data-tema="escuro"] .pk-hero { background: linear-gradient(135deg, color-mix(in srgb, var(--c1) 45%, #1c1c1c), color-mix(in srgb, var(--c2) 30%, #1c1c1c)); }
html[data-tema="escuro"] .pk-photo { background: rgba(0, 0, 0, .3); border-color: rgba(255, 255, 255, .3); color: #fff !important; }
html[data-tema="escuro"] .pk-photo small { color: #bbb; }
html[data-tema="escuro"] .pk-badge { background: var(--tc); color: #111; }
html[data-tema="escuro"] .pk-hp { --hp: #2ecc71; }
html[data-tema="escuro"] .pk-hero[data-state="half"] .pk-hp { --hp: #f1c40f; }
html[data-tema="escuro"] .pk-hero[data-state="low"] .pk-hp { --hp: #e74c3c; }
html[data-tema="escuro"] .pk-hero[data-state="ko"] .pk-hp { --hp: #888; }
html[data-tema="escuro"] .pk-bar { background: rgba(0, 0, 0, .45); }
html[data-tema="escuro"] .pk-bar i { background: var(--hp); }
html[data-tema="escuro"] .pk-bar::after { background: rgba(255, 255, 255, .6); }
html[data-tema="escuro"] .pk-hp-msg { color: var(--hp); }
html[data-tema="escuro"] .pk .combined-controls button { background: #4CAF50; }
html[data-tema="escuro"] .pk .combined-controls .pk-gray { background: #444; }
html[data-tema="escuro"] .pk-tabs { border-bottom-color: #444; }
html[data-tema="escuro"] .pk-tabs button { background: none; color: #aaa; border-bottom-color: transparent; }
html[data-tema="escuro"] .pk-tabs button:hover:not(:disabled) { background: #2b2b2b; }
html[data-tema="escuro"] .pk-tabs button.on { color: #fff; border-color: var(--c1); }
html[data-tema="escuro"] .pk-tile { background: #2b2b2b; border-color: #444; border-top-color: var(--c1); }
html[data-tema="escuro"] .pk-tile small { color: #9f9f9f; }
html[data-tema="escuro"] .pk-box { background: #252525; border-color: #444; }
html[data-tema="escuro"] .pk-box h3 { color: #9f9f9f; }
html[data-tema="escuro"] .pk-box summary { color: #bcbcbc; }
html[data-tema="escuro"] .pk-mu > span:first-child { color: #9f9f9f; }
html[data-tema="escuro"] .pk .pk-status .chip.on { background: #4a2a2a; border-color: #ff5252; }
html[data-tema="escuro"] .pk-ok { color: #2ecc71; }
html[data-tema="escuro"] .pk-left b { color: #4CAF50; }
html[data-tema="escuro"] .pk .pk-name label { color: #fff; }
html[data-tema="escuro"] .pk-addmove button { background: #4CAF50; }
html[data-tema="escuro"] .pk-move { background: #2b2b2b; border-color: #444; border-left-color: var(--tc); }
html[data-tema="escuro"] .pk-fx { color: #e0c97a; }
html[data-tema="escuro"] .pk-move summary { color: #9f9f9f; }
html[data-tema="escuro"] .pk-poolbar { background: #252525; border-color: #444; }
html[data-tema="escuro"] .pk-poolbar.over { border-color: #e53935; }
html[data-tema="escuro"] .pk-poolmain strong { color: #4CAF50; }
html[data-tema="escuro"] .pk-poolbar.over .pk-poolmain strong { color: #e53935; }
html[data-tema="escuro"] .pk-pooldetail { color: #9f9f9f; }
html[data-tema="escuro"] .pk-pooldetail b { color: #fff; }
html[data-tema="escuro"] .pk-table tr.over-limit .pk-total { color: #e53935; }
html[data-tema="escuro"] .pk-info { background: #1f1f1f; border-left-color: #4CAF50; color: #ddd; }
html[data-tema="escuro"] .pk-info small { color: #8a8a8a; }
html[data-tema="escuro"] .pk-info-desc { color: #9f9f9f; }
html[data-tema="escuro"] .pk-info-empty { color: #777; }
html[data-tema="escuro"] .pk-custom { background: #4CAF50; color: #fff; }
html[data-tema="escuro"] .pk-catlist { color: #bbb; }
html[data-tema="escuro"] .pk-fxchip { background: #2f2f2f; border-color: #555; color: #ddd; }
html[data-tema="escuro"] .pk-fxchip.ability { border-color: #8e5be8; }
html[data-tema="escuro"] .pk-fxchip.item { border-color: #26c6da; }
html[data-tema="escuro"] .pk-fxchip:has(input:checked) { background: #3b2d5a; border-color: #b388ff; color: #fff; }
html[data-tema="escuro"] .pk-fxchip.item:has(input:checked) { background: #1d4a52; border-color: #4dd0e1; }
html[data-tema="escuro"] .pk-fxchip b { color: #ffcb05; }
html[data-tema="escuro"] .pk-fxchip small { color: #9f9f9f; }
html[data-tema="escuro"] .pk-fxsec { border-top-color: #3a3a3a; }
html[data-tema="escuro"] .pk-fxrow { background: #1f1f1f; }
html[data-tema="escuro"] .pk-fxrow small { color: #9f9f9f; }
html[data-tema="escuro"] .pk-fxrow button { background: #d32f2f; color: #fff; }
html[data-tema="escuro"] .pk-hint { color: #9f9f9f; }
html[data-tema="escuro"] .pk-trait { background: rgba(0, 0, 0, .28); border-left-color: #8e5be8; }
html[data-tema="escuro"] .pk-trait.item { border-left-color: #26c6da; }
html[data-tema="escuro"] .pk-trait label { color: #ccc; }
html[data-tema="escuro"] .pk-trait .pk-info { background: rgba(0, 0, 0, .25); }
html[data-tema="escuro"] .pk-critbar { background: #252525; border-color: #444; }
html[data-tema="escuro"] .pk-critbar b { color: #ffcb05; }
html[data-tema="escuro"] .pk-critbar small { color: #9f9f9f; }
html[data-tema="escuro"] .pk-ctrow { background: #1f1f1f; }
html[data-tema="escuro"] .sfx-row { background: #3a2222; border-left-color: #ff5252; }
html[data-tema="escuro"] .sfx-blocked { background: #4a2a2a; color: #ff8a80; }
/* customDice.css */
html[data-tema="escuro"] .cd-toggle { background: #4CAF50; color: #fff; box-shadow: 0 6px 16px rgba(0, 0, 0, .5); }
html[data-tema="escuro"] .cd-panel { background: #252525; border-color: #555; box-shadow: 0 10px 28px rgba(0, 0, 0, .6); color: #fff; }
html[data-tema="escuro"] .cd-panel header button { background: none; color: #aaa; }
html[data-tema="escuro"] .cd-quick button { background: #444; color: #fff; }
html[data-tema="escuro"] .cd-quick button:hover { background: #4CAF50; }
html[data-tema="escuro"] .cd-panel label { color: #9f9f9f; }
html[data-tema="escuro"] .cd-panel input[type="number"], html[data-tema="escuro"] .cd-panel select { background: #2d2d2d; color: #fff; border-color: #555; }
html[data-tema="escuro"] .cd-panel .cd-check { color: #ccc; }
html[data-tema="escuro"] .cd-roll { background: #4CAF50; color: #fff; }
html[data-tema="escuro"] .cd-roll:hover { background: #43A047; }
html[data-tema="escuro"] .cd-expr { color: #9f9f9f; }
html[data-tema="escuro"] .cd-total b { color: #4CAF50; }
html[data-tema="escuro"] .cd-total small { color: #888; }
html[data-tema="escuro"] .die.cd-neutral { background: #3a3a3a; color: #fff; border-color: #666; }
html[data-tema="escuro"] .cd-history { color: #888; border-top-color: #3a3a3a; }
/* profile.css */
html[data-tema="escuro"] body { background: radial-gradient(circle at 15% 0%, #2a1f3d 0, #181818 45%) fixed, #181818; }
html[data-tema="escuro"] body > header { background: linear-gradient(135deg, #b71c1c 0%, #ee4b4b 45%, #ff8a50 100%); border-bottom-color: var(--yellow); }
html[data-tema="escuro"] body > header h1 { text-shadow: 0 2px 6px rgba(0, 0, 0, .45); }
html[data-tema="escuro"] body > header h1::before { color: var(--yellow); }
html[data-tema="escuro"] .card { border-top-color: var(--accent, #555); }
html[data-tema="escuro"] .card:hover { box-shadow: 0 8px 20px rgba(0, 0, 0, .4); }
html[data-tema="escuro"] .card h2 { color: var(--accent, #fff); }
html[data-tema="escuro"] .personagem { --accent: var(--red); background: linear-gradient(160deg, #2e2326, #252525 55%); }
html[data-tema="escuro"] .conquistas { --accent: var(--yellow); background: linear-gradient(160deg, #2e2a1c, #252525 55%); }
html[data-tema="escuro"] .atributos { --accent: var(--blue); }
html[data-tema="escuro"] .inventario { --accent: var(--green); }
html[data-tema="escuro"] .diario { --accent: var(--purple); }
html[data-tema="escuro"] .capturados { --accent: #ff8a50; }
html[data-tema="escuro"] .avistados { --accent: #26c6da; }
html[data-tema="escuro"] .equipe { --accent: #ec407a; }
html[data-tema="escuro"] .avatar { background: #1b1b1b; border-color: var(--red); box-shadow: 0 0 14px rgba(238, 75, 75, .35); }
html[data-tema="escuro"] #avatarEmpty small { color: #999; }
html[data-tema="escuro"] .avatar:hover { border-color: var(--yellow); }
html[data-tema="escuro"] .profile-fields label, html[data-tema="escuro"] .hp-edit label { color: #aaa; }
html[data-tema="escuro"] .profile-fields input, html[data-tema="escuro"] .hp-box input[type="number"], html[data-tema="escuro"] .ach input, html[data-tema="escuro"] .ach textarea, html[data-tema="escuro"] #achTitle, html[data-tema="escuro"] #moneyDelta { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .profile-fields input:focus, html[data-tema="escuro"] .hp-box input:focus, html[data-tema="escuro"] .ach input:focus, html[data-tema="escuro"] .ach textarea:focus, html[data-tema="escuro"] #achTitle:focus { border-color: var(--yellow); box-shadow: 0 0 8px rgba(255, 203, 5, .3); }
html[data-tema="escuro"] .money-row span { color: var(--yellow); }
html[data-tema="escuro"] .money-row button, html[data-tema="escuro"] .hp-box button, html[data-tema="escuro"] .avatar-tools button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .hp-top b { color: #2ecc71; }
html[data-tema="escuro"] .hp-box .progress { border-color: #444; }
html[data-tema="escuro"] .hp-box .bar { background: linear-gradient(90deg, #27ae60, #2ecc71); }
html[data-tema="escuro"] #profileCard[data-hp="half"] .bar { background: linear-gradient(90deg, #f39c12, #f1c40f); }
html[data-tema="escuro"] #profileCard[data-hp="low"] .bar, html[data-tema="escuro"] #profileCard[data-hp="ko"] .bar { background: linear-gradient(90deg, #c0392b, #e74c3c); }
html[data-tema="escuro"] #profileCard[data-hp="low"] .hp-top b, html[data-tema="escuro"] #profileCard[data-hp="ko"] .hp-top b { color: #e74c3c; }
html[data-tema="escuro"] #profileCard[data-hp="half"] .hp-top b { color: #f1c40f; }
html[data-tema="escuro"] #hpMsg { color: #9f9f9f; }
html[data-tema="escuro"] .ach-file { background: #3a3a3a; }
html[data-tema="escuro"] .ach-file:hover { background: #4a4a4a; }
html[data-tema="escuro"] #achAdd { background: var(--yellow); color: #222; }
html[data-tema="escuro"] #achCount { background: #303030; border-color: #555; }
html[data-tema="escuro"] .ach { background: #2f2f2f; border-color: #484848; }
html[data-tema="escuro"] .ach:hover { border-color: var(--yellow); box-shadow: 0 6px 14px rgba(255, 203, 5, .18); }
html[data-tema="escuro"] .ach-img { background: #1b1b1b; border-color: var(--yellow); box-shadow: 0 0 10px rgba(255, 203, 5, .3); }
html[data-tema="escuro"] .ach-x { background: #d32f2f; color: #fff; }
html[data-tema="escuro"] .conquistas .empty-hint { color: #999; border-color: #444; }
html[data-tema="escuro"] .equipe { --accent: #ec407a; }
html[data-tema="escuro"] .team-slot { border-color: var(--tc, #444); }
html[data-tema="escuro"] .team-photo { background: radial-gradient(circle, color-mix(in srgb, var(--tc, #555) 45%, #1b1b1b), #1b1b1b); }
html[data-tema="escuro"] .team-info small { color: #9f9f9f; }
html[data-tema="escuro"] .mini-photo { background: #1b1b1b; border-color: var(--tc, #555); }
html[data-tema="escuro"] .backup-bar button { border-color: rgba(255, 255, 255, .5); background: rgba(0, 0, 0, .3); color: #fff; }
html[data-tema="escuro"] .backup-bar button:hover { background: rgba(0, 0, 0, .5); }
html[data-tema="escuro"] .battle-btn { background: linear-gradient(135deg, #c62828, #ef5350); color: #fff; }
html[data-tema="escuro"] .char-bar select { background: rgba(0, 0, 0, .35); color: #fff; border-color: rgba(255, 255, 255, .5); }
html[data-tema="escuro"] .char-bar select option { color: #000; }
html[data-tema="escuro"] .char-bar button { border-color: rgba(255, 255, 255, .5); background: rgba(0, 0, 0, .3); color: #fff; }
html[data-tema="escuro"] .char-bar button:hover:not(:disabled) { background: rgba(0, 0, 0, .5); }
/* battle.css */
html[data-tema="escuro"] .bt-top { background: linear-gradient(135deg, #5b1f1f, #2a1f3d); border-color: #7a3a3a; }
html[data-tema="escuro"] .bt-round b { color: #ffcb05; }
html[data-tema="escuro"] .bt-tools button, html[data-tema="escuro"] .bt-add button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .bt-tools .bt-primary { background: #4CAF50; }
html[data-tema="escuro"] .bt-tools .bt-danger { background: #b23a3a; }
html[data-tema="escuro"] .bt-apr { color: #ccc; }
html[data-tema="escuro"] .bt-add { background: #252525; border-color: #444; }
html[data-tema="escuro"] .bt-add input { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .bt-add small { color: #888; }
html[data-tema="escuro"] .bt-log { background: #252525; border-color: #444; }
html[data-tema="escuro"] .bt-log h3 { color: #ffcb05; }
html[data-tema="escuro"] .bt-log-item { border-bottom-color: #353535; }
html[data-tema="escuro"] .bt-log-item small { color: #9f9f9f; }
html[data-tema="escuro"] .bt-big { color: #ffcb05; }
html[data-tema="escuro"] .bt-crit { color: #ffcb05; }
html[data-tema="escuro"] .bt-card { background: #252525; border-color: var(--tc, #555); }
html[data-tema="escuro"] .bt-card.foe { --tc: #b23a3a; background: linear-gradient(160deg, #2e2020, #252525 60%); }
html[data-tema="escuro"] .bt-photo { background: #1b1b1b; border-color: var(--tc); }
html[data-tema="escuro"] .bt-init { color: #bbb; }
html[data-tema="escuro"] .bt-init input { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .bt-card button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .bt-x { background: #b23a3a !important; }
html[data-tema="escuro"] .bt-bar { background: #3a3a3a; }
html[data-tema="escuro"] .bt-bar i { background: #2ecc71; }
html[data-tema="escuro"] .bt-card[data-state="half"] .bt-bar i { background: #f1c40f; }
html[data-tema="escuro"] .bt-card[data-state="low"] .bt-bar i, html[data-tema="escuro"] .bt-card[data-state="ko"] .bt-bar i { background: #e74c3c; }
html[data-tema="escuro"] .bt-hp-msg { color: #9f9f9f; }
html[data-tema="escuro"] .bt-amt input { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .bt-actions { color: #ccc; }
html[data-tema="escuro"] .bt-act { background: #2e7d32 !important; }
html[data-tema="escuro"] .bt-act.used { background: #555 !important; color: #999; }
html[data-tema="escuro"] .bt-move { background: #1f1f1f; border-left-color: var(--tc); }
html[data-tema="escuro"] .bt-mname small { color: #9f9f9f; }
html[data-tema="escuro"] .bt-card header { background: none; }
html[data-tema="escuro"] .bt-who-fights { background: #252525; border-color: #444; }
html[data-tema="escuro"] .bt-who-fights summary { color: #ffcb05; }
html[data-tema="escuro"] .bt-pick { border-color: #555; background: #2f2f2f; color: #ddd; }
html[data-tema="escuro"] .bt-pick.on { border-color: #4CAF50; background: #1f3a22; color: #fff; }
html[data-tema="escuro"] .bt-pick-img { background: #1b1b1b; }
html[data-tema="escuro"] .bt-def { background: #1f1f1f; }
html[data-tema="escuro"] .bt-def small { color: #9f9f9f; }
html[data-tema="escuro"] .bt-defs button b { color: #ffcb05; }
html[data-tema="escuro"] .bt-sect { color: #9f9f9f; }
html[data-tema="escuro"] .bt-link { background: none !important; color: #8ab4ff !important; }
html[data-tema="escuro"] .bt-buff { background: #1f1f1f; border-color: transparent; }
html[data-tema="escuro"] .bt-buff small { color: #9f9f9f; }
html[data-tema="escuro"] .bt-buff.up { border-color: #4CAF50; }
html[data-tema="escuro"] .bt-buff.up b { color: #66bb6a; }
html[data-tema="escuro"] .bt-buff.down { border-color: #e53935; }
html[data-tema="escuro"] .bt-buff.down b { color: #ef5350; }
html[data-tema="escuro"] .bt-actions { color: #ccc; background: #1f1f1f; }
html[data-tema="escuro"] .bt-actions b { color: #ffcb05; }
html[data-tema="escuro"] .bt-actions small { color: #9f9f9f; }
html[data-tema="escuro"] .bt-actions small b { color: #ffcb05; }
/* field.css */
html[data-tema="escuro"] .fx-rain { background: rgba(40, 70, 120, .10); }
html[data-tema="escuro"] .fx-rain i:nth-child(1) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='90'%20height='140'%3E%3Cg%20stroke='rgb(175%2C210%2C255)'%20stroke-opacity='.8'%20stroke-width='1.4'%20stroke-linecap='round'%3E%3Cpath%20d='M10%208l-3%2020M52%2050l-3%2020M80%20100l-3%2020M30%2092l-3%2016'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 90px 140px; }
html[data-tema="escuro"] .fx-rain i:nth-child(2) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='90'%20height='140'%3E%3Cg%20stroke='rgb(175%2C210%2C255)'%20stroke-opacity='.8'%20stroke-width='1.4'%20stroke-linecap='round'%3E%3Cpath%20d='M10%208l-3%2020M52%2050l-3%2020M80%20100l-3%2020M30%2092l-3%2016'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 135px 210px; }
html[data-tema="escuro"] .fx-typhoon { background: rgba(15, 50, 110, .24); }
html[data-tema="escuro"] .fx-typhoon i:nth-child(1) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='90'%20height='140'%3E%3Cg%20stroke='rgb(175%2C210%2C255)'%20stroke-opacity='.8'%20stroke-width='1.4'%20stroke-linecap='round'%3E%3Cpath%20d='M10%208l-3%2020M52%2050l-3%2020M80%20100l-3%2020M30%2092l-3%2016'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 70px 109px; }
html[data-tema="escuro"] .fx-typhoon i:nth-child(2) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='200'%20height='110'%3E%3Cpath%20d='M0%2030Q50%200%20100%2030T200%2030V110H0Z'%20fill='rgb(40%2C110%2C200)'%20fill-opacity='.35'/%3E%3C/svg%3E") repeat-x 0 0 / 200px 110px; }
html[data-tema="escuro"] .fx-hail { background: rgba(170, 215, 255, .09); }
html[data-tema="escuro"] .fx-hail i:nth-child(1) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='120'%20height='160'%3E%3Cg%20fill='rgb(235%2C248%2C255)'%20fill-opacity='.85'%3E%3Ccircle%20cx='14'%20cy='20'%20r='2.6'/%3E%3Ccircle%20cx='70'%20cy='52'%20r='3.2'/%3E%3Ccircle%20cx='104'%20cy='96'%20r='2.4'/%3E%3Ccircle%20cx='38'%20cy='120'%20r='3'/%3E%3Ccircle%20cx='88'%20cy='146'%20r='2'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 120px 160px; }
html[data-tema="escuro"] .fx-hail i:nth-child(2) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='120'%20height='160'%3E%3Cg%20fill='rgb(235%2C248%2C255)'%20fill-opacity='.85'%3E%3Ccircle%20cx='14'%20cy='20'%20r='2.6'/%3E%3Ccircle%20cx='70'%20cy='52'%20r='3.2'/%3E%3Ccircle%20cx='104'%20cy='96'%20r='2.4'/%3E%3Ccircle%20cx='38'%20cy='120'%20r='3'/%3E%3Ccircle%20cx='88'%20cy='146'%20r='2'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 180px 240px; }
html[data-tema="escuro"] .fx-sandstorm { background: rgba(205, 150, 70, .17); }
html[data-tema="escuro"] .fx-sandstorm i:nth-child(1) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='220'%20height='90'%3E%3Cg%20stroke='rgb(225%2C180%2C100)'%20stroke-opacity='.75'%20stroke-width='1.6'%20stroke-linecap='round'%3E%3Cpath%20d='M6%2014h58M110%2038h92M30%2068h74M160%2080h44'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 220px 90px; }
html[data-tema="escuro"] .fx-sandstorm i:nth-child(2) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='220'%20height='90'%3E%3Cg%20stroke='rgb(225%2C180%2C100)'%20stroke-opacity='.75'%20stroke-width='1.6'%20stroke-linecap='round'%3E%3Cpath%20d='M6%2014h58M110%2038h92M30%2068h74M160%2080h44'/%3E%3C/g%3E%3C/svg%3E") 0 30px / 330px 135px; }
html[data-tema="escuro"] .fx-wind { background: rgba(200, 225, 245, .06); }
html[data-tema="escuro"] .fx-wind i:nth-child(1) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='260'%20height='120'%3E%3Cg%20fill='none'%20stroke='rgb(235%2C245%2C255)'%20stroke-opacity='.8'%20stroke-width='1.5'%20stroke-linecap='round'%3E%3Cpath%20d='M10%2022q35-12%2070%200t60%200'/%3E%3Cpath%20d='M140%2070q35-12%2070%200t40%200'/%3E%3Cpath%20d='M30%20102q25-8%2050%200'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 260px 120px; }
html[data-tema="escuro"] .fx-wind i:nth-child(2) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='260'%20height='120'%3E%3Cg%20fill='none'%20stroke='rgb(235%2C245%2C255)'%20stroke-opacity='.8'%20stroke-width='1.5'%20stroke-linecap='round'%3E%3Cpath%20d='M10%2022q35-12%2070%200t60%200'/%3E%3Cpath%20d='M140%2070q35-12%2070%200t40%200'/%3E%3Cpath%20d='M30%20102q25-8%2050%200'/%3E%3C/g%3E%3C/svg%3E") 0 40px / 390px 180px; }
html[data-tema="escuro"] .fx-sun { background: radial-gradient(circle at 100% 0%, rgba(255, 214, 90, .26), transparent 55%); }
html[data-tema="escuro"] .fx-sun i:nth-child(1), html[data-tema="escuro"] .fx-harsh i:nth-child(1) { background: repeating-conic-gradient(rgba(255, 230, 120, .16) 0 7deg, transparent 7deg 18deg); }
html[data-tema="escuro"] .fx-harsh { background: radial-gradient(circle at 100% 0%, rgba(255, 120, 30, .34), transparent 60%); }
html[data-tema="escuro"] .fx-harsh i:nth-child(1) { background: repeating-conic-gradient(rgba(255, 150, 60, .2) 0 7deg, transparent 7deg 18deg); }
html[data-tema="escuro"] .fx-harsh i:nth-child(2) { background: linear-gradient(to top, rgba(255, 70, 0, .3), transparent); }
html[data-tema="escuro"] .fx-fog { background: rgba(210, 220, 232, .10); box-shadow: inset 0 0 170px rgba(18, 24, 34, .5); }
html[data-tema="escuro"] .fx-fog i { background: radial-gradient(closest-side, rgba(235, 240, 246, .30), transparent); }
html[data-tema="escuro"] .fx-mud { background: linear-gradient(to top, rgba(110, 70, 30, .34), transparent 28%); }
html[data-tema="escuro"] .fx-fire { background: linear-gradient(to top, rgba(255, 90, 0, .38), transparent 42%); }
html[data-tema="escuro"] .fx-fire i:nth-child(1) { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='160'%20height='240'%3E%3Cg%20fill='rgb(255%2C150%2C40)'%20fill-opacity='.85'%3E%3Ccircle%20cx='20'%20cy='30'%20r='2'/%3E%3Ccircle%20cx='84'%20cy='90'%20r='2.6'/%3E%3Ccircle%20cx='130'%20cy='160'%20r='1.8'/%3E%3Ccircle%20cx='50'%20cy='200'%20r='2.2'/%3E%3Ccircle%20cx='110'%20cy='20'%20r='1.6'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 160px 240px; }
html[data-tema="escuro"] .fx-poles { box-shadow: inset 0 0 100px rgba(255, 220, 60, .26); }
html[data-tema="escuro"] .bt-field { background: #252525; border-color: #444; }
html[data-tema="escuro"] .fld-row select { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .fld-chip { background: #333; border-color: transparent; }
html[data-tema="escuro"] .fld-chip.on { background: #3b3322; border-color: #ffcb05; }
html[data-tema="escuro"] .fld-vis { color: #aaa; }
html[data-tema="escuro"] .fld-fx { background: #2d2d2d; border-left-color: #ffcb05; }
html[data-tema="escuro"] .fld-fx span { color: #bbb; }
html[data-tema="escuro"] .bt-field.w-sun, html[data-tema="escuro"] .bt-field.w-harsh { border-color: #c99a2a; }
html[data-tema="escuro"] .bt-field.w-rain, html[data-tema="escuro"] .bt-field.w-typhoon { border-color: #3a6aa8; }
html[data-tema="escuro"] .bt-field.w-sandstorm { border-color: #a8742e; }
html[data-tema="escuro"] .bt-field.w-hail, html[data-tema="escuro"] .bt-field.w-wind { border-color: #8fb4cc; }
html[data-tema="escuro"] .tm-chip { background: rgba(0, 0, 0, .35); border-color: #666; }
html[data-tema="escuro"] .tm-chip.last { border-color: #ff8a3d; }
html[data-tema="escuro"] .tm-chip.tm-w { border-color: #6ab7ff; }
html[data-tema="escuro"] .tm-chip small { color: #aaa; }
html[data-tema="escuro"] .tm-chip b { color: #ffcb05; }
html[data-tema="escuro"] .tm-chip button, html[data-tema="escuro"] .tm-add button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .tm-add input { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
/* master.css */
html[data-tema="escuro"] .ms-top { background: linear-gradient(135deg, #2a1f3d, #4a1f3d); border-color: #7a3a7a; }
html[data-tema="escuro"] .ms-tabs button, html[data-tema="escuro"] .ms-bar > button, html[data-tema="escuro"] .ms-new button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .ms-tabs button.on { background: #ffcb05; color: #222; }
html[data-tema="escuro"] .ms-bar { background: #252525; border-color: #444; }
html[data-tema="escuro"] .ms-bar .bt-primary { background: #4CAF50; }
html[data-tema="escuro"] .ms-new input { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .ms-foe { background: #252525; border-color: var(--tc, #b23a3a); }
html[data-tema="escuro"] .ms-foe.fighting { box-shadow: 0 0 0 2px #ffcb05 inset, 0 0 16px rgba(255, 203, 5, .25); }
html[data-tema="escuro"] .ms-foe button, html[data-tema="escuro"] .ms-card button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .ms-foe input, html[data-tema="escuro"] .ms-foe select, html[data-tema="escuro"] .ms-foe textarea, html[data-tema="escuro"] .ms-card input, html[data-tema="escuro"] .ms-card select, html[data-tema="escuro"] .ms-card textarea { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .ms-photo { border-color: var(--tc) !important; background: #1b1b1b !important; }
html[data-tema="escuro"] .ms-init { color: #bbb; }
html[data-tema="escuro"] .ms-fight.on { background: #ffcb05 !important; color: #222 !important; }
html[data-tema="escuro"] .ms-status .chip.on { background: #4a2a2a; border-color: #ff5252; }
html[data-tema="escuro"] .ms-move { border-left-color: var(--tc); background: #2d2d2d; }
html[data-tema="escuro"] .ms-move-edit { color: #aaa; }
html[data-tema="escuro"] .ms-edit summary { color: #ffcb05; }
html[data-tema="escuro"] .ms-stats label, html[data-tema="escuro"] .ms-types label, html[data-tema="escuro"] .ms-notes { color: #aaa; }
html[data-tema="escuro"] .ms-sect { color: #bbb; }
html[data-tema="escuro"] .ms-sect small { color: #888; }
html[data-tema="escuro"] .ms-mod { border-left-color: var(--tc) !important; }
html[data-tema="escuro"] .ms-mod.up { background: #4a2a2a !important; }
html[data-tema="escuro"] .ms-mod.dn { background: #1f3a2a !important; }
html[data-tema="escuro"] .ms-mod.im { background: #333 !important; }
html[data-tema="escuro"] .ms-scene { background: linear-gradient(135deg, #2b2a1a, #252525); border-color: #c9a52a; }
html[data-tema="escuro"] .ms-scene img { background: #1b1b1b; }
html[data-tema="escuro"] .ms-scene h3 { color: #ffcb05; }
html[data-tema="escuro"] .ms-scene p { color: #ddd; }
html[data-tema="escuro"] .ms-scene small { color: #aaa; }
html[data-tema="escuro"] .ms-scene > button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .ms-card { background: #252525; border-color: #4a4a4a; }
html[data-tema="escuro"] .ms-card.scene { border-color: #ffcb05; }
html[data-tema="escuro"] .ms-cimg { background: #1b1b1b !important; }
html[data-tema="escuro"] .ms-fxtxt { color: #aaa; }
html[data-tema="escuro"] .ms-chip { background: #333; color: #ddd; }
html[data-tema="escuro"] .ms-chip.ab { background: #3a3326; color: #ffcb05; }
html[data-tema="escuro"] .ms-attrs { color: #aaa; }
html[data-tema="escuro"] .ms-pts { background: #1b1b1b; color: #bbb; }
html[data-tema="escuro"] .ms-pts b { color: #ffcb05; }
html[data-tema="escuro"] .ms-pts .over b { color: #ff6b6b; }
html[data-tema="escuro"] .ms-pts small { color: #888; }
html[data-tema="escuro"] .ms-pick label { color: #aaa; }
html[data-tema="escuro"] .ms-pick select { background: #1f1f1f; color: #fff; border-color: #5a5a5a; }
html[data-tema="escuro"] .ms-pick button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .ms-count { color: #aaa; }
html[data-tema="escuro"] .ms-viewsw button.on { background: #ffcb05; color: #222; }
html[data-tema="escuro"] .ms-ftab { border-color: #444 !important; background: #252525 !important; color: #ddd; }
html[data-tema="escuro"] .ms-ftab.fight { border-color: #ffcb05 !important; }
html[data-tema="escuro"] .ms-ftab.on { background: #353535 !important; border-color: var(--tc) !important; box-shadow: 0 0 0 2px var(--tc) inset; color: #fff; }
html[data-tema="escuro"] .ms-ftab-img { background: #1b1b1b; }
html[data-tema="escuro"] .ms-ftab-txt small { color: #aaa; }
html[data-tema="escuro"] .ms-ftab > i { background: #4CAF50; }
html[data-tema="escuro"] .ms-undo button, html[data-tema="escuro"] .bt-tools button[data-undo] { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .ms-order { background: #252525; border-color: #ffcb05; }
html[data-tema="escuro"] .ms-order > b { color: #ffcb05; }
html[data-tema="escuro"] .ms-ochip { border-color: #444 !important; background: #2f2f2f !important; color: #ddd; }
html[data-tema="escuro"] .ms-ochip small { background: #444; }
html[data-tema="escuro"] .ms-ochip.cur { border-color: #ffcb05 !important; background: #5a4a00 !important; color: #fff; box-shadow: 0 0 10px rgba(255, 203, 5, .5); }
html[data-tema="escuro"] .ms-oarrow { color: #777; }
html[data-tema="escuro"] .ms-ocmd button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .ms-ocmd .bt-primary { background: #4CAF50; }
html[data-tema="escuro"] .ms-enc { background: #252525; border-color: #444; }
html[data-tema="escuro"] .ms-enc summary { color: #ffcb05; }
html[data-tema="escuro"] .ms-enc-add input { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .ms-enc button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .ms-enc-item { border-top-color: #333; }
html[data-tema="escuro"] .ms-enc-item small { color: #999; }
html[data-tema="escuro"] .ms-dup { color: #aaa; }
html[data-tema="escuro"] .ms-dup input { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .ms-dis { color: #ccc; }
html[data-tema="escuro"] .ms-dis select { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .ms-ini { background: #252525; border-color: #ffcb05; }
html[data-tema="escuro"] .ms-ini summary { color: #ffcb05; }
html[data-tema="escuro"] .ms-ini summary b { color: #fff; }
html[data-tema="escuro"] .ms-ini input { background: #1f1f1f; color: #fff; border-color: #4a4a4a; }
html[data-tema="escuro"] .ms-ini button { background: #3a3a3a; color: #fff; }
html[data-tema="escuro"] .ms-ini .bt-primary { background: #4CAF50; }
html[data-tema="escuro"] .ms-ini-t th { color: #999; }
html[data-tema="escuro"] .ms-ini-t td { border-top-color: #333; }
html[data-tema="escuro"] .ms-ini-t tr.cur td { background: rgba(255, 203, 5, .16); }
html[data-tema="escuro"] .ms-ini-t tr.cur .ms-turnbtn { background: #ffcb05; color: #222; }
html[data-tema="escuro"] .ms-ini-t tr.foe td:nth-child(2) { color: #ff8a80; }
html[data-tema="escuro"] .ms-link { background: none !important; color: #8ab4ff !important; }
html[data-tema="escuro"] .ms-ini-foot button { background: #5a2a2a; }
html[data-tema="escuro"] .ms-ini-pr select.on { background: #ffe9a8; color: #000; }
html[data-tema="escuro"] .ms-ini-t tr.pr td:first-child { box-shadow: inset 3px 0 0 #f5a623; }
html[data-tema="escuro"] .ms-tag { background: #ffe9a8; color: #000; }
/* dialog.css */
html[data-tema="escuro"] .dlg-wrap { background: rgba(0, 0, 0, .6); }
html[data-tema="escuro"] .dlg { background: #242424; color: #eee; border-color: #ffcb05; box-shadow: 0 10px 40px rgba(0, 0, 0, .6); }
html[data-tema="escuro"] .dlg h3 { color: #ffcb05; }
html[data-tema="escuro"] .dlg-btns button { border-color: #555; background: #333; color: #eee; }
html[data-tema="escuro"] .dlg-btns button.pri { background: #3b6fe0; border-color: #3b6fe0; color: #fff; }
html[data-tema="escuro"] .dlg-btns button.danger { background: #ee4b4b; border-color: #ee4b4b; color: #fff; }
html[data-tema="escuro"] .dlg-btns button:focus-visible { outline-color: #ffcb05; }
html[data-tema="escuro"] .bt-tg { color: #aaa; }
html[data-tema="escuro"] .bt-held { color: #aaa; }