*{box-sizing:border-box;margin:0;padding:0}:root{--color-background-primary:#fff;--color-background-secondary:#f5f4ed;--color-border-tertiary:#1f1e1d26}body{background-color:var(--color-background-secondary)}.pokemon-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:5px;max-width:1200px;margin:0 auto;display:grid}.pokemon-card{border:.5px solid var(--color-border-tertiary);background-color:var(--color-background-primary);text-align:center;cursor:pointer;text-transform:capitalize;border-radius:10px;padding:10px 0}.selected{background:#eeedfe;border:1.5px solid #7f77dd}.pokemon-type{border-radius:99px;padding:2px 7px;font-size:1.2rem;display:inline-block}.t-flying{color:#0c447c;background:#e6f1fb}.t-fire{color:#712b13;background:#faece7}.t-water{color:#0c447c;background:#e6f1fb}.t-grass{color:#27500a;background:#eaf3de}.t-electric{color:#633806;background:#faeeda}.t-poison{color:#cea5f7;background-color:#7b63ad}.t-bug{color:#fff;background-color:#a6b91a}.t-ground{color:#5c4a1f;background-color:#f4e9d3}.t-rock{color:#4d4523;background-color:#ede9d4}.t-ice{color:#1a4d4b;background-color:#e6f7f6}.t-fighting{color:#611714;background-color:#f5e2e1}.t-psychic{color:#7a1a35;background-color:#fbe6ec}.t-ghost{color:#35284a;background-color:#ece9f2}.t-dragon{color:#2b1371;background-color:#e9e6f9}.t-dark{color:#312721;background-color:#e8e7e6}.t-steel{color:#3c3c4a;background-color:#ebecf0}.t-fairy{color:#702b4a;background-color:#fceef4}.t-normal{color:#4a4a35;background-color:#f1f1e8}.navbar{border:.5px solid var(--color-border-tertiary);background-color:var(--color-background-primary);border-radius:8px;justify-content:space-around;align-items:center;max-width:1200px;margin:20px auto;padding:20px 10px;display:flex}.detail-header{text-transform:capitalize;align-items:center;gap:10px;display:flex}.pokemon-type-container{gap:10px;margin-top:4px;display:flex}.stats-section{margin-bottom:8px;font-size:1.2rem;font-weight:600}.stat-row{align-items:center;gap:20px;margin-bottom:8px;display:flex}.stat-name{text-align:left;text-transform:capitalize;flex-shrink:0;width:100px;font-size:.9rem}.bar-bg{background:var(--color-background-secondary);border-radius:99px;flex:1;height:5px}.bar-fill{border-radius:99px;height:100%}.hp{background:#d85a30}.attack{background:#7f77dd}.defense{background:#1d9e75}.special-attack{background:#9a92e5}.special-defense{background:#4cc7a1}.speed{background:#378add}.type-bar{gap:5px;max-width:1200px;margin:20px auto;display:flex}.active{color:#3c3489;background:#eeedfe;border-color:#afa9ec}button{border:.5px solid var(--color-border-secondary);color:var(--color-text-secondary);background:var(--color-background-primary);cursor:pointer;border-radius:99px;padding:4px 12px;font-size:12px}.search-bar{background-color:var(--color-background-primary);border:.5px solid var(--color-border-tertiary);border-radius:8px;align-items:center;gap:20px;max-width:1200px;margin:20px auto;padding:0 16px;display:flex}input{border:none;outline:none;width:100%;padding:10px 0}input:focus{border:none;outline:none}