@media (min-width: 960px) {
/* Toolbar: Titel | DAB-Hinweis (nur benötigte Breite, mittig) | Moderator; Seitenspalten gleich breit */
.tm-toolbar > .uk-container.uk-flex { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; column-gap: 20px; }
.tm-toolbar > .uk-container > div:not(.uk-margin-auto-left) { grid-column: 1; min-width: 0; }
.tm-toolbar > .uk-container > div:not(.uk-margin-auto-left) > .uk-grid { margin-left: 0; }
.tm-toolbar > .uk-container > div:not(.uk-margin-auto-left) > .uk-grid > * { width: 100%; min-width: 0; padding-left: 0; }
.tm-toolbar > .uk-container > .uk-margin-auto-left, .tm-toolbar > .uk-container > .uk-margin-auto-left > .uk-grid { display: contents; }
.tm-toolbar > .uk-container > .uk-margin-auto-left > .uk-grid > * { padding-left: 0; margin-top: 0; min-width: 0; }
.tm-toolbar > .uk-container > .uk-margin-auto-left > .uk-grid > :first-child { grid-column: 2; justify-self: center; }
.tm-toolbar > .uk-container > .uk-margin-auto-left > .uk-grid > :last-child { grid-column: 3; justify-self: stretch; }
.tm-toolbar .rsp-topbar-title, .tm-toolbar .rsp-topbar-moderator { min-width: 0; }
.tm-toolbar .rsp-topbar-title .uk-width-expand { min-width: 0; }
.tm-toolbar #c_artist, .tm-toolbar #c_title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
.rsp-dab { display: inline-flex; align-items: center; gap: 14px; padding: 7px 28px 7px 7px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.04)); box-shadow: 0 4px 16px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.15); color: #fff; line-height: 1.15; white-space: nowrap; }
.rsp-dab .rsp-dab-icon { position: relative; flex: none; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; background: #fc8800; color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.3); }
.rsp-dab .rsp-dab-icon::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #fc8800; animation: rsp-dab-pulse 2.4s ease-out infinite; }
.rsp-dab .rsp-dab-text { text-align: left; }
.rsp-dab .rsp-dab-top { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 3px; opacity: .85; }
.rsp-dab .rsp-dab-channel { font-size: 25px; font-weight: 700; letter-spacing: .5px; }
.rsp-dab .rsp-dab-badge { display: inline-block; margin-right: 6px; padding: 0 8px; border-radius: 5px; background: #fff; color: #700040; font-size: 18px; line-height: 26px; vertical-align: 2px; }
@keyframes rsp-dab-pulse { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.45); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .rsp-dab .rsp-dab-icon::after { animation: none; opacity: 0; } }
#page\#0 .rsp-titlecover { display:block !important} #page\#0 .rsp-titlecover-InfoBox { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(70,00,40,.75); color: #fff; padding: 6px; font-size: 13px; line-height: 16px; -webkit-backface-visibility: hidden; backface-visibility: hidden; text-transform: uppercase; text-align: center;} #page\#0 .rsp-titlecover-airtime{ line-height: 20px; color:#ffffff; background-color:#700040; padding: 5px 5px 5px 5px !important; position: absolute; top: 5px; right: 5px;} #page\#0 .rsp-titlecover-artist{} #page\#0 .rsp-titlecover-title { color:#ffffff; font-size: 18px; line-height: 1; font-weight: 300; margin-top:5px; margin-bottom:5px } #page\#0 .rsp-titlecover-stream{ position: absolute; top: 40px; right: 5px;} #page\#0 .uk-button{ padding: 5px 2px 5px 5px !important; line-height: 20px; background-color: #ffffff; align-content: center; text-align:center !important;} #page\#0 .uk-grid-item-match, #page\#0 .uk-grid-match>* { display: block; flex-wrap: wrap; } #page\#1 .titlelist-select form { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; max-width: 1200px; padding: 1rem 0; margin: 0 auto; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } #page\#1 form[name=titlelist-select] select { background-color: #ffffff; border-bottom: none; margin: 0 1rem; padding-right: 30px; text-transform: uppercase; width: auto; } #page\#1 form[name=titlelist-select] select[name=channel-select] { margin-left: 0; padding-left: 5px; } #page\#1 form[name=titlelist-select] select[name=date-select] { margin-left: .25rem; padding-left: 5px; } #page\#1 form[name=titlelist-select] select[name=hour-select] { margin-right: .25rem; padding-left: 5px; } #page\#1 form[name=titlelist-select] select[name=minutes-select] { margin-left: .25rem; padding-left: 5px; } #page\#1 .titlelist form select { color: #700040; border-color: #000000; width: auto; margin: .5rem; } #page\#1 select { display: inline-block; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 1em; background-size: 18px auto; padding: .5em 24px .5em .66em; } #page\#1 input:not([type=checkbox]):not([type=radio]):not([type=submit]), #page\#1 select { font-family: 'Titillium Web'; font-size: 1em; line-height: 1.55; font-weight: 500; color: #700040; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: 0 0; padding: .25rem 0; border-radius: 0; width: 100%; outline: none; box-shadow: none; border: none; border-bottom: 2px solid rgba(0,0,0,.1); -webkit-transition: all 250ms ease; transition: all 250ms ease; } #page\#1 form[name=titlelist-select] .button { background: 0 0; border: 2px solid #fff; text-transform: uppercase; padding: .33em 2em; letter-spacing: 2px; } #page\#1 .titlelist-select form .button { margin: 0 0 0 1rem; } #page\#1 .button, #page\#1 input[type=submit] { font-family: 'Titillium Web'; font-weight: 300; -webkit-appearance: none; -moz-appearance: none; appearance: none; letter-spacing: 2px; } #page\#1 .button, #page\#1 button, #page\#1 input[type=submit] { font-family: 'Titillium Web'; font-size: 1rem; line-height: 1.2; font-weight: 300; background: #fc8800; color: #fff; border: none; margin: 0 0 0 auto; cursor: pointer; display: inline-block; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; box-shadow: none; padding: .63rem 1rem; -webkit-transition: all 300ms ease; transition: all 300ms ease; overflow: hidden; text-transform: uppercase; } #page\#1 select { background: url(/images/rsp_setup/caret_down.png) no-repeat 100% 50%; background-size: 18px auto; padding-right: 26px; font-weight: 300; line-height: 1.2; } @media (max-width: 599px){ #page\#1 form[name=titlelist-select] select[name=channel-select], #page\#1 form[name=titlelist-select] select[name=date-select] { width: 90%; margin-left: auto; margin-right: auto; margin-bottom: 10px; }} @media (min-width:600px) and (max-width:959px){ #page\#1 form[name=titlelist-select] select{margin:.25rem}} @media (min-width:600px) and (max-width:959px){ #page\#1 form[name=titlelist-select] .button{padding:.45em .66em;box-sizing:content-box;margin:.25rem;font-size:.85em}} #page\#2 .uk-search-default .uk-search-input { background-color: rgba(255,255,255,0.25); border-color: rgba(255, 255, 255, 0.25); } #page\#2 .uk-search-default { width: 250px; } #page\#3 h6.rsp-titlelist-title { margin: 0px !important } #page\#3 .rsp-titlelist-airtime { padding: 5px;} #page\#3 .rsp-titlelist-title {} #page\#3 .rsp-titlelist-artist {} #page\#3 .rsp-titlelist-stream { position: relative; float: right;} #page\#3 .rsp-titlelist-cover { width:75px; height:75px; min-width: 75px; } #page\#3 .uk-button{ padding: 5px 2px 5px 5px !important; line-height: 20px; background-color: #ffffff; align-content: center; text-align:center !important; border: 1px solid #fc8800; background-image: linear-gradient(90deg,transparent 50%,#fc8800 50%); }
.tm-header, .tm-header-mobile {display:none;}
.rsp-footer {display:none;}
/* Voting-Hinweis rechtsbündig unter den Menüpunkten (wird per Script in die Navbar gehängt) */
.uk-navbar-container > .uk-container.rsp-vote-host { position: relative; }
.rsp-vote { position: absolute; z-index: 0; display: inline-flex; align-items: center; gap: 10px; background: linear-gradient(135deg, #e6007e, #fc8800); color: #fff; text-decoration: none; box-shadow: 0 4px 12px rgba(35,47,63,.2); overflow: hidden; isolation: isolate; transition: transform .25s ease, box-shadow .25s ease; }
.rsp-vote:hover, .rsp-vote:focus-visible { color: #fff; text-decoration: none; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(35,47,63,.3); }
.rsp-vote:focus-visible { outline: 3px solid #700040; outline-offset: 2px; }
.rsp-vote::after { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, rgba(255,255,255,0), rgba(255,255,255,.35), rgba(255,255,255,0)); transform: skewX(-20deg); animation: rsp-vote-shine 5s ease-in-out 1.5s infinite; }
.rsp-vote-icon { flex: none; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(255,255,255,.2); }
.rsp-vote-icon svg { width: 17px; height: 17px; }
.rsp-vote-text { font-family: 'Titillium Web', sans-serif; font-size: 16px; font-weight: 700; line-height: 1.1; white-space: nowrap; }
.rsp-vote-go { flex: none; display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: #fff; color: #700040; transition: transform .25s ease, background-color .25s ease, color .25s ease; }
.rsp-vote-go svg { width: 14px; height: 14px; }
.rsp-vote:hover .rsp-vote-go { transform: translateX(3px); background: #700040; color: #fff; }
/* Einflug nach Seitenstart: schießt von rechts herein, federt nach und rastet ein */
@keyframes rsp-vote-in {
	0% { transform: translateX(110vw) skewX(-28deg) scaleX(1.25); filter: blur(4px); }
	55% { transform: translateX(-22px) skewX(10deg) scaleX(.94); filter: blur(0); }
	70% { transform: translateX(10px) skewX(-5deg) scaleX(1.03); }
	83% { transform: translateX(-4px) skewX(2deg) scaleX(.99); }
	93% { transform: translateX(1px) skewX(0) scaleX(1); }
	100% { transform: none; }
}
@keyframes rsp-vote-pop { 0% { transform: translateY(-50%) scale(.2); opacity: 0; } 60% { transform: translateY(-50%) scale(1.12); opacity: 1; } 80% { transform: translateY(-50%) scale(.96); } 100% { transform: translateY(-50%) scale(1); } }
.tm-header .uk-navbar-container { overflow-x: clip; }
@keyframes rsp-vote-shine { 0%, 70% { left: -60%; } 100% { left: 130%; } }
/* Desktop: als Pille im weißen Bereich unter den Menüpunkten, nichts ragt in die Grafik */
@media (min-width: 960px) {
.rsp-vote { bottom: 6px; right: 40px; padding: 4px 5px 4px 5px; border-radius: 999px; animation: rsp-vote-in .95s cubic-bezier(.2,.8,.25,1) .6s backwards; transform-origin: right center; }
.rsp-vote-text { padding-right: 2px; }
}
@media (min-width: 960px) and (max-width: 1199px) { .rsp-vote { right: 30px; } }
.rsp-vote-short { display: none; }
/* Mobil: kompakte Pille links in der Leiste, gegenüber dem Menü-Symbol */
@media (max-width: 959px) {
.rsp-vote { top: 50%; left: 15px; right: auto; transform: translateY(-50%); gap: 6px; padding: 4px 12px 4px 4px; border-radius: 999px; animation: rsp-vote-pop .6s ease-out .5s backwards; }
.rsp-vote:hover, .rsp-vote:focus-visible { transform: translateY(-50%); }
.rsp-vote-text, .rsp-vote-go { display: none; }
.rsp-vote-short { display: inline; font-family: 'Titillium Web', sans-serif; font-size: 14px; font-weight: 700; line-height: 1; white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) { .rsp-vote { animation: none !important; } .rsp-vote::after { animation: none; display: none; } .rsp-vote, .rsp-vote-go { transition: none; } }