:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:#e8e9e1;background:#101414;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 75% 8%,#22302e 0,transparent 35%),#101414}button,input,select{font:inherit}button{cursor:pointer}a{color:#c2dc70}.app{max-width:1420px;margin:auto;padding:0 48px}.masthead{height:108px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #34403d}.brand{display:flex;gap:17px;align-items:center}.brand-mark{width:52px;height:52px;border:1px solid #b6d470;color:#c7e580;display:grid;place-items:center;font-size:39px;line-height:1}.eyebrow{display:block;font-size:10px;font-weight:800;letter-spacing:.2em;color:#84918b}.brand .eyebrow{color:#bad27b}h1{font-size:26px;line-height:1;margin:5px 0 0;letter-spacing:-.04em}.head-note{font-size:12px;color:#81908a;text-align:right;line-height:1.5}.intro{min-height:294px;display:flex;justify-content:space-between;align-items:center;overflow:hidden}.intro-copy{position:relative;z-index:1}.accent{color:#c4dc7f}h2{font-family:Georgia,serif;font-size:clamp(39px,4.6vw,68px);font-weight:400;line-height:1.07;letter-spacing:-.045em;margin:18px 0}h2 em{font-weight:400;color:#c4df83}.intro p{max-width:550px;color:#9da9a1;line-height:1.6;font-size:14px;margin:0 0 22px}.chip{width:184px;height:152px;background:linear-gradient(140deg,#303b37,#161c1b);border:7px solid #2f3936;box-shadow:0 0 0 1px #4b5850,20px 25px 35px #080b0b88;transform:rotate(13deg);margin:25px 85px 0 0;position:relative;display:grid;place-items:center}.chip-inner{border:1px solid #647361;width:130px;height:103px;display:flex;align-items:center;justify-content:center;flex-direction:column}.chip-inner span{font-size:23px;font-weight:900;letter-spacing:.16em;color:#b6ca9d}.chip-inner small{font-size:7px;letter-spacing:.16em;color:#7a8c7e;margin-top:7px}.pin{position:absolute;height:12px;width:235px;left:-34px;background:repeating-linear-gradient(90deg,#a1aaa0 0 7px,transparent 7px 17px)}.pin.left{top:-20px}.pin.right{bottom:-20px}.tabs{display:flex;gap:4px;border-bottom:1px solid #39443d}.tab{padding:18px 25px;border:0;background:transparent;color:#99a69e;font-weight:700;font-size:14px;border-bottom:2px solid transparent}.tab.active{color:#d7ee95;border-color:#c8e584}.tab span{font-size:11px;border-radius:12px;background:#29332e;color:#bac7ad;padding:3px 8px;margin-left:7px}.browser{background:#181f1d;border:1px solid #303d36;border-top:0;border-radius:0 0 5px 5px}.browser-top{padding:29px 30px 22px;display:flex;justify-content:space-between;gap:24px;align-items:end}.browser-top h3{font-size:24px;margin:7px 0 4px;letter-spacing:-.035em}.browser-top p{color:#93a198;font-size:13px;margin:0}.browser-tools{display:flex;align-items:end;flex-direction:column;gap:10px}.search-wrap{display:flex;align-items:center;gap:8px;border:1px solid #425048;background:#101614;color:#9daa9e;border-radius:4px;padding:0 11px;width:310px;height:38px}.search-wrap span{font-size:22px}.search-wrap input{min-width:0;width:100%;background:none;border:0;outline:0;color:#e8e9e1;font-size:12px}.search-wrap:focus-within{border-color:#bbd77d}.sfx-option{color:#9dac9e;font-size:11px;cursor:pointer}.sfx-option input{accent-color:#bad981;vertical-align:middle}.columns{padding:10px 30px;background:#202a25;border-top:1px solid #344238;border-bottom:1px solid #344238;display:grid;grid-template-columns:1fr 180px;color:#889b8b;font-size:10px;letter-spacing:.16em;font-weight:800}.track-list{min-height:425px}.track-row{display:grid;grid-template-columns:1fr 180px;align-items:center;min-height:57px;padding:8px 30px;border-bottom:1px solid #2b3730;gap:15px}.track-row:hover{background:#212b25}.track-name{font-size:13px;font-weight:700;color:#e4e8db;display:block}.track-sub{color:#82938a;font-size:11px;margin-top:3px;display:block}.row-actions{display:flex;gap:6px}.play-version{min-width:84px;border:1px solid #506344;background:#29382b;color:#c9e2a3;border-radius:3px;padding:8px 5px;font-size:11px;font-weight:700}.play-version:hover,.play-version.active{background:#b9d878;color:#172118;border-color:#b9d878}.play-version.secondary{border-color:#4a5550;background:#26312d;color:#c7d6c8}.play-version.secondary:hover,.play-version.secondary.active{background:#d8e5cb;color:#172118}.list-foot{display:flex;justify-content:space-between;align-items:center;padding:14px 30px;color:#87988e;font-size:11px}.pager{display:flex;align-items:center;gap:13px}.pager button{background:#27332b;border:1px solid #3c4b3e;color:#d5e8c9;border-radius:3px;padding:5px 9px}.pager button:disabled{opacity:.35;cursor:default}.empty{padding:90px 20px;text-align:center;color:#93a39a}.player{position:sticky;bottom:0;z-index:4;background:#d1e899;color:#18241d;box-shadow:0 -10px 35px #090e0bbd;min-height:89px;margin-top:25px;padding:14px 22px;display:grid;grid-template-columns:minmax(195px,1fr) auto minmax(210px,1fr);gap:24px;align-items:center}.player .eyebrow{color:#566c45}.player-main{display:flex;gap:15px;align-items:center;min-width:0}.playing-icon{width:42px;height:42px;background:#1e2b20;border-radius:3px;display:flex;align-items:end;justify-content:center;gap:3px;padding:11px}.playing-icon span{background:#cbeb89;width:4px;height:16px}.playing-icon span:nth-child(2){height:24px}.playing-icon span:nth-child(3){height:11px}.playing-icon span:nth-child(4){height:20px}.playing-meta{min-width:0}.playing-meta strong{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playing-meta>span:last-child{font-size:11px;color:#5d704d;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-controls{display:flex;align-items:center;gap:8px}.player-controls>button{width:32px;height:32px;border:1px solid #869e61;background:#1e2c22;color:#d0e89c;border-radius:3px}.player-controls>button:disabled{opacity:.45}.select-label{display:flex;flex-direction:column;font-size:9px;font-weight:800;letter-spacing:.1em;color:#566c45;gap:2px}.select-label select{max-width:116px;border:1px solid #869e61;border-radius:3px;background:#e3f2bc;color:#273927;font-size:11px;padding:3px}.timeline{display:flex;align-items:center;gap:7px;font-size:11px;color:#4b6245}.timeline input{flex:1;accent-color:#253d25;min-width:75px}footer{display:flex;justify-content:space-between;gap:20px;padding:23px 0 30px;color:#75867c;font-size:11px}@media(max-width:900px){.app{padding:0 22px}.chip{margin-right:35px;width:135px;height:115px}.chip-inner{width:95px;height:75px}.chip-inner span{font-size:17px}.pin{width:175px}.player{grid-template-columns:1fr auto;gap:11px}.timeline{grid-column:1/-1}.browser-top{align-items:start}}@media(max-width:650px){.app{padding:0 12px}.masthead{height:82px}.head-note,.chip{display:none}.intro{min-height:240px}.intro p{font-size:12px}.tab{padding:14px 10px;font-size:12px}.tab span{margin-left:2px}.browser-top{padding:20px 15px;flex-direction:column;gap:15px}.browser-tools,.search-wrap{width:100%}.columns{padding:10px 15px;grid-template-columns:1fr 165px}.track-row{padding:8px 15px;grid-template-columns:minmax(0,1fr) 165px}.play-version{min-width:79px}.list-foot{padding:14px 15px}.player{padding:10px;grid-template-columns:1fr}.player-controls{grid-row:2;flex-wrap:wrap}.timeline{grid-row:3}.player-main{grid-row:1}footer{flex-direction:column;gap:5px}}

.tabs{overflow-x:auto}.tab{white-space:nowrap}.play-version{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.download-link{border-color:#4a5550;background:#26312d;color:#c7d6c8}.download-link:hover{background:#d8e5cb;color:#172118}
.midi-row{grid-template-columns:minmax(0,1fr) auto}.midi-row .row-actions{flex-wrap:wrap}.midi-row .play-version{min-width:76px}@media(max-width:650px){.midi-row{grid-template-columns:1fr}.midi-row .row-actions{margin-top:5px}.midi-row .play-version{flex:1}}
