:root{--font-family: "Poppins", Arial, sans-serif;--text-headline-bold: bold 24px/32px var(--font-family);--text-subtitle-1-bold: bold 14px/16px var(--font-family);--text-subtitle-2-bold: bold 12px/16px var(--font-family);--text-subtitle-3-bold: bold 10px/16px var(--font-family);--text-body-1-regular: normal 14px/16px var(--font-family);--text-body-2-regular: normal 12px/16px var(--font-family);--text-body-3-regular: normal 10px/16px var(--font-family);--text-caption-regular: normal 8px/12px var(--font-family);--color-primary: #DC0A2D;--color-background: #f4f4f4;--color-white: #ffffff;--color-text-primary: #2c3e50;--color-text-secondary: #888;--color-text-muted: #7f8c8d;--color-border: #ddd;--color-error: #e74c3c;--shadow-inner-2dp: inset 0 2px 4px rgba(0, 0, 0, .1);--shadow-drop-2dp: 0 2px 4px rgba(0, 0, 0, .1);--shadow-drop-6dp: 0 6px 12px rgba(0, 0, 0, .15);--color-shadow: rgba(0, 0, 0, .1);--color-shadow-hover: rgba(0, 0, 0, .15);--spacing-xs: .2rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-xxl: 2.5rem;--radius-sm: .5rem;--radius-md: 1rem;--radius-lg: 1.2rem;--radius-xl: 2rem;--radius-full: 50%;--transition-fast: .15s ease;--transition-normal: .2s ease;--transition-slow: .3s ease}body{margin:0;min-height:100vh;background:var(--color-background);font-family:var(--font-family)}.loading,.error{display:flex;justify-content:center;align-items:center;min-height:100vh;font:var(--text-subtitle-1-bold);color:var(--color-text-primary)}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes heartBeat{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.type-badge{color:#fff;padding:.4rem 1.2rem;border-radius:1rem;font:var(--text-body-3-regular);font-weight:600;text-transform:capitalize;text-shadow:var(--shadow-inner-2dp);box-shadow:var(--shadow-drop-2dp)}.button{border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);font-family:inherit}.button:not(.favorites-active):not(.favorites-inactive){background:#ededed;border-radius:var(--radius-full);width:var(--spacing-xxl);height:var(--spacing-xxl);font-size:1.2rem}.button:not(.favorites-active):not(.favorites-inactive):hover{background:var(--color-primary);color:var(--color-white)}.button-icon{margin-right:var(--spacing-xs)}.favorite-button{background:none;border:none;font-size:var(--spacing-md);cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;transition:all var(--transition-normal);width:1.5rem;height:1.5rem}.favorite-button:hover{background-color:#0000001a;transform:scale(1.1)}.favorite-button.favorite-active,.detail-favorite-button.favorite-active{animation:heartBeat .6s ease-in-out}.detail-favorite-button{background-color:#fff3!important;font-size:1.5rem!important;width:var(--spacing-xxl)!important;height:var(--spacing-xxl)!important}.detail-favorite-button:hover{background-color:#ffffff4d!important;transform:scale(1.1)}.input{border:none;outline:none;font:var(--text-body-1-regular);width:100%;padding:var(--spacing-sm) 0;background:transparent}.search-bar{display:flex;gap:var(--spacing-md);background:var(--color-white);border-radius:var(--radius-xl);max-width:500px;padding:.4rem 1.2rem;box-shadow:var(--shadow-drop-2dp)}.input-wrapper{flex:1;display:flex;align-items:center;position:relative}.validation-error{position:absolute;top:100%;left:0;right:0;background-color:var(--color-error, #e74c3c);color:var(--color-white);padding:var(--spacing-xs) var(--spacing-sm);font:var(--text-caption-regular);border-radius:0 0 var(--spacing-xs) var(--spacing-xs);z-index:10;animation:slideDown .2s ease-out;box-shadow:var(--shadow-drop-2dp)}.input-icon{margin-right:var(--spacing-sm);font:var(--text-subtitle-1-bold)}.type-filter .type-select{padding:8px 12px;border:2px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-white);font:var(--text-body-1-regular);color:var(--color-text-primary);cursor:pointer;min-width:120px;transition:border-color var(--transition-normal);box-shadow:var(--shadow-drop-2dp)}.type-filter .type-select:hover{border-color:#007bff}.type-filter .type-select:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.type-filter .type-select:disabled{background-color:#f5f5f5;cursor:not-allowed;opacity:.6}.favorites-active,.favorites-inactive{border:2px solid;border-radius:var(--radius-sm);padding:8px 12px;font:var(--text-subtitle-1-bold);width:auto;height:auto;gap:var(--spacing-xs);transition:all var(--transition-normal);box-shadow:var(--shadow-drop-2dp)}.favorites-inactive{background:var(--color-white);border-color:var(--color-border);color:var(--color-text-primary)}.favorites-inactive:hover{border-color:var(--color-primary);color:var(--color-primary)}.favorites-active{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-white)}.favorites-active:hover{background:#b52729;border-color:#b52729}.pokemon-card-link{text-decoration:none;color:inherit;display:block}.pokemon-card{background:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-drop-2dp);display:flex;flex-direction:column;align-items:center;padding:var(--radius-lg) var(--spacing-sm) .8rem var(--spacing-sm);transition:box-shadow var(--transition-normal)}.pokemon-card-link:hover .pokemon-card{box-shadow:var(--shadow-drop-6dp)}.pokemon-card-header{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:.2rem}.pokemon-card .pokemon-id{font:var(--text-body-2-regular);color:var(--color-text-secondary)}.pokemon-card .pokemon-img{width:90px;height:90px;margin-bottom:.6rem}.pokemon-card .pokemon-name{font:var(--text-subtitle-1-bold);letter-spacing:.5px;color:var(--color-text-primary);text-align:center;margin-top:.3rem}.pokemon-grid .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1.2rem;padding:2rem;max-width:900px;margin:0 auto}.main-template{margin:0;min-height:100vh;background:var(--color-background)}.header{background:var(--color-primary);display:flex;align-items:center;padding:var(--spacing-lg);color:var(--color-white);box-shadow:var(--shadow-drop-2dp)}.logo{margin-right:var(--spacing-md)}.title{font:var(--text-headline-bold);margin:0}.pokemon-detail-page{display:flex;justify-content:center;align-items:flex-start;min-height:100vh;background:var(--color-background);padding:3rem 2rem}.pokemon-detail-container{width:65%;max-width:800px;min-width:400px;border-radius:2rem;box-shadow:var(--shadow-drop-6dp);overflow:hidden;background:var(--color-white)}.pokemon-top-section{position:relative;padding-bottom:4rem;overflow:hidden}.pokeball-background{position:absolute;top:60px;right:20px;opacity:1;z-index:1}.pokeball-bg-icon{width:200px;height:200px;filter:brightness(0) invert(1)}.pokemon-detail-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;color:#fff;position:relative;z-index:2}.back-button{color:#fff;text-decoration:none;padding:.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;font-size:1.8rem;line-height:1;transition:background-color .2s}.back-button:hover{background-color:#fff3}.pokemon-detail-header .pokemon-name{font:var(--text-headline-bold);margin:0;text-transform:capitalize}.pokemon-detail-header .pokemon-number{font:var(--text-subtitle-1-bold);opacity:.8}.pokemon-meta{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}.pokemon-info{display:flex;flex-direction:column;align-items:flex-end;gap:.3rem}.pokemon-generation{opacity:.9}.generation-icon{width:40px;height:40px;object-fit:contain}.pokemon-image-container{display:flex;justify-content:center;padding:0 0 2rem;position:relative;z-index:2}.pokemon-detail-image{width:200px;height:200px;object-fit:contain}.pokemon-info-card{background:#fff;border-radius:1.5rem 1.5rem 0 0;min-height:400px;padding:2.5rem 2rem 2rem;margin-top:-2rem;position:relative;z-index:3}.pokemon-types{display:flex;gap:.5rem;justify-content:center;margin-bottom:2rem;margin-top:-1rem}.pokemon-about h2,.pokemon-stats h2{color:var(--color-text-primary);font:var(--text-subtitle-1-bold);margin-bottom:1.5rem;text-align:center}.pokemon-physical-stats{display:flex;justify-content:space-around;align-items:center;margin-bottom:1.5rem}.stat-item{text-align:center;flex:1;display:flex;flex-direction:column;align-items:center}.stat-value{font:var(--text-subtitle-1-bold);color:var(--color-text-primary);margin-bottom:.3rem;display:flex;align-items:center;justify-content:center;gap:.4rem}.stat-icon{width:16px;height:16px;opacity:.6}.stat-label{font:var(--text-body-3-regular);color:var(--color-text-muted);text-transform:capitalize}.stat-divider{width:1px;height:2rem;background:#e1e8ed;margin:0 1rem}.pokemon-description{font:var(--text-body-1-regular);color:var(--color-text-primary);text-align:center;margin:0}.pokemon-stats{margin-top:2rem}.stats-list{display:flex;flex-direction:column;gap:.8rem}.stat-row{display:flex;align-items:center;gap:1rem}.stat-name,.stat-number{font:var(--text-body-2-regular);font-weight:600;color:var(--color-text-primary)}.stat-name{min-width:80px;text-transform:uppercase}.stat-number{min-width:35px}.stat-bar-container{flex:1;height:.3rem;background:#e1e8ed;border-radius:.15rem;overflow:hidden;position:relative}.stat-bar{height:100%;border-radius:.15rem;transition:width .3s ease}@media (max-width: 768px){.pokemon-detail-page{padding:unset}.pokemon-detail-container{width:100%;min-width:320px;border-radius:unset}.pokemon-info-card{padding:1.5rem}.pokemon-detail-image{width:180px;height:180px}}@media (min-width: 769px){.pokemon-detail-container{width:65%;max-width:800px}.pokemon-detail-image{width:280px;height:280px}.pokemon-info-card{padding:3rem}}@media (min-width: 1200px){.pokemon-detail-container{width:60%;max-width:900px}.pokemon-detail-image{width:320px;height:320px}}