.teli-ticker {
        direction: ltr;
        overflow: hidden;
        width: 100%;
        background: var(--ticker-bg, #f5f5f5);
        color: var(--ticker-color, #333);
        font-size: var(--ticker-font-size, 16px);
        padding: 10px 0;
        position: relative;
    }
    .teli-wrapper {
        overflow: hidden;
        white-space: nowrap;
    }
    .teli-track {
        display: inline-block;
        will-change: transform;
        animation-iteration-count: infinite;
        animation-timing-function: linear;
        animation-play-state: running;
    }
    .teli-ticker:hover .teli-track {
        animation-play-state: paused !important;
    }
    .teli-content {
        display: inline-block;
        white-space: nowrap;
    }
    /* تحويل النصوص إلى أزرار 3D مع هوفر وظل - مثل أزرار البيانو */
    .teli-text {
        display: inline-block;
        margin: 0 6px; /* 6px يمين ويسار = 12px بين كل زرين */
        padding: 8px 16px;
        background: linear-gradient(to bottom, #ffffff, #f0f0f0);
        color: inherit;
        border-radius: 8px;
        box-shadow: 0 5px 0 #b0b0b0, 0 2px 8px rgba(0,0,0,0.2);
        transition: all 0.08s linear;
        cursor: pointer;
        text-decoration: none;
        font-weight: 500;
        vertical-align: middle;
        border: none;
    }
    .teli-text a {
        color: inherit;
        text-decoration: none;
        display: block;
    }
    /* تأثير hover: يضغط الزر للأسفل مثل مفتاح البيانو */
    .teli-text:hover {
        transform: translateY(3px);
        box-shadow: 0 2px 0 #b0b0b0, 0 2px 6px rgba(0,0,0,0.2);
        background: linear-gradient(to bottom, #f8f8f8, #e8e8e8);
    }
    /* تأثير الضغط النشط (اختياري) */
    .teli-text:active {
        transform: translateY(5px);
        box-shadow: 0 0px 0 #b0b0b0, 0 1px 4px rgba(0,0,0,0.2);
        transition: 0.02s linear;
    }
    .teli-separator {
        display: inline-block;
        vertical-align: middle;
        margin: 0 5px;
    }
    .teli-separator img {
        display: block;
        border-radius: 4px;
        max-width: 50px;
        height: auto;
    }
    @keyframes ticker-ltr {
        0% { transform: translateX(-50%); }
        100% { transform: translateX(0); }
    }
    @keyframes ticker-rtl {
        0% { transform: translateX(0); }
        100% { transform: translateX(-50%); }
    }