:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f5f8f2;background:#0c140d;color-scheme:dark}*{box-sizing:border-box}body{margin:0}header{max-width:760px;margin:auto;display:flex;align-items:center;gap:9px;padding:calc(20px + env(safe-area-inset-top)) 20px 20px;font-size:21px}header b span,.logo{color:#b4ff35}.logo{font-size:28px}header small{margin-left:auto;font:700 9px monospace;letter-spacing:1.4px;color:#b0bfad}main{max-width:760px;margin:auto;padding:0 16px 50px}.player{background:#162219;border-radius:14px;padding:18px}.now{display:flex;justify-content:space-between;gap:12px}.now div{min-width:0}label{font-size:10px;font-weight:700;letter-spacing:1.4px;color:#b4ff35}.now h1{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:8px 0 14px}.now strong{font:500 27px monospace;color:#b4ff35}input[type=range]{accent-color:#b4ff35;width:100%;cursor:pointer}.times{display:flex;justify-content:space-between;font:10px monospace;color:#b0bfad}.visual{height:72px;display:flex;align-items:center;justify-content:center;overflow:hidden;white-space:nowrap;color:#b4ff35;opacity:.7;letter-spacing:4px}.controls{display:flex;align-items:center;gap:3px}.spacer{flex:1}button,.add{font:inherit;color:#b0bfad;background:transparent;border:0;border-radius:8px;cursor:pointer}button{min-height:40px;padding:8px}.controls button{min-width:35px;font-size:16px}.controls #skip{font-size:10px;font-weight:700}.controls button.active{color:#b4ff35;background:#293b22}.controls .primary{background:#b4ff35;color:#0c140d;width:44px}.volume{display:flex;align-items:center;gap:10px;color:#b4ff35;margin-top:15px}.volume input{max-width:220px}.listhead{display:flex;align-items:center;justify-content:space-between;padding:24px 4px 14px}.listhead p{font-size:11px;color:#b0bfad;margin:5px 0}.add{padding:10px 12px;border:1px solid #394837;font-size:13px;color:#f5f8f2}.track{display:flex;align-items:center;background:#ffffff08;border-radius:7px;margin:3px 0}.track.selected{background:#b4ff351a}.trackname{text-align:left;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1;color:#eee;font-size:13px}.selected .trackname{color:#b4ff35}#empty{text-align:center;padding:45px 10px;color:#b0bfad;font-size:13px}#empty div{font-size:36px;color:#b4ff35}#empty b{display:block;color:#fff;margin-top:8px}#empty p{line-height:1.6}#message{color:#ffbf73;font-size:13px}.eqhead{display:flex;justify-content:space-between;align-items:center}#bands{display:flex;justify-content:space-between;gap:4px}#bands>div{display:flex;flex-direction:column;align-items:center;width:10%;gap:4px;color:#b0bfad}#bands input{writing-mode:vertical-lr;direction:rtl;height:90px;width:20px}#bands small{font:9px monospace}dialog{width:min(90%,420px);border:1px solid #394837;border-radius:14px;background:#162219;color:#fff}dialog::backdrop{background:#000a}dialog h2{font-size:18px}dialog p{overflow-wrap:anywhere;color:#b0bfad}dialog button{display:block;color:#b4ff35;text-align:left}dialog form{border-top:1px solid #394837;margin-top:12px}@media(max-width:420px){header small{display:none}.controls{gap:0}.controls button{min-width:30px;padding:6px}.player{padding:15px}}.modes{display:flex;gap:6px;margin:14px 4px 0}.modes button{padding:6px 14px;border:1px solid #394837;min-height:34px;font-size:12px}.modes button.active{background:#b4ff35;color:#0c140d;border-color:#b4ff35}.listactions{display:flex;gap:6px}.listhead{gap:6px}.listhead .add{white-space:nowrap}.volume input{min-width:0;flex:1}.volume span{font-size:11px}.visual{width:100%;height:72px;display:block}#folderInfo{font-size:12px;color:#b0bfad;display:flex;align-items:center;gap:8px}#folderInfo[hidden]{display:none}#folderInfo span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#folderInfo button{color:#b4ff35;font-size:12px;white-space:nowrap}dialog{max-height:85dvh;overflow:auto}dialog .dialoghead{display:flex;align-items:center;justify-content:space-between;position:sticky;top:-1em;background:#162219;z-index:1}dialog form label{display:block;color:#b0bfad;font-size:12px;margin:12px 0}dialog form input,dialog form textarea{display:block;width:100%;margin-top:5px;padding:9px;border:1px solid #43513e;border-radius:6px;background:#0c140d;color:#fff;font:inherit;font-size:14px}dialog form textarea{min-height:70px;resize:vertical}dialog .hint{font-size:12px;line-height:1.5}dialog button.action{background:#b4ff35;color:#0c140d;text-align:center;padding:10px 18px}.detailActions{border-top:1px solid #394837;margin-top:15px}.detailActions button{width:100%}#presets{background:#0c140d;color:#eee;border:1px solid #394837;border-radius:5px;padding:5px;max-width:130px}header{gap:8px;font-size:20px;font-weight:700}.logo{display:block;flex:none;width:25px;height:25px}.player{padding:18px}.now h1{margin:5px 0 13px}.controls{gap:2px;margin-top:13px}.controls button{display:grid;place-items:center;height:34px;min-height:34px;min-width:0;width:clamp(30px,8vw,38px);padding:8px;background:#ffffff0f;color:#fff;border-radius:7px}.controls button svg{width:15px;height:15px;stroke-width:2}.controls button:not(.primary):nth-last-child(-n+4){width:32px;color:#b0bfad;border-radius:6px}.controls button.active:not(.primary){color:#b4ff35;background:#ffffff0f;filter:drop-shadow(0 0 3px #b4ff3580)}.controls .primary{width:44px;background:#b4ff35;color:#0c140d}.controls .spacer{min-width:2px}.trash-icon{position:relative;display:flex}.trash-icon i{position:absolute;top:7px;left:-1px;width:17px;height:1.5px;background:currentColor;transform:rotate(-45deg);box-shadow:0 0 0 1px #253125}.volume{margin-top:13px;gap:7px;color:#b0bfad}.volume-icon{flex:none;width:15px;height:15px;color:#b4ff35}.modes{gap:8px;margin-top:12px}.modes button{border:0;background:#ffffff0f;border-radius:6px;font-size:11px;font-weight:600;padding:6px 11px;min-height:32px}.modes button.active{border:0}.listhead{padding:20px 4px}.listactions{gap:8px}.listactions .add{border:0;background:#ffffff0f;display:flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:8px 10px}.listactions svg{width:16px;height:16px}.track{margin:2px 0}#empty{padding:15px 10px}#empty svg{width:32px;height:32px;color:#b4ff35;opacity:.7}button:disabled{opacity:.35;cursor:default}@media(max-width:500px){.listactions .add span{display:none}.listactions .add{width:38px}.controls button{width:clamp(28px,8vw,38px)}.controls button:not(.primary):nth-last-child(-n+4){width:clamp(28px,7vw,32px)}}input[type=range]{appearance:none;-webkit-appearance:none;background:transparent;height:20px;margin:0;accent-color:#b4ff35}input[type=range]::-webkit-slider-runnable-track{height:6px;background:#37433a;border-radius:8px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;margin-top:-7px;border-radius:50%;background:#dedede;border:0}input[type=range]::-moz-range-track{height:6px;background:#37433a;border-radius:8px}input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#dedede;border:0}#bands input{appearance:auto;-webkit-appearance:auto;width:20px;height:90px}.now h1{margin:5px 0 12px}.times{margin-top:6px}.controls{margin-top:16px}.volume{margin-top:14px}.track{min-height:38px;background:#ffffff08}.trackname{min-width:0;display:flex;align-items:center;gap:11px;font-size:13px;font-weight:500;padding:8px 12px;color:#fff}.track-number,.track-duration{font:11px ui-monospace,monospace;color:#b0bfad;flex:none}.track-number{width:24px;text-align:center}.track-note{display:flex;color:#b0bfad;flex:none}.track-note svg{width:13px;height:13px}.selected .track-note{color:#b4ff35}.track-del{font:700 9px ui-monospace,monospace;color:#f39945;flex:none}.track-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;text-align:left}.track-menu{color:#b0bfad;font-size:18px;min-width:38px}footer{font-size:9px;font-weight:500;letter-spacing:1.2px;color:#b0bfad;padding:24px 0 0}main{min-height:calc(100dvh - 65px - env(safe-area-inset-top));display:flex;flex-direction:column;padding-bottom:calc(16px + env(safe-area-inset-bottom))}footer{margin-top:auto;padding:24px 0 0}#empty[hidden]{display:none}.update-notice{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;padding:8px 12px;background:#162219;border-radius:8px;color:#f5f8f2;font-size:12px}.update-notice[hidden]{display:none}.update-notice button{min-height:36px;color:#b4ff35;font-weight:600}.disk-actions{display:flex;gap:8px;flex-wrap:wrap;margin:0 4px 6px}.disk-actions button{background:#ffffff0f;color:#b4ff35;font-size:12px;padding:5px 10px;min-height:34px}.disk-actions button[hidden]{display:none}#diskStatus{font-size:12px;color:#b0bfad;margin:0 4px;line-height:1.4}#diskPicker #diskPath{word-break:break-all;font-size:12px}#diskFolders button{width:100%;border-bottom:1px solid #394837;color:#f5f8f2}#diskPicker #diskSelect{background:#b4ff35;color:#0c140d;padding:8px 16px;margin-top:12px}.header-actions{position:relative;margin-left:auto;display:flex;align-items:center;gap:8px}header small{margin-left:auto}.main-menu>summary{display:grid;place-items:center;width:38px;height:38px;border-radius:8px;list-style:none;cursor:pointer;background:#ffffff0f;color:#f5f8f2}.main-menu summary::-webkit-details-marker{display:none}.main-menu>summary svg{width:20px;height:20px}.main-menu>summary:focus-visible,.menu-panel summary:focus-visible{outline:2px solid #b4ff35;outline-offset:2px}.menu-panel{position:absolute;z-index:5;top:44px;right:0;min-width:200px;padding:8px;background:#162219;border:1px solid #394837;border-radius:10px;box-shadow:0 10px 24px #0009;font-size:13px}.auth-menu>summary{cursor:pointer;list-style:none;padding:10px;color:#f5f8f2}.auth-menu>summary:after{content:"⌄";float:right;color:#b0bfad}.auth-options{border-top:1px solid #394837;padding-top:4px}.auth-options button{width:100%;text-align:left;color:#b4ff35;font-size:13px}.auth-options button[hidden],.account-avatar[hidden],.account-avatar img[hidden]{display:none}.account-avatar{position:relative;display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;overflow:hidden;background:#293b22;color:#b4ff35}.account-avatar svg{width:18px;height:18px}.account-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.sync-panel{margin:12px 4px 14px;padding:14px;border:1px solid #33492e;border-radius:10px;background:#162219}.sync-panel[hidden]{display:none}.sync-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;font-weight:600;color:#f5f8f2}.sync-heading strong{font:600 12px ui-monospace,monospace;color:#b4ff35;white-space:nowrap}.sync-bar{height:5px;background:#344138;border-radius:5px;overflow:hidden;margin:10px 0 8px}.sync-bar>div{height:100%;background:#b4ff35;border-radius:5px;transition:width .2s}.sync-hint{font-size:11px;line-height:1.4;color:#b0bfad}.sync-error{border-color:#855c38}.sync-error .sync-heading strong{color:#ffbf73}.track{position:relative;overflow:hidden}.trackname:disabled{opacity:1;color:#b0bfad;cursor:default}.track-download-status{font-size:10px;color:#b0bfad;white-space:nowrap;flex:none}.track.is-downloading .track-download-status{color:#b4ff35}.track.is-failed .track-download-status{color:#ffbf73}.track-download-bar{position:absolute;bottom:0;left:0;right:0;height:2px;background:#344138}.track-download-bar[hidden]{display:none}.track-download-bar>span{display:block;height:100%;background:#b4ff35;transition:width .15s}.track-download-bar.indeterminate>span{width:35%!important;animation:sync-moving 1.2s ease-in-out infinite}@keyframes sync-moving{0%{transform:translate(-100%)}to{transform:translate(300%)}}@media(prefers-reduced-motion:reduce){.track-download-bar.indeterminate>span{animation:none;width:35%!important}}.add-menu{position:relative}.add-menu>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:8px 10px;background:#ffffff0f;border:0}.add-menu>summary::-webkit-details-marker{display:none}.add-menu>summary:focus-visible{outline:2px solid #b4ff35;outline-offset:2px}.add-options{position:absolute;z-index:4;right:0;top:42px;min-width:205px;padding:6px;background:#162219;border:1px solid #394837;border-radius:10px;box-shadow:0 10px 24px #0009}.add-options button{display:block;width:100%;text-align:left;color:#f5f8f2;font-size:13px}.add-options button:hover{background:#ffffff0f}.add-options button[hidden]{display:none}@media(max-width:500px){.add-menu>summary{width:38px}.add-menu>summary span{display:none}}#message:empty,#diskStatus:empty{display:none}#nativeReturnNotice a{color:#b4ff35;font-weight:600;white-space:nowrap;padding:8px;text-decoration:none}.sleep-menu{border-top:1px solid #344138;margin-top:14px;padding-top:7px}.sleep-menu>summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;min-height:34px;color:#b0bfad;font-size:12px;font-weight:600}.sleep-menu>summary::-webkit-details-marker{display:none}.sleep-menu>summary:focus-visible{outline:2px solid #b4ff35;outline-offset:2px}.sleep-menu>summary svg{width:16px;height:16px;color:#b4ff35}.sleep-menu #sleepSummary{margin-left:auto;font:12px ui-monospace,monospace}.sleep-menu.sleep-active #sleepSummary{color:#b4ff35}.sleep-content{padding:4px 0 6px}.sleep-content p{font-size:12px;color:#b0bfad;margin:4px 0 10px}.sleep-presets{display:flex;gap:6px;flex-wrap:wrap}.sleep-presets button,.sleep-input-row button{min-height:34px;padding:6px 11px;background:#ffffff0f;color:#f5f8f2;font-size:12px}.sleep-content form{margin-top:12px}.sleep-content form label{color:#b0bfad;letter-spacing:0;font-size:11px}.sleep-input-row{display:flex;gap:8px;margin-top:6px}.sleep-input-row input{width:72px;border:1px solid #43513e;border-radius:6px;background:#0c140d;color:#fff;padding:8px;font:inherit;font-size:14px}.sleep-input-row button{color:#b4ff35}.sleep-content #sleepCancel{padding:6px 0;color:#b0bfad;font-size:11px}.sleep-content #sleepStatus:empty{display:none}
