/* Reused approved homepage control rules, scoped only to LISTEN YOUR WAY. */
#listen-your-way .kiss-controls .dial-mount{flex: 0 0 80px; width: 80px; height: 80px; border: 1px solid rgb(86, 89, 81); border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, rgb(18, 21, 19) 15%, rgb(139, 142, 129) 16%, rgb(68, 71, 63) 18%, rgb(32, 36, 31) 40%, rgb(178, 180, 166) 75%, rgb(47, 50, 45) 78%); box-shadow: rgba(0, 0, 0, 0.6) 0px 3px 5px;}
#listen-your-way .kiss-controls .dial-play{display: flex; align-items: center; justify-content: center; flex-direction: column; width: 67px; height: 67px; padding: 0px; border-radius: 50%; border: 2px solid rgb(196, 143, 103); background: rgb(53, 27, 21); color: rgb(251, 177, 122); box-shadow: rgba(255, 210, 160, 0.36) 0px 1px 3px inset, rgba(0, 0, 0, 0.667) 0px -5px 9px inset, rgba(248, 100, 41, 0.14) 0px 0px 7px; transition: box-shadow 0.15s, background 0.15s;}
#listen-your-way .kiss-controls .dial-play .dial-glyph{font: 22px / 1 Arial, sans-serif; margin-left: 3px;}
#listen-your-way .kiss-controls .dial-play .dial-word{font: 700 7px / 1.2 Arial, sans-serif; letter-spacing: 0.8px; margin-top: 5px;}
#listen-your-way .kiss-controls .dial-play:hover{background: rgb(108, 41, 28); color: rgb(255, 225, 176); box-shadow: rgba(255, 210, 160, 0.36) 0px 1px 3px inset, rgba(248, 100, 41, 0.267) 0px 0px 13px;}
#listen-your-way .kiss-controls .dial-play:active{transform: translateY(1px);}
#listen-your-way .kiss-controls .is-playing .dial-play{background: rgb(167, 43, 27); color: rgb(255, 240, 203); border-color: rgb(255, 208, 158); box-shadow: rgba(255, 240, 192, 0.42) 0px 1px 5px inset, rgb(76, 13, 9) 0px -4px 8px inset, rgba(243, 78, 50, 0.36) 0px 0px 16px;}
#listen-your-way .kiss-controls .provider-preset{min-width: 80px; min-height: 126px; padding: 10px 4px 8px; gap: 7px; display: flex; flex-flow: column; justify-content: center; border: 1px solid rgb(85, 93, 82); border-radius: 12px; background: rgb(17, 23, 19); color: rgb(243, 239, 228); font: 700 16px / 1.2 Arial, sans-serif; box-shadow: rgba(216, 222, 203, 0.08) 0px 1px 0px inset, rgba(0, 0, 0, 0.4) 0px 2px 3px;}
#listen-your-way .kiss-controls .provider-preset .preset-key{width: 64px; height: 64px; flex: 0 0 64px; font-size: 21px; border-color: rgb(167, 172, 155); box-shadow: rgba(221, 217, 190, 0.4) 0px 1px 0px inset, rgb(8, 11, 9) 0px 3px 0px, rgba(0, 0, 0, 0.467) 0px 4px 3px;}
#listen-your-way .kiss-controls .provider-preset .preset-key::before{width: 14px; left: calc(50% - 7px); top: 8px; height: 2px;}
#listen-your-way .kiss-controls .provider-preset small{font: 400 12px / 1.3 Arial, sans-serif; color: rgb(192, 199, 184); min-height: 16px; text-align: center;}
#listen-your-way .kiss-controls .provider-preset.recommended{border-color: rgb(182, 153, 90); color: rgb(246, 221, 176);}
#listen-your-way .kiss-controls a.provider-preset:hover{background: rgb(32, 39, 30); border-color: rgb(231, 208, 154);}
#listen-your-way .kiss-controls a.provider-preset:active{transform: translateY(1px);}
#listen-your-way .kiss-controls .provider-preset.unavailable{background: rgb(13, 18, 16); border-color: rgb(53, 62, 53); color: rgb(166, 174, 163); box-shadow: none;}
#listen-your-way .kiss-controls .provider-preset.unavailable small{color: rgb(179, 187, 174);}
#listen-your-way .kiss-controls .unavailable .preset-key{border-color: rgb(74, 84, 72); color: rgb(137, 150, 128); background: rgb(21, 28, 22); box-shadow: rgba(100, 109, 82, 0.2) 0px 1px 0px inset, rgb(8, 11, 9) 0px 2px 0px;}
#listen-your-way .kiss-controls .provider-preset .preset-key, #listen-your-way .kiss-controls .provider-preset.unavailable .preset-key{border: 0px; border-radius: 0px; background: none; box-shadow: none;}
#listen-your-way .kiss-controls .provider-preset .preset-key::before{display: none;}
#listen-your-way .kiss-controls .preset-key img{display: block; width: 100%; height: 100%; object-fit: contain; filter: none; opacity: 1;}
/* Layout/colour adaptation only; dial and branded presets below reuse homepage CSS. */
#listen-your-way .kiss-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:560px;margin:24px 0 30px}
#listen-your-way .kiss-controls .kiss-direct{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:160px;text-align:center;color:#ffe4ad}
#listen-your-way .kiss-controls .kiss-direct-label{font:900 16px/1.2 Arial,sans-serif;letter-spacing:.5px}
#listen-your-way .kiss-controls .kiss-direct-label span{color:#eca341}
#listen-your-way .kiss-controls .kiss-direct small{font:400 11px/1.4 Arial,sans-serif;color:#e3c28a}
#listen-your-way .kiss-controls .provider-preset{min-height:160px;background:rgba(13,8,4,.58);border-color:#9e7a45;box-shadow:inset 0 1px 0 #ffe3a52e,0 3px 0 #120c06,0 5px 12px #0006;color:#fff0d7}
#listen-your-way .kiss-controls .provider-preset.recommended{border-color:#e2b567;color:#ffe1a6}
#listen-your-way .kiss-controls .provider-preset small{color:#dbc49e}
#listen-your-way .kiss-controls a.provider-preset:hover{background:rgba(70,39,13,.7);border-color:#ffda95}
#listen-your-way .kiss-controls :is(a,button):focus-visible{outline:2px solid #ffdd9e;outline-offset:5px}
@media(max-width:600px){#listen-your-way .kiss-controls{gap:10px}#listen-your-way .kiss-controls .provider-preset{min-width:0;min-height:148px;font-size:15px;padding:10px 4px}#listen-your-way .kiss-controls .provider-preset .preset-key{width:52px;height:52px;flex-basis:52px}#listen-your-way .kiss-controls .provider-preset small{font-size:11px}#listen-your-way .kiss-controls .kiss-direct{min-height:148px}#listen-your-way .kiss-controls .kiss-direct small{font-size:10px}}
@media(prefers-reduced-motion:reduce){#listen-your-way .kiss-controls *{transition:none!important}}