:root{font-family:var(--font1),Helvetica,Arial,sans-serif;background-color:var(--BGcolour)}html,body{overflow:hidden;margin:0}.highlight{color:var(--colour2)}h1{color:var(--colour1);text-align:center}:root{--BGcolour2: #130c0696;--BGcolour2L: #0000006c;--colour1: hsl(0, 0%, 100%);--colour1D:rgb(55, 55, 55);--colour2: #9ddeff;--font1: "Outfit"}.main-content{flex:1;padding:2rem;box-sizing:border-box;width:100%;display:flex;flex-direction:column}#background{z-index:-100;position:fixed;top:0;left:0;width:100vw;height:100vh;min-width:100vw;min-height:100vh;object-fit:cover;will-change:opacity;-webkit-user-select:none;user-select:none;pointer-events:none}*{font-family:var(--font1),Helvetica,Arial,sans-serif;color:var(--colour1);letter-spacing:2px}.panel,.draggablepanel{margin:10px;position:fixed;background-color:var(--BGcolour2);border-radius:.6rem;border:1px solid var(--colour1D);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden;bottom:0}button,a{font-size:1rem;font-weight:200;background-color:transparent;border:none;padding:10px;transition:transform .5s ease;-webkit-user-select:none;user-select:none;text-decoration:none}li{text-align:left;list-style:none;list-style-position:inside}input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{background:var(--BGcolour2L);border-radius:100000000px;height:.5rem}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;margin-top:-1px;background-color:var(--colour1);color:var(--colour1D);height:.6rem;width:.6rem;border-radius:1000px}input[type=color]{padding:0;width:20px;height:15px;margin-left:10px}input[type=color]::-moz-color-swatch{border:none}input[type=color]::-webkit-color-swatch-wrapper{padding:0;border-radius:0}input[type=color]::-webkit-color-swatch{border:none}h3,p,label{font-weight:300;text-align:center}h3{filter:drop-shadow(0 0 1rem var(--colour1))}select{background-color:transparent;border:none}button:hover,a:hover{filter:drop-shadow(0 0 .5rem var(--colour1));cursor:pointer;transform:scale(1.05)}button:active,a:active{opacity:70%}form{margin:0 auto 10px;display:grid;max-width:60%;gap:10px}input[type=text],input[type=submit]{background-color:var(--BGcolour2L);border:1px solid var(--colour1D);border-radius:10px;font-size:.8rem;text-align:center;height:1.5rem}.draggablepanel:hover{transition:max-height 1s ease-out}.draggablepanel .paneltopbar{padding:1px;background-color:var(--BGcolour2L);border-bottom:1px solid var(--colour1D);text-align:right;animation:topbar .3s linear}.draggablepanel .paneltopbar:hover{cursor:grab}#navbar{overflow:hidden;top:0!important;width:fit-content;height:40px;left:0;right:0;margin:10px auto}#navbar .options{justify-content:space-between}#clockpanel h2{font-weight:100;margin:0 auto;font-size:5rem;padding:10px;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 0 .5rem var(--colour1))}#radioselectpanel{width:450px;min-height:400px}#stations{max-height:200px;display:grid;gap:10px;overflow-y:scroll;overflow-x:hidden}#stations button{text-align:left;margin-right:10px;border-radius:.5rem}#stations button:hover{filter:drop-shadow(0 0 0 transparent);background-color:var(--BGcolour2L)}#pomodoropanel{width:320px}#pomodoropanel .val{border:1px solid var(--colour1D);background-color:var(--BGcolour2L);border-radius:5px;min-width:50px;max-width:50px}#pomodoropanel .action{width:100%;text-align:center}.selection{display:flex;padding-left:10px}.selection .right{display:flex;margin-left:auto}#timer h2{font-weight:100;font-size:4rem;text-align:center;margin:0;filter:drop-shadow(0 0 .5rem var(--colour1))}#mixerpanel input{background:transparent}.sliders{justify-content:flex-end;display:grid;padding:10px;line-height:2.5rem}.inputrow{display:flex;justify-content:space-between;gap:10px}.volDisplay{display:none}#bottomnavbar{max-width:398px}#wpScroll{overflow-y:hidden;overflow-x:auto;display:grid;grid-template-columns:auto auto;gap:10px}#wpScroll .preview{border:1px solid var(--colour1D);min-width:220px;max-width:220px;min-height:124px;max-height:124px}#settings .setting{margin-left:10px;padding:10px}#todolistpanel{width:350px}#tasks{min-width:80%;max-width:80%;margin:0 auto 10px;overflow:auto}#task{border:1px solid var(--colour1D);border-radius:1rem;background-color:var(--BGcolour2L);font-size:.8rem;margin-bottom:10px}#addtask{text-align:center}#addtask input[type=text]{width:50%;margin-bottom:10px;margin-right:5px}@keyframes topbar{0%{opacity:0%}to{opacity:100%}}