:root {
    --main-color: #ffffff;
    --ui-opacity: 0.85;
    --ui-scale: 1.0;
    --main-font: 'Segoe UI', sans-serif;
}

body {
    font-family: var(--main-font);
    color: var(--main-color);
    background-color: transparent;
    margin: 0;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    -webkit-user-select: none;
}

#widget-container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    transform: scale(var(--ui-scale));
    transition: transform 0.2s ease-in-out, opacity 0.3s ease;
    opacity: var(--ui-opacity);
    pointer-events: auto;
    width: fit-content;
    padding: 0 20px;
}

#left-column {
    flex-shrink: 0;
    text-align: right;
    padding-right: 40px;
}

#separator {
    width: 1px;
    height: 100px;
    background-color: var(--main-color);
    opacity: 0.4;
}

#right-column {
    padding-left: 40px;
    min-width: 200px;
    max-width: 800px;
    overflow: hidden;
}

#timeline, .control-btn { font-size: 16px; font-weight: 400; opacity: 0.6; letter-spacing: 0.5px; }
#status-text { font-size: 20px; font-weight: 700; margin: 10px 0; opacity: 1; }
#artist { font-size: 28px; font-weight: 400; opacity: 0.9; }
.control-btn { cursor: pointer; transition: opacity 0.2s ease; }
.control-btn:hover { opacity: 1; }
.control-btn:not(:last-child) { margin-right: 12px; }

/* --- Carousel CSS --- */

#title-wrapper {
    display: flex;
    width: fit-content;
}
.title-text {
    font-size: 52px;
    font-weight: 700;
    white-space: nowrap;
    padding-right: 50px;
}

#title-wrapper:not(.is-overflowing) .title-text:last-child {
    display: none;
}
#title-wrapper:not(.is-overflowing) {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

@keyframes seamless-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

#title-wrapper.is-overflowing {
    animation-name: seamless-marquee;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    /* Animation is paused by default. JS controls play/pause. */
    animation-play-state: paused;
}