:root{--color-text: #fff;--color-muted: #888;--background-color: #121212;--background-surface: #242424;--background-elevated: #363636;--radius: .5rem;--primary: #ff8000;--secondary: #00948a;--color-miniplayer: #000;--background-miniplayer: #ff8000;--shadow: 0 0 2rem rgba(0, 0, 0, .75);--breakpoint: 1000px}*,*:before,*:after{box-sizing:border-box;margin:0;position:relative;font-weight:400}body{min-height:100vh;color:var(--color-text);background:var(--background-color);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:1rem}h1,h2,h3,h4,h5,h6{margin-top:2rem;margin-bottom:.5rem}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}strong{font-weight:500}#app main{max-width:500px;margin:auto auto 10rem}#app .nav{position:fixed;left:0;right:0;bottom:0;z-index:50}#app .nav nav{background:var(--background-surface);display:flex;justify-content:center;align-items:center;flex-direction:row}#app .nav nav a{flex:0 0 7rem;display:block;padding:.5rem 1.5rem;text-decoration:none;text-align:center;color:var(--color-text);line-height:.8}#app .nav nav a .nav-icon{height:1.5rem;width:1.5rem;margin:auto;--fill: var(--color-text);display:block}#app .nav nav a .nav-label{font-size:.8rem;margin-top:.3rem;display:block}#app .nav nav a.router-link-active{color:var(--primary)}#app .nav nav a.router-link-active .nav-icon{--fill: var(--primary)}#app .footer{padding:2rem;color:var(--color-muted);font-size:.8rem}#app .footer a{color:var(--color-muted)}#app .footer .app-name{font-weight:500}@media (min-width: 1000px) and (min-height: 600px){#app{margin-right:400px}#app .nav{padding:1rem;right:calc(400px - 1rem)}#app .nav nav{border-radius:var(--radius)}}#home{padding:2rem}.placeholder{padding:4rem 2rem;color:var(--color-muted);text-align:center}.station{display:flex;flex-direction:row;justify-content:stretch;padding:.5rem;margin:0 -.5rem .125rem;border-radius:var(--radius)}.station:hover{background:var(--background-surface)}.station.active{background:var(--background-elevated)}.station .station-cover{flex:none;width:3.5rem;margin:0;cursor:pointer;position:relative;overflow:hidden}.station .station-cover:before{content:"";display:block;padding-top:100%}.station .station-cover .station-cover-image{position:absolute;top:0;left:0;width:100%;height:auto;border-radius:var(--radius)}.station .station-cover:after{clear:both;display:block;content:""}.station .station-label{flex:auto;display:flex}.station .station-label .station-name{flex:1 1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0 1rem .125rem;cursor:pointer}.station .station-label .station-name .station-label{font-weight:500}.station .station-label .station-name .station-location,.station .station-label .station-name .station-device{color:var(--color-muted)}.station .station-label .station-name .station-name-sub{color:var(--color-muted);font-size:.8rem}.station .station-label .station-name .station-name-sub span{margin-right:1rem}.station .station-label.station-label-player .station-name{padding-left:0}.station .station-label .station-toggle-favourite{flex:0 0 1.75rem;display:flex;align-items:center;width:1.75rem;cursor:pointer}.station .station-label .station-toggle-favourite .station-favourite-image{height:1.25rem;margin-bottom:.125rem}.station .station-label .station-toggle-playback{flex:none;display:flex;align-items:center;justify-content:center;width:3.5rem;cursor:pointer}.station .station-label .station-toggle-playback .station-playback-image{height:1.25rem;margin-bottom:.125rem}@media (min-width: 1000px) and (min-height: 600px){.station .station-label .station-toggle-playback{background:var(--primary);border-radius:50%}}.stations-list.empty{background:var(--background-surface);border-radius:var(--radius)}.stations-list.is-covers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.stations-list.is-covers .station{flex-direction:column}.stations-list.is-covers .station .station-cover{width:100%;margin-bottom:.5rem}.stations-list.is-covers .station .station-label{display:flex;flex-direction:column}.stations-list.is-covers .station .station-label .station-name{padding:0 .5rem;flex:auto;height:100%}.stations-list.is-covers .station .station-label .station-name .station-name-sub span{margin-right:0;display:block}.stations-list.is-covers .station .station-label .station-toggle-favourite{flex:none;width:100%;align-items:center;justify-content:center;padding:0 .5rem;margin:.75rem 0 .25rem}.muted{color:var(--color-muted)}.spin{animation:rotate 2s linear infinite}@keyframes rotate{to{transform:rotate(360deg)}}@media (min-width: 1000px) and (min-height: 600px){.hide-desktop{display:none!important}}#miniplayer{position:fixed;bottom:4rem;left:.5rem;right:.5rem;z-index:100}#miniplayer .miniplayer-container{border-radius:var(--radius);background:var(--background-miniplayer);color:var(--color-miniplayer);padding:0 .5rem;max-width:800px;margin:auto;overflow:hidden}#miniplayer .miniplayer-container .station:hover{background-color:transparent}#miniplayer .miniplayer-container .station-name .station-name-main{font-weight:600}#miniplayer .miniplayer-container .station-name .station-name-sub{color:var(--color-miniplayer);max-height:2rem;text-overflow:ellipsis;overflow:hidden}#miniplayer .miniplayer-container .sub{display:none}#miniplayer .miniplayer-container .sub .controls{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0 1rem;margin-bottom:1rem;z-index:15}#miniplayer .miniplayer-container .sub .controls .toggle-playback{flex:0 0 4rem;width:4rem;height:4rem;background:var(--primary);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:1rem}#miniplayer .miniplayer-container .sub .controls .toggle-playback img{height:2.5rem}#miniplayer .miniplayer-container .sub .controls .start-casting{flex:0 0 3rem;width:3rem;height:3rem;background:var(--background-elevated);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:1rem}#miniplayer .miniplayer-container .sub .controls .start-casting.is-casting{background:var(--secondary)}#miniplayer .miniplayer-container .sub .controls .start-casting img{height:2rem}#miniplayer .miniplayer-container .sub .volume-control{margin-left:auto}#miniplayer .miniplayer-container .sub .volume-control .volume{-webkit-appearance:none;width:100%;height:.75rem;border-radius:.5rem;background:var(--background-elevated);outline:none}#miniplayer .miniplayer-container .sub .volume-control .volume::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:25px;height:25px;border-radius:50%;background:var(--secondary);cursor:pointer}#miniplayer .miniplayer-container .sub .volume-control .volume::-moz-range-thumb{width:25px;height:25px;border-radius:50%;background:var(--secondary);cursor:pointer}#miniplayer .miniplayer-container .sub .content{padding:0 1rem}#miniplayer .miniplayer-container .sub .content .station-metadata{margin-top:1rem}@media (min-width: 1000px) and (min-height: 600px){#miniplayer{top:0;right:0;left:auto;bottom:0;width:400px;padding:1rem}#miniplayer .miniplayer-container{margin-left:auto;margin-right:0;height:100%;background:var(--background-surface);color:var(--color-text)}#miniplayer .miniplayer-container .station{flex-direction:column}#miniplayer .miniplayer-container .station .station-cover{width:100%;margin-bottom:1rem}#miniplayer .miniplayer-container .station-label-miniplayer{display:none}#miniplayer .miniplayer-container .sub{display:block}}#player .main{background:linear-gradient(145deg,var(--background-color) 0%,var(--primary) 100%);position:fixed;top:0;left:0;right:0;bottom:25vh;z-index:1;display:flex;justify-content:center;align-items:center}#player .main .background{position:absolute;top:-1.5rem;left:-1.5rem;right:-1.5rem;bottom:1.5rem;background:no-repeat 50% 50%;background-size:cover;filter:blur(1.5rem);opacity:.5}#player .main .content{text-align:center;margin-bottom:25vh}#player .main .content .station-name{margin-bottom:1.5rem}#player .main .content .station-cover{width:clamp(150px,30vh,300px);height:clamp(150px,30vh,300px);margin:auto auto 1rem;display:flex;justify-content:center;align-items:center}#player .main .content .station-cover img{max-width:100%;max-height:100%;border-radius:var(--radius)}#player .main .content .station-metadata{font-size:1.25rem;margin-bottom:.5rem;max-height:3.75rem;overflow:hidden;text-overflow:ellipsis}#player .sub{background:var(--background-color);border-radius:2rem;z-index:10;margin-top:55vh;min-height:calc(75vh + 2rem)}#player .sub .controls{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:2rem;position:sticky;top:0;background:var(--background-color);border-radius:2rem;z-index:15}#player .sub .controls .toggle-playback{flex:0 0 4rem;width:4rem;height:4rem;background:var(--primary);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:1rem}#player .sub .controls .toggle-playback img{height:2.5rem}#player .sub .controls .start-casting{flex:0 0 3rem;width:3rem;height:3rem;background:var(--background-elevated);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:1rem}#player .sub .controls .start-casting.is-casting{background:var(--secondary)}#player .sub .controls .start-casting img{height:2rem}#player .sub .volume-control{margin-left:auto}#player .sub .volume-control .volume{-webkit-appearance:none;width:100%;height:.75rem;border-radius:.5rem;background:var(--background-elevated);outline:none}#player .sub .volume-control .volume::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:25px;height:25px;border-radius:50%;background:var(--secondary);cursor:pointer}#player .sub .volume-control .volume::-moz-range-thumb{width:25px;height:25px;border-radius:50%;background:var(--secondary);cursor:pointer}#player .sub .content{padding:0 2rem}#search{padding:2rem}#search .search-form{margin:.5rem 0}#search .search-form input{background:var(--background-elevated);color:var(--color-text);padding:.5rem 1rem;border:1px solid var(--background-elevated);border-radius:var(--radius);width:100%;font-size:1rem}#search .search-form input:focus{outline:0;box-shadow:0 0 0 .25rem var(--primary)}#search .search-countries{display:flex;flex-wrap:wrap}#search .search-countries div{padding:.125rem .5rem;cursor:pointer;border-radius:.25rem}#search .search-countries div:hover{background-color:var(--background-elevated)}
