@charset "UTF-8";
:root{color-scheme:dark;--bg:#111510;--panel:#20251d;--panel2:#292e23;--line:#444b38;--text:#e8e8d7;--muted:#b1b6a2;--accent:#e9b66c;--green:#b9d99a;--screen:#101c12;--radius:12px;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.5}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 10% 0%,#293023 0,transparent 55%),var(--bg);color:var(--text);overflow-wrap:anywhere}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button{min-height:48px;border:1px solid var(--line);border-radius:8px;background:linear-gradient(#333a2b,#242a20);transition:background .15s,border-color .15s,transform .15s}button:hover:not(:disabled){border-color:var(--accent)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}a{color:var(--green)}[hidden]{display:none!important}.app-shell{max-width:1200px;margin:auto;padding:24px max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));padding-top:max(20px,env(safe-area-inset-top))}.masthead{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{display:grid;place-items:center;flex:0 0 44px;height:48px;border:2px solid var(--accent);border-radius:4px;color:var(--accent);font-size:30px;font-weight:850;box-shadow:inset 0 0 0 3px var(--bg)}h1{font-size:clamp(1.3rem,4vw,1.8rem);letter-spacing:.14em;line-height:1.15;margin:0;font-weight:850}.brand p{font: .62rem/1.5 ui-monospace,monospace;letter-spacing:.08em;color:var(--muted);margin:5px 0 0}.small-button{min-width:54px;padding:8px 14px;font:700 .875rem ui-monospace,monospace;color:var(--accent)}.status-strip{display:flex;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;border-block:1px solid var(--line);padding:10px 0;margin-bottom:24px;font:.65rem/1.5 ui-monospace,monospace;letter-spacing:.07em;color:var(--muted)}.status-strip>span:first-child{display:flex;align-items:center;gap:8px}.status-strip i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px #b9d99a55}.workspace{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:24px;align-items:start}.instrument-column{min-width:0}.instrument{padding:14px;background:repeating-linear-gradient(100deg,#ffffff02 0 1px,transparent 1px 5px),linear-gradient(135deg,#606349,#343a2a 65%,#444a34);border:1px solid #74765c;border-radius:14px;box-shadow:inset 0 2px 0 #ffffff20,inset 0 -4px 0 #0005,0 12px 28px #0004}.instrument-top,.instrument-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;color:#e0dfc6;font: .6rem/1.4 ui-monospace,monospace;letter-spacing:.08em}.instrument-top{padding:0 3px 12px}.instrument-bottom{padding:12px 3px 0}.serial{opacity:.8}.screw{width:10px;height:10px;flex:0 0 10px;border-radius:50%;background:linear-gradient(45deg,#b4b5a2 44%,#34382d 45% 55%,#b4b5a2 56%);box-shadow:0 1px 2px #000}.scene-2d{display:grid;grid-template-columns:80px minmax(0,1fr);gap:14px;background:#262b20;padding:14px;border:3px solid #1a1e16;border-radius:8px;box-shadow:0 1px 0 #ffffff25}.speaker{border-radius:50%;align-self:center;aspect-ratio:1;background:repeating-radial-gradient(circle,#10150f 0 3px,#343b2b 4px 5px);border:5px solid #555b43;box-shadow:0 0 0 2px #151a12,inset 0 0 16px #000}.speaker div{width:40%;height:40%;margin:30%;border-radius:50%;background:radial-gradient(circle at 40% 30%,#4a5140,#12170f);box-shadow:0 3px 7px #0008}.readout{min-width:0;background:linear-gradient(#142317,#0b160e);border:1px solid #65714d;border-radius:4px;padding:12px;color:var(--green);box-shadow:inset 0 0 20px #0008}.readout-label{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font:.55rem/1.4 ui-monospace,monospace;letter-spacing:.03em}.display-title{font:700 clamp(.8rem,2vw,1rem)/1.4 ui-monospace,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:10px 0 14px}.frequency{position:relative;display:flex;justify-content:space-between;border-block:1px solid #8da87566;padding:12px 2px 7px;font:.55rem ui-monospace,monospace}.frequency:after{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:repeating-linear-gradient(90deg,#b9d99a77 0 1px,transparent 1px 8px)}.frequency b{font-weight:400}.frequency i{position:absolute;top:-3px;left:42%;height:32px;width:2px;background:var(--accent);box-shadow:0 0 6px #e9b66c66;transition:left .6s}.deck-meters{display:flex;align-items:center;gap:14px;margin-top:14px}.vu-meter{height:49px;position:relative;overflow:hidden;flex:0 0 80px;border:2px solid #252c1d;border-radius:3px;background:linear-gradient(140deg,#c9c3a0,#eee2b8)}.vu-meter:before{content:"88   ·   100";position:absolute;top:4px;left:7px;color:#494a35;font:8px monospace}.vu-meter i{position:absolute;left:39px;bottom:-5px;width:2px;height:41px;background:#ab512e;transform-origin:bottom;transform:rotate(-35deg);transition:transform .35s}.vu-meter span{position:absolute;bottom:2px;left:32px;color:#3d422e;font:bold 10px monospace}.signal-bars{display:flex;align-items:end;height:42px;gap:4px;flex:1}.signal-bars i{display:block;flex:1;height:10%;max-width:9px;background:repeating-linear-gradient(to top,#b9d99a 0 4px,transparent 4px 6px);opacity:.6;transition:height .3s}.is-playing .signal-bars i{animation:signal 1.1s ease-in-out infinite alternate}.is-playing .signal-bars i:nth-child(3n){animation-delay:-.4s;animation-duration:.7s}.is-playing .signal-bars i:nth-child(3n + 1){animation-delay:-.8s;animation-duration:1.4s}@keyframes signal{from{height:15%}to{height:95%}}.decorative-label{font:.45rem/1.4 ui-monospace,monospace;letter-spacing:.05em;opacity:.65;margin:8px 0 0}.scene-3d{height:400px;position:relative;border-radius:8px;overflow:hidden;background:#0a0a08;touch-action:none}.scene-3d canvas{display:block;width:100%;height:100%;touch-action:none}.scene-help{position:absolute;bottom:8px;left:8px;right:8px;text-align:center;font:.6rem ui-monospace,monospace;color:var(--muted);pointer-events:none}.control-panel{padding:22px 4px 0}.eyebrow{font:.62rem/1.5 ui-monospace,monospace;letter-spacing:.12em;color:var(--accent)}.now-playing h2{font-size:clamp(1rem,2.6vw,1.25rem);line-height:1.4;margin:5px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.now-playing p{margin:0;color:var(--muted);font-size:.8rem}.seek-group{margin-top:18px}input[type=range]{appearance:none;-webkit-appearance:none;display:block;width:100%;height:48px;margin:0;background:transparent;cursor:pointer;accent-color:var(--accent);--fill:0%}input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:3px;background:linear-gradient(to right,var(--accent) var(--fill),#48503d var(--fill))}input[type=range]::-moz-range-track{height:5px;border-radius:3px;background:#48503d}input[type=range]::-moz-range-progress{background:var(--accent);height:5px}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:22px;height:22px;border:4px solid var(--accent);border-radius:50%;background:#252c20;margin-top:-8.5px;box-shadow:0 1px 5px #0008}input[type=range]::-moz-range-thumb{width:16px;height:16px;border:4px solid var(--accent);border-radius:50%;background:#252c20}input[type=range]:disabled{opacity:.45;cursor:default}.time-row{display:flex;justify-content:space-between;color:var(--muted);font:.7rem ui-monospace,monospace;margin-top:-3px}.transport{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:16px 0}.icon-button{width:52px;flex:0 1 52px;min-width:48px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:6px}.icon-button svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.mode-button{border-color:transparent;background:transparent;color:var(--muted)}.mode-button span{font:.5rem ui-monospace,monospace;letter-spacing:.03em}.mode-button[aria-pressed=true]{color:var(--accent);background:#e9b66c10;border-color:#e9b66c44}.play-button{flex:0 0 70px;height:70px;border-radius:50%;background:linear-gradient(#ecc58a,#c79755);border:3px solid #e5bd80;color:#25291c;box-shadow:0 0 0 4px #080c0844,inset 0 2px 0 #fff6}.play-button svg{width:30px;height:30px;fill:currentColor;stroke:currentColor;stroke-width:1.2;stroke-linejoin:round}.volume-row{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:8px}.volume-row label{font:.65rem ui-monospace,monospace;color:var(--muted)}.volume-row input{flex:1;min-width:0}.volume-row output{width:38px;flex-shrink:0;text-align:right;font:.7rem ui-monospace,monospace;color:var(--muted)}.library-panel{border:1px solid var(--line);border-radius:var(--radius);background:#20251dcc;overflow:hidden;min-width:0}.library-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:20px 18px 14px}.library-heading h2{font-size:1.15rem;line-height:1.3;margin:4px 0 0}.library-heading h2 span{font: .7rem ui-monospace,monospace;background:#414934;padding:3px 7px;border-radius:4px;vertical-align:middle;margin-left:5px}.add-button{padding:8px 13px;font-size:.8rem;font-weight:650;white-space:nowrap;border-color:#747c5d}.add-button span{color:var(--accent);font-size:1.15rem;margin-right:3px}.search-input{display:block;width:calc(100% - 36px);margin:0 18px 14px;background:#131910;border:1px solid var(--line);border-radius:7px;padding:12px;color:var(--text);font-size:.8rem;min-height:48px}.search-input::placeholder{color:#9caa91}.empty-state{text-align:center;padding:35px 24px 40px}.empty-state>svg{width:64px;height:64px;fill:none;stroke:#8c9a72;stroke-width:1.5}.empty-state h3{font-size:1rem;margin:14px 0 8px}.empty-state p{font-size:.85rem;color:var(--muted);margin:0 auto 20px;max-width:310px}.secondary-button{padding:10px 16px;font-size:.8rem;border-color:#737c5a}.empty-state small{display:block;color:var(--muted);font-size:.7rem;line-height:1.6;max-width:290px;margin:18px auto 0}.track-list{padding:0 8px;margin:0;list-style:none;max-height:480px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#647151 #1b2117}.track-list li+li{border-top:1px solid #3c443029}.track-list button{width:100%;border:1px solid transparent;background:transparent;display:flex;align-items:center;text-align:left;gap:12px;padding:12px 10px;min-height:64px;border-radius:6px}.track-list button:hover{background:#ffffff07}.track-list button[aria-current=true]{background:#b9d99a10;border-color:#b9d99a33}.track-number{font:.7rem ui-monospace,monospace;color:var(--muted);flex:0 0 24px;text-align:center}.track-list button[aria-current=true] .track-number{color:var(--accent)}.track-text{display:block;min-width:0;flex:1}.track-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.86rem;font-weight:550}.track-meta{display:block;color:var(--muted);font-size:.68rem;margin-top:3px}.track-active-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);flex:0 0 6px;visibility:hidden}.track-list button[aria-current=true] .track-active-dot{visibility:visible}.library-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;border-top:1px solid var(--line);font-size:.65rem;color:var(--muted)}.text-button{border:0;background:none;color:var(--muted);font-size:.75rem;padding:4px 6px;text-decoration:underline;text-underline-offset:4px}.no-results{text-align:center;color:var(--muted);font-size:.85rem;padding:20px}.settings-panel{border:1px solid var(--line);border-radius:8px;margin-top:26px;background:#20251d88}.settings-panel summary{padding:15px 18px;min-height:48px;cursor:pointer;font-size:.8rem;color:var(--muted)}.settings-content{padding:0 18px 16px;color:var(--muted);font-size:.8rem;max-width:850px}.settings-content p{margin:8px 0 12px}.settings-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:.75rem}.page-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:24px;font:.55rem/1.6 ui-monospace,monospace;color:#9aa58c;letter-spacing:.08em}.error-message{padding:12px;border:1px solid #d9957255;background:#d9957210;border-radius:6px;font-size:.8rem;color:#f0c1a3}.toast{position:fixed;bottom:max(20px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:14px 20px;background:#e1e6d3;color:#172011;border-radius:8px;box-shadow:0 6px 30px #0006;font-size:.85rem;z-index:20}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:12px;z-index:30;background:var(--accent);padding:12px;color:#111}.skip-link:focus{top:12px}.noscript{padding:24px;color:white;background:#542f21}.document{max-width:760px;margin:auto;padding:32px 22px}.document h1{letter-spacing:0}.document p,.document li{color:var(--muted);font-size:.95rem}.document h2{font-size:1.15rem;margin-top:28px}.document a{display:inline-block;padding-block:12px}.is-playing .vu-meter i{animation:vu 1.7s ease-in-out infinite alternate}@keyframes vu{from{transform:rotate(-25deg)}to{transform:rotate(38deg)}}
@media(min-width:1000px){.instrument-column{position:sticky;top:20px}.track-list{max-height:540px}}
@media(max-width:760px){.app-shell{padding-inline:max(14px,env(safe-area-inset-left)) max(14px,env(safe-area-inset-right));padding-top:max(16px,env(safe-area-inset-top))}.workspace{grid-template-columns:minmax(0,1fr);gap:26px}.instrument-column{position:static}.status-strip{margin-bottom:18px}.scene-3d{height:360px}.control-panel{padding-top:18px}.track-list{max-height:none}.library-heading{padding:18px 16px 14px}.now-playing h2{font-size:1.05rem}.page-footer{font-size:.52rem}.instrument{padding:12px}.scene-2d{grid-template-columns:68px minmax(0,1fr);gap:12px;padding:12px}.serial{font-size:.5rem}}
@media(max-width:370px){.app-shell{padding-inline:max(10px,env(safe-area-inset-left)) max(10px,env(safe-area-inset-right))}.brand{gap:8px}.brand-mark{flex-basis:36px;height:42px;font-size:25px}.brand p{font-size:.52rem}.small-button{min-width:48px;padding-inline:10px}.scene-2d{grid-template-columns:minmax(0,1fr)}.speaker{display:none}.instrument-top{font-size:.52rem}.instrument-bottom{font-size:.5rem}.status-strip{font-size:.57rem}.transport{gap:3px}.play-button{flex-basis:62px;height:62px}.icon-button{flex-basis:48px}.library-heading{padding-inline:12px}.library-heading h2{font-size:1rem}.add-button{padding-inline:10px}.empty-state{padding-inline:16px}.volume-row{gap:8px}}
@media(max-height:540px) and (orientation:landscape){.app-shell{padding-top:10px}.masthead{margin-bottom:10px}.status-strip{margin-bottom:12px}.workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}.scene-2d{grid-template-columns:minmax(0,1fr)}.speaker,.deck-meters,.decorative-label{display:none}.scene-3d{height:270px}.instrument-column{position:static}.track-list{max-height:330px}.library-heading{flex-wrap:wrap}.control-panel{padding-top:12px}}
/* Keep essential labels intact at large Android font scales. */
.masthead,.library-heading{flex-wrap:wrap}.brand{flex:1 1 180px}.brand h1{overflow-wrap:normal;font-size:clamp(1rem,4vw,1.8rem)}.library-heading>div{flex:1 1 150px}.small-button,.add-button{flex-shrink:0}.text-button{white-space:nowrap;flex-shrink:0}.skip-link{top:12px;transform:translateY(-250%);clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.skip-link:focus{transform:none;clip-path:none;width:auto;height:auto;overflow:visible}
/* The APK link belongs to the website, not the already-installed Android shell. */
.download-banner{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin:0 0 24px;padding:18px 20px;border:1px solid #69744e;border-radius:var(--radius);background:linear-gradient(115deg,#303923,#20271b)}.download-copy{min-width:0;flex:1 1 220px}.download-copy p{margin:5px 0 0;color:var(--muted);font-size:.8rem}.download-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;flex:0 1 auto;min-width:0;min-height:52px;max-width:100%;padding:12px 18px;border:1px solid #f0cc91;border-radius:8px;background:linear-gradient(#ecc58a,#d5a35f);color:#202719;font-size:.875rem;font-weight:750;line-height:1.4;text-decoration:none;box-shadow:inset 0 1px 0 #fff5;transition:filter .15s,transform .15s}.download-button span{min-width:0}.download-button svg{width:22px;height:22px;flex:0 0 22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.download-button:hover{filter:brightness(1.08)}.download-button:active{transform:translateY(1px)}
@media(max-width:600px){.download-banner{padding:16px;gap:14px;margin-bottom:20px}.download-button{width:100%;padding-inline:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}