body{background-color:#111;margin:0;font-family:Visby Round,-apple-system,BlinkMacSystemFont,sans-serif}header{color:#fff;height:50px;display:flex;justify-content:space-between;padding-inline:50px;align-items:center}header img{height:100%;width:auto}nav ul{display:flex;gap:20px;list-style:none;margin:0;padding:0}nav li:hover,nav li:focus{background-color:#ffffff1a;outline:none}nav li a{color:#fff;text-decoration:none;display:block;padding:10px;font-size:.8rem;font-weight:bolder}.scrollable{height:calc(100vh - 80px);overflow-y:auto}main{color:#fff;margin:10px 10px 80px;padding-inline:100px}.feed{font-weight:bolder;font-size:large}.feed a{padding:5px;color:gray}.feed a.active{color:#fff}#streams{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center;gap:20px}.stream{text-decoration:none;aspect-ratio:1 / 1}.stream .status{text-align:center;color:#fff}.stream img{width:50px;height:50px}.stream .status.live{color:green}.stream .status.loading{color:orange}.stream .status.offline{color:red}.stream .status.failed{color:#000}#submissions_topbar{display:flex;justify-content:space-between;padding:15px}#submissions_topbar h1{margin:0}button{border:1px solid #fff;background-color:#000;border-radius:.4em;cursor:pointer;padding:.6em 1.2em .6em 1em;transition:all ease-in-out .2s;font-size:16px}button span{display:flex;justify-content:center;align-items:center;color:#fff;font-weight:600}button:hover{background-color:#2b2b2b}@media(max-width:600px){header{padding-inline:20px}#submit #box{flex-direction:column}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.volumeSlider{display:none}.volumeControl:hover .volumeSlider{display:block}.volume-slider::-webkit-slider-thumb{appearance:none;width:15px;height:3px;background:#fff;border:none;margin-top:-6px}.volume-slider::-moz-range-thumb{width:15px;height:3px;background:#fff;border:none}.table{cursor:default}.tableHeader{display:flex;height:36px;text-transform:uppercase;font-size:12px;font-weight:800;line-height:20px;color:gray}.tableHeader span{box-sizing:border-box;height:100%;overflow:hidden;padding-right:16px;text-overflow:ellipsis;white-space:nowrap}.indexColumn{flex:0 0 58px;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:0;margin:0}.titleColumn{align-items:center;display:flex;flex:1 0 228px}.artistColumn{align-items:center;display:flex;flex:1 1 170px}.albumColumn{align-items:center;display:flex;flex:1 1 112px}.timeColumn{align-items:center;display:flex;flex:1 1 66px;max-width:5.5rem;min-width:48px;text-align:right;white-space:nowrap}.uploadedColumn{align-items:center;display:flex;flex:1 1;min-width:140px}.contextColumn{align-items:center;display:flex;flex:0 0 100px;justify-content:flex-end;text-align:right}.tableRow{color:#fff;contain:strict;display:flex;height:48px;overflow:hidden;overflow-y:hidden;font-size:14px;font-weight:500}.tableRow.playing{color:#40e0d0}.tableRow:hover{background-color:#ffffff1a}.tableRow:hover .playIcon{opacity:1}.tableRow div{box-sizing:border-box;height:100%;padding-right:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flexWrap{align-items:center;display:flex;gap:10px;min-width:0}.titleCell{width:100%}.artistText{display:block;overflow:hidden;text-overflow:ellipsis;white-space:pre}.imageContainer{position:relative;width:42px;height:24px}.cover{display:block;opacity:1;transition:opacity .15s ease;width:42px}.coverImage{flex-shrink:0;width:42px;height:42px;object-fit:cover;object-position:center;align-self:center;background-color:#cba3ff;border-radius:3px}.playIcon{position:absolute;top:0;left:0;width:42px;height:42px;opacity:0;transition:opacity .3s ease;cursor:pointer}.playingIcon{position:absolute;top:0;left:0;width:42px;height:42px;transition:opacity .3s ease;cursor:pointer}@media(max-width:1000px){.uploadedColumn{display:none}}@media(max-width:900px){.timeColumn{display:none}}#submit{display:flex;justify-content:center;padding:20px}#submit input,#submit textarea{background-color:#222;color:#fff;border:1px solid #222}#submit #box input{width:100%;box-sizing:border-box;padding:8px;margin-bottom:8px}#submit button{color:#fff;padding:10px 20px;border:none;border-radius:4px;cursor:pointer;background-color:#333}#submit #box #topic .buttons button.back{background-color:#222;margin-right:10px}#submit #box{display:flex;position:relative;align-items:center;gap:20px;padding:20px;width:500px;height:250px;border:1px solid #ccc;border-radius:8px}#submit #box h2{margin:5px}#submit #box #selectType{width:100%;height:100%;display:flex;text-align:center;flex-direction:column}#submit #box #selectType .type{flex:1;align-content:center;cursor:pointer}#submit #box #selectType .type:hover{background-color:#1a1a1a}#submit #box #track,#submit #box #topic{display:flex;flex-direction:column;width:100%;height:100%}#submit #box #topic .image{width:64px;height:64px;background-color:#ccc;border-radius:5px}#submit #box #topic .image img{width:100%;height:auto;object-fit:cover;border-radius:5px}#submit #box #topic textarea{width:100%;box-sizing:border-box;padding:8px;margin-bottom:5px;margin-top:5px}#submit #box #topic .buttons{text-align:end}#submit #audioInput{position:absolute;margin:0;padding:0;top:0;left:0;width:100%;height:100%;outline:none;cursor:pointer;opacity:0}#box img{border:#000 1px solid;border-radius:10px;object-fit:scale-down;background-color:#6c9eff}#topics{display:flex;flex-direction:column;align-items:center;gap:10px;margin:20px}#topics .item{display:flex;width:100%;max-width:1000px;border-radius:5px;padding:5px;gap:5px;cursor:pointer;color:#d3d3d3;border:1px solid grey}#topics .item:hover{color:#fff;border:1px solid white}#topics .item img{height:100px;width:100px;border-radius:5px}#topics .item .info{flex:1;margin-inline:5px;min-width:0}#topics .item .info h3{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-top:5px;margin-bottom:0}#topics .item .info .detail{color:gray;font-size:smaller}#topics .item .info .detail span{color:#d3d3d3}#topics .item:hover .info .detail span{color:#fff}