body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    background-color: #f0f3f1;
    color: #222;
    -webkit-font-smoothing: antialiased;
}

.challenge-header {
    background-color: #2b5c3a;
    color: white;
    border-bottom: 4px solid #4a8256;
    background-image: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><circle cx="2" cy="2" r="1" fill="rgba(255,255,255,0.05)"/></svg>');
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.main-title { font-weight: 900; text-shadow: 2px 2px 0px rgba(0,0,0,0.2); letter-spacing: -1px; font-size: 2rem !important; }
.date-badge { background-color: #4a8256; color: white; border: 1px solid white; }
.info-pill { background-color: white; color: #2b5c3a; border-radius: 50px; font-weight: 800; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
.challenge-color { color: #2b5c3a; }
.bg-challenge { background-color: #2b5c3a; }

.scroll-container { overflow-x: auto; overflow-y: auto; }

/* Kompakte Tabelle für bis zu 12 Zeilen */
.table-minimal th {
    font-weight: 600; text-transform: uppercase; font-size: 0.65rem; color: #666; 
    padding: 0.25rem 0.5rem; border-bottom: 2px solid #f0f3f1; background-color: #ffffff; vertical-align: bottom;
}
.table-minimal td {
    padding: 0.15rem 0.5rem !important; border-bottom: 1px solid #f8f9fa; vertical-align: middle;
}
.min-w-100 { min-width: 100px; }

.store-row:hover td { background-color: #fcfcfc !important; }

/* Store Link */
.store-link { transition: opacity 0.2s; }
.store-link:hover { opacity: 0.7; text-decoration: underline !important; }

/* Disqualifizierte Stores */
.disqualified-store td {
    opacity: 0.5;
    filter: grayscale(100%);
    background-color: #fdfdfd !important;
}
.disqualified-store:hover td { opacity: 0.7; }

.rank-number { font-size: 0.9rem !important; font-weight: 800; color: #ccc; min-width: 20px !important; display: inline-block; text-align: center; }
.rank-number.top-rank { color: #e6a817; }

.custom-progress { height: 3px !important; border-radius: 10px; background-color: #e9ecef; box-shadow: inset 0 1px 2px rgba(0,0,0,0.05); }

.score-card { background-color: #f8f9fa; border-radius: 4px !important; display: inline-block; min-width: 85px !important; border: 1px solid #f0f0f0; padding: 0.2rem !important; }

/* Desktop Ansicht: Beide Spalten fixiert */
@media (min-width: 768px) {
    .sticky-col-1 { position: sticky; left: 0; background-color: #ffffff !important; z-index: 2; min-width: 200px; max-width: 200px; }
    .sticky-col-2 { position: sticky; left: 200px; background-color: #ffffff !important; z-index: 2; min-width: 200px; max-width: 200px; box-shadow: 4px 0 6px -4px rgba(0,0,0,0.1); }
    thead .sticky-col-1, thead .sticky-col-2 { z-index: 3; }
    .store-name-text { font-size: 0.9rem; }
    .total-stars-text { font-size: 1.1rem; }
}

/* Mobile Ansicht: Nur Store-Name fixiert */
@media (max-width: 767.98px) {
    .main-title { font-size: 1.6rem !important; text-shadow: 1px 1px 0px rgba(0,0,0,0.2); letter-spacing: -0.5px; }
    .sticky-col-1 { position: sticky; left: 0; background-color: #ffffff !important; z-index: 2; min-width: 140px; max-width: 140px; box-shadow: 4px 0 6px -4px rgba(0,0,0,0.1); }
    .sticky-col-2 { position: static; min-width: 170px; max-width: 170px; } 
    thead .sticky-col-1 { z-index: 3; }
    .store-name-text { font-size: 0.75rem; white-space: normal; line-height: 1.1; }
    .total-stars-text { font-size: 0.95rem; }
}