.info-toggle {
    display: none;
}

#infoBox {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: #1a1a1a;
    border: 1px solid var(--border-color, #333333);
    border-radius: 6px;
    padding: 12px 32px 12px 14px;
    color: var(--fg-color, #ffffff);
    font-size: 12px;
    line-height: 1.4;
    max-width: 340px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.6);
    z-index: 999;
}

#infoBox p {
    color: #aaaaaa;
    margin: 0;
}

#infoBox strong {
    color: var(--fg-color, #ffffff);
}

#infoBox .close-btn {
    position: absolute;
    top: 6px;
    right: 8px;
    font-size: 16px;
    color: #666666;
    cursor: pointer;
    transition: color 0.15s ease;
}

#infoBox .close-btn:hover {
    color: var(--fg-color, #ffffff);
}

.info-toggle:checked ~ #infoBox {
    display: none;
}