body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; background-color: #0d1117; color: #c9d1d9; max-width: 800px; margin: 0 auto; padding: 20px; }
h1 { color: #58a6ff; border-bottom: 1px solid #21262d; padding-bottom: 10px; }

/* Structure des contrôles (Recherche + Tri) */
.controls-container { display: flex; gap: 15px; margin: 20px 0; }
@media (max-width: 600px) { .controls-container { flex-direction: column; gap: 10px; } }

.search-input { flex-grow: 1; padding: 10px 15px; background-color: #161b22; border: 1px solid #30363d; border-radius: 6px; color: #c9d1d9; font-size: 1em; box-sizing: border-box; outline: none; }
.search-input:focus, .sort-select:focus { border-color: #58a6ff; box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.3); }

.sort-select { padding: 10px 15px; background-color: #161b22; border: 1px solid #30363d; border-radius: 6px; color: #c9d1d9; font-size: 1em; cursor: pointer; outline: none; }

.repo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 20px; }
@media (max-width: 600px) { .repo-grid { grid-template-columns: 1fr; } }
.repo-card { background-color: #161b22; border: 1px solid #30363d; border-radius: 6px; padding: 15px; transition: transform 0.2s; }
.repo-card:hover { transform: translateY(-2px); border-color: #8b949e; }
.repo-title { font-weight: bold; color: #58a6ff; text-decoration: none; font-size: 1.1em; }
.repo-desc { color: #8b949e; font-size: 0.9em; margin: 8px 0; min-height: 40px; }
.repo-meta { font-size: 0.8em; color: #8b949e; display: flex; gap: 15px; }
.lang-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color: #bc8cff; }
.loading { text-align: center; color: #8b949e; padding: 40px; font-style: italic; }