body { font-family: sans-serif; margin: 20px; background-color: #f4f4f4; }
        .container { background-color: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 0 10px rgba(0,0,0,0.1); }
        /* ... (ostatní původní CSS styly) ... */
        .filters label { margin-right: 10px; }
        .filters input[type="range"] { width: 300px; }

        .article { border-bottom: 1px solid #eee; padding: 10px 0; }
        .article:last-child { border-bottom: none; }
        .article h3 { margin: 0 0 5px 0; }
        .article h3 a { text-decoration: none; color: #222; }
        .article h3 a:hover { color: #007bff; }
        .article small { color: #555; font-size: 0.9em; }
        .article p { margin: 5px 0 0 0; font-size: 0.95em; color: #222; }
        .sentiment-score { font-weight: bold; }
        .positive { color: green; }
        .negative { color: red; }
        .neutral { color: orange; }
        #sentimentValue { font-weight: bold; display: inline-block; width: 30px; text-align: center;}


        .range-slider-container {
    width: 100%;
    padding: 0 0 20px 0;
    box-sizing: border-box;
}

.range-slider-container label {
    display: block;
    margin-bottom: 10px;
    font-weight: bold;
}

.slider-values {
    margin-bottom: 10px;
    font-size: 0.9em;
    color: #222;
}
.slider-values span {
    font-weight: bold;
    display: inline-block;
    min-width: 25px; /* Pro zarovnání */
    text-align: right;
    margin-right: 15px;
}


.range-track-wrapper {
    position: relative;
    width: 100%;
    height: 2em; /* Výška pásu */
    display: flex; 
    align-items: center;
}

.range-track {
    position: absolute;
    width: 100%;
    height: 100%; 
    background: linear-gradient(to right,
        black 0%,        /* Od -50 */
        red 25%,         /* Kolem -25 */
        #cc8400 40%,     /* Přechod k oranžové */
        orange 50%,      /* Neutrální 0 */
        #ffcc00 60%,     /* Přechod k žluté */
        yellow 75%,      /* Kolem +25 */
        green 100%       /* Do +50 */
    );
    border-radius: 5px;
    pointer-events: none; 
}

.range-thumb {
    position: absolute;
    width: 1.5em; 
    height: 2.5em; 
    background-color: #fff;
    border: 2px solid #555;
    border-radius: 3px;
    cursor: grab;
    z-index: 10; /* Výchozí z-index */
    top: 50%;
    transform: translateY(-50%); 
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    display: flex; 
    align-items: center;
    justify-content: center;
}

.range-thumb:active, .range-thumb.dragging { /* Přidána třída .dragging */
    cursor: grabbing;
    box-shadow: 0 3px 7px rgba(0,0,0,0.3);
    z-index: 12 !important; /* Vyšší z-index pro tažený prvek, !important pro jistotu */
}