:root{--debug-mode: 0}.cd-player-container{min-height:100vh;background-color:transparent;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem;position:relative;overflow-x:hidden;width:100%;max-width:100vw}.cd-player-wrapper{position:relative;max-width:800px;width:100%;margin:0 auto;padding-top:20px;padding-bottom:0;z-index:10;display:inline-block;transform:scale(var(--cd-player-scale, .85));transform-origin:center top}.walkman-image{max-width:100%;width:100%;height:auto;display:block;user-select:none;pointer-events:none;object-fit:contain}.display-overlay{position:absolute;top:40%;left:14%;width:25.6%;height:8.8%;background:transparent;border-radius:2px;padding:4px 6px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:none;border:calc(2px * var(--debug-mode)) solid red}.display-screen{color:#2d364c;font-family:overtime-lcd-pro,sans-serif;font-weight:300;font-style:normal;font-size:clamp(1rem,.8vw,.6rem);line-height:1.1;display:flex;flex-direction:column;justify-content:flex-start;gap:.1em;height:100%;text-shadow:none}.display-line{display:flex;justify-content:space-between;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:1em}.track-number{font-weight:700;font-size:1.15em;letter-spacing:.5px}.track-time{font-size:.95em;margin-left:auto;font-weight:300;letter-spacing:.5px}.track-filename{font-weight:700;font-size:.7em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:.3px;color:#2d364c;width:100%;max-width:100%;min-width:0}.playlist-info{font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:.7em;color:#2d364c;display:flex;align-items:center;justify-content:flex-start;gap:.3em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:0;margin-left:0%}.playlist-number{font-weight:700;letter-spacing:.2px}.playlist-name{font-weight:800;letter-spacing:.2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-name{font-weight:700;font-size:1.05em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:.3px}.filename{font-size:.8em;color:#2d364c;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.9;font-weight:300;font-style:italic}.duration{font-size:.75em;color:#2d364c;opacity:.8;font-weight:300;font-style:normal}.controls-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.control-button{position:absolute;cursor:pointer;pointer-events:all;border-radius:50%;transition:transform .1s ease,background .2s ease;z-index:10;border:calc(1px * var(--debug-mode)) solid red;outline:calc(.01px * var(--debug-mode)) solid red;opacity:calc(.8 * var(--debug-mode));background:rgba(255,0,0,calc(.1 * var(--debug-mode)));box-shadow:0 0 0 calc(1px * var(--debug-mode)) red}.control-button:hover{transform:scale(1.05);background:radial-gradient(circle at center,rgba(0,0,0,.4) 0%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.1) 70%,transparent 100%);box-shadow:0 2px 8px #0003}.control-button:active,.control-button.pressed{transform:scale(.98)}.control-button.playing{animation:none}.control-button.play-pause{top:39%;right:23.8%;width:8%;height:8%;min-width:45px;min-height:45px;max-width:65px;max-height:65px}.control-button.previous{top:40%;right:31.5%;width:7%;height:7%;min-width:32px;min-height:32px;max-width:48px;max-height:48px}.control-button.next{top:40%;right:19%;width:7%;height:7%;min-width:32px;min-height:32px;max-width:48px;max-height:48px}.control-button.stop{top:41.5%;right:42.5%;width:6.5%;height:6.5%;min-width:30px;min-height:30px;max-width:42px;max-height:42px}.control-button.website{position:absolute;top:51%;right:80%;width:15%;height:25.25px;min-width:33px;min-height:25.25px;max-width:50px;max-height:37.24px;border-radius:3px;text-decoration:none;display:flex;align-items:center;justify-content:center;z-index:10}.playlist-control{position:absolute;top:51%;right:63%;width:15%;height:auto;display:flex;flex-direction:row;align-items:center;justify-content:space-between;pointer-events:all;z-index:10}.control-button.playlist-previous{position:relative;top:auto;right:auto;left:0;width:47.52%;height:25.25px;min-width:33px;min-height:25.25px;max-width:50px;max-height:37.24px;border-radius:3px;flex:1}.control-button.playlist-next{position:relative;top:auto;right:auto;left:auto;width:47.52%;height:25.25px;min-width:33px;min-height:25.25px;max-width:50px;max-height:37.24px;border-radius:3px;flex:1}.volume-control{position:absolute;top:51%;right:41%;width:18%;height:auto;display:flex;flex-direction:row;align-items:center;justify-content:space-between;pointer-events:all;z-index:10}.control-button.volume-down{position:relative;top:auto;right:auto;left:0;width:48%;height:32px;min-width:38px;min-height:28px;max-width:55px;max-height:38px;border-radius:3px;flex:1}.control-button.volume-up{position:relative;top:auto;right:auto;left:auto;width:48%;height:32px;min-width:38px;min-height:28px;max-width:55px;max-height:38px;border-radius:3px;flex:1}.button-array-container{margin-top:-20px;display:flex;justify-content:center;align-items:flex-start;gap:4px;z-index:10;transform:scale(var(--cd-player-scale, .85));transform-origin:center top;position:relative;margin-bottom:100px;width:100%;max-width:100%;overflow-x:hidden}.control-button-array{display:flex;justify-content:center;align-items:center}.button-grid{display:grid;grid-template-columns:repeat(2,auto);grid-template-rows:repeat(4,auto);gap:4px;padding:0;width:fit-content}.playlist-panel{font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.playlist-track-list-mobile::-webkit-scrollbar{display:none}@media(max-width:768px){.cd-player-container{padding:1rem}.cd-player-wrapper{max-width:100%;width:100%;display:inline-block;transform:scale(1)}.button-array-container{transform:scale(1);margin-top:15px;flex-direction:column;align-items:center}.button-grid{gap:4px;padding:0}.display-overlay{top:41%;left:14.5%;width:28%;height:10%;padding:4px 6px}.display-screen{font-size:clamp(.5rem,2vw,.75rem)}.control-button.play-pause{min-width:35px;min-height:35px}.control-button.previous,.control-button.next{min-width:25px;min-height:25px}.control-button.stop{min-width:20px;min-height:20px}.control-button.website,.control-button.playlist-previous,.control-button.playlist-next,.control-button.volume-down,.control-button.volume-up{min-width:25px;min-height:20px}}@keyframes blink{0%{opacity:1}50%{opacity:.3}to{opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes slide{0%{transform:translate(0)}to{transform:translate(100%)}}.loading-text{animation:blink 1s infinite,pulse 2s infinite;font-weight:700;letter-spacing:1px;position:relative}.loading-text:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(45,54,76,.3),transparent);animation:slide 1.5s infinite}.error-overlay{position:absolute;top:40%;left:14%;width:25.6%;height:8.8%;background:#2d364cf2;z-index:100;display:flex;align-items:center;justify-content:center;border-radius:2px;pointer-events:all}.error-content{display:flex;align-items:center;gap:6px;color:#efefef;font-family:overtime-lcd-pro,sans-serif;font-size:.7rem;padding:0 4px;width:100%}.error-icon{font-weight:700;color:#f44;flex-shrink:0}.error-message{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.error-dismiss{background:transparent;border:none;color:#efefef;cursor:pointer;font-size:1.2rem;font-weight:700;line-height:1;padding:0 4px;flex-shrink:0;transition:opacity .2s ease,transform .2s ease;opacity:.7}.error-dismiss:hover{opacity:1;transform:scale(1.1)}.error-dismiss:active{transform:scale(.95)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;overflow-x:hidden}body{background-color:#efefef;background-image:url(/bg.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed;position:relative;min-height:100vh}.neuko-logo{position:fixed;top:20px;left:20px;height:122px;width:auto;max-width:calc(100vw - 40px);max-height:calc(100vh - 40px);z-index:5;cursor:pointer;transition:opacity .2s ease;object-fit:contain}.neuko-logo:hover{opacity:.8}@media(max-width:768px){.neuko-logo{height:auto;width:calc(100vw - 40px);max-width:calc(100vw - 40px);max-height:none;top:20px;left:20px;position:fixed;object-fit:contain}}@media(max-width:480px){.neuko-logo{width:calc(100vw - 40px);max-width:calc(100vw - 40px);max-height:none;top:20px;left:20px}}#root{width:100%;height:100%}main{width:100%;max-width:100vw;overflow-x:hidden}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#efefef}::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#aaa}.page-footer{position:fixed;bottom:20px;left:50%;transform:translate(-50%);font-size:.75rem;color:#bbb;font-weight:300;z-index:10;text-align:center}.page-footer a{color:#bbb;text-decoration:none;transition:opacity .2s ease}.page-footer a:hover{opacity:.7}@media(max-width:768px){.page-footer{bottom:10px;font-size:.7rem}}
