/* ── Pokédex ─────────────────────────────────────────────────────────────── */
.dex-search-bar { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.dex-search-bar .field { flex:1; min-width:200px; margin:0; }
.dex-count { color:var(--text-2); font-size:0.9rem; margin-bottom:12px; }
.dex-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:12px; }
.dex-card {
    border:1.5px solid var(--border); border-radius:var(--radius-sm); background:var(--surface);
    padding:12px 10px; text-align:center; cursor:pointer; transition:transform .15s,border-color .15s;
}
.dex-card:hover { transform:translateY(-2px); border-color:var(--blue); }
.dex-card img { width:72px; height:72px; object-fit:contain; image-rendering:pixelated; }
.dex-card strong { display:block; font-size:0.9rem; margin-top:6px; }
.dex-id { font-size:0.72rem; color:var(--text-2); font-weight:700; }
.dex-name-en { font-size:0.75rem; color:var(--text-2); }
.dex-loading,.dex-empty { text-align:center; color:var(--text-2); padding:32px; grid-column:1/-1; }
.dex-load-more { display:block; margin:16px auto 0; }
.dex-modal-overlay {
    position:fixed; inset:0; z-index:1150; background:rgba(10,14,30,.72);
    display:grid; place-items:center; padding:20px; backdrop-filter:blur(4px);
}
.dex-modal-overlay.hidden { display:none; }
.dex-modal {
    width:min(560px,100%); max-height:88vh; overflow:auto;
    background:var(--surface); border-radius:var(--radius); border:1.5px solid var(--border);
    box-shadow:var(--shadow);
}
.dex-modal-head { display:flex; justify-content:space-between; align-items:center; padding:16px 20px; border-bottom:1.5px solid var(--border); }
.dex-modal-body { padding:20px; }
.dex-detail-head { display:flex; gap:16px; align-items:center; margin-bottom:16px; }
.dex-detail-head img { width:120px; height:120px; image-rendering:pixelated; }
.dex-detail-id { font-weight:800; color:var(--text-2); }
.dex-types { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.type-pill { padding:4px 10px; border-radius:999px; font-size:0.78rem; font-weight:800; color:#fff; }
.type-normal{background:#9aa0a8}.type-fire{background:#e25822}.type-water{background:#4d90d5}
.type-grass{background:#5dac3d}.type-electric{background:#e0c025}.type-ice{background:#51c5c7}
.type-fighting{background:#d84258}.type-poison{background:#a855c8}.type-ground{background:#c9a227}
.type-flying{background:#7aa7de}.type-psychic{background:#e870a8}.type-bug{background:#9cbf30}
.type-rock{background:#b8a05a}.type-ghost{background:#6f5a9e}.type-dragon{background:#5b3cbe}
.type-dark{background:#6a5a4a}.type-steel{background:#9eb0bd}.type-fairy{background:#e89ac8}
.dex-flavor { color:var(--text-2); line-height:1.6; margin-bottom:16px; font-style:italic; }
.dex-meta-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:16px; }
.dex-meta-grid span { display:block; font-size:0.78rem; color:var(--text-2); }
.dex-stat-row { display:grid; grid-template-columns:90px 1fr 36px; gap:8px; align-items:center; margin-bottom:6px; font-size:0.85rem; }
.dex-stat-bar { height:8px; background:var(--border); border-radius:999px; overflow:hidden; }
.dex-stat-bar i { display:block; height:100%; background:var(--blue); border-radius:999px; }

/* ── Games ───────────────────────────────────────────────────────────────── */
.games-header { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:16px; }
.games-score { background:rgba(42,117,187,.1); padding:8px 14px; border-radius:999px; font-weight:800; color:var(--blue); }
.games-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; }
.game-card {
    border:1.5px solid var(--border); border-radius:var(--radius-sm); padding:18px;
    background:var(--surface); cursor:pointer; transition:transform .15s,border-color .15s;
}
.game-card:hover { transform:translateY(-2px); border-color:var(--blue); }
.game-card-icon { font-size:2rem; margin-bottom:8px; }
.game-card h3 { font-size:1rem; margin-bottom:6px; color:var(--blue); }
.game-card p { font-size:0.85rem; color:var(--text-2); line-height:1.5; }
.game-arena { margin-top:20px; padding:20px; border:1.5px solid var(--border); border-radius:var(--radius-sm); background:var(--surface-2); }
.game-arena.hidden { display:none; }
.game-title { color:var(--blue); margin-bottom:8px; }
.game-desc { color:var(--text-2); margin-bottom:16px; }
.game-options { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; margin-bottom:12px; }
.game-opt { width:100%; }
.game-feedback { font-weight:700; margin-top:10px; }
.game-feedback.success { color:#16a34a; }
.game-feedback.fail { color:#dc2626; }
.game-back { margin-top:16px; }
.game-whos-img { text-align:center; margin:16px 0; }
.game-whos-img img { width:140px; height:140px; image-rendering:pixelated; }
.game-whos-img img.silhouette { filter:brightness(0); }
.game-type-target { text-align:center; margin:16px 0; }
.game-go-scene { position:relative; width:180px; height:180px; margin:16px auto; display:grid; place-items:center; }
.game-go-ring {
    position:absolute; inset:0; border:4px solid #22c55e; border-radius:50%;
    transition:transform .08s linear; pointer-events:none;
}
.game-go-mon { width:100px; height:100px; image-rendering:pixelated; z-index:1; }
.game-go-wild { text-align:center; font-weight:800; margin-bottom:12px; }
#goThrow { display:block; margin:0 auto; }
.game-loading { text-align:center; color:var(--text-2); padding:20px; }

.game-card-link { text-decoration:none; color:inherit; display:block; }
.game-card-badge { display:inline-block; margin-top:10px; font-size:0.72rem; font-weight:800; color:var(--blue); background:rgba(42,117,187,.1); padding:4px 10px; border-radius:999px; }