/* Gundam Card Database Frontend Styles */
.gcd-app-container { max-width: 1200px; margin: 0 auto; padding: 20px; }
.gcd-search-section { margin-bottom: 20px; }
.gcd-search-bar { display: flex; gap: 10px; margin-bottom: 10px; }
.gcd-search-bar input { flex: 1; padding: 10px; border: 1px solid #ccc; border-radius: 4px; }
.gcd-button { padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; }
.gcd-button.primary { background: #0073aa; color: white; }
.gcd-button.secondary { background: #f0f0f0; color: #333; }
.gcd-cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; }
.gcd-card-item { border: 1px solid #ddd; border-radius: 8px; overflow: hidden; cursor: pointer; }
.gcd-card-item img { width: 100%; height: auto; }
.gcd-filters { background: #f9f9f9; padding: 15px; border-radius: 4px; margin-bottom: 20px; }
.gcd-filter-section { margin-bottom: 15px; }
.gcd-filter-section h4 { margin: 0 0 10px 0; }
.gcd-color-filters, .gcd-level-filters, .gcd-cost-filters { display: flex; gap: 5px; }
.gcd-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 9999; }
.gcd-modal-content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; padding: 20px; border-radius: 8px; max-width: 90%; max-height: 90%; overflow: auto; }
.gcd-loading { text-align: center; padding: 40px; }
.gcd-pagination { text-align: center; margin-top: 20px; }