:root{color-scheme:light;--bg:#fff;--text:#000;--secondary:#707070;--line:#d8d8d8;--accent:#d60000;--gold:#986400;--emerald:#087e57;--amethyst:#8053b5;--scrim:rgb(0 0 0 / 48%);--font:'IBM Plex Mono',monospace}
:root[data-theme=dark]{color-scheme:dark;--bg:#000;--text:#fff;--secondary:#aaa;--line:#383838;--accent:#ff3030;--gold:#e8af4b;--emerald:#50bc90;--amethyst:#ba8be6;--scrim:rgb(0 0 0 / 60%)}
*{box-sizing:border-box}html{scroll-padding-bottom:220px}body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.5 var(--font);-webkit-text-size-adjust:100%}button,input,audio{font:inherit}button{color:inherit;background:transparent;border:0;cursor:pointer;border-radius:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.4;cursor:wait}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button{user-select:none;-webkit-user-select:none}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:500}input{color:var(--text)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.topbar{max-width:1120px;margin:auto;display:flex;align-items:center;gap:24px;padding:calc(24px + env(safe-area-inset-top)) 32px 0}.square-button{width:48px;height:48px;flex:none;border:1px solid var(--text);display:grid;place-items:center;font-size:27px;line-height:1;background:var(--bg)}.hamburger{width:24px;height:18px;border-top:1px solid;border-bottom:1px solid;position:relative}.hamburger:after{content:'';height:1px;background:currentColor;position:absolute;left:0;right:0;top:8px}.wordmark{font-size:13px}.topbar>.text-button{margin-left:auto}.text-button{padding:10px 0;min-height:44px;font-size:13px;text-align:left}.text-button:hover{text-decoration:underline;text-underline-offset:5px}main{max-width:1016px;margin:0 auto;padding:94px 32px 210px}.page-heading{margin-bottom:40px}.eyebrow{font-size:11px;letter-spacing:.07em;color:var(--secondary)}h1{font-size:44px;line-height:1.15;letter-spacing:-.04em;margin-top:14px}.intro{color:var(--secondary);font-size:13px;margin-top:16px}.tabs{display:flex;gap:36px;border-bottom:1px solid var(--line)}.tabs button{position:relative;min-height:56px;padding:0 0 14px;font-size:16px;white-space:nowrap}.tabs span{color:var(--secondary);font-size:11px;margin-left:6px}.tabs button[aria-current=page]:after{content:'';position:absolute;bottom:-1px;height:2px;background:var(--accent);left:0;right:0}.library-tools{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:24px 0 46px}.collections{display:flex;flex-wrap:wrap;gap:20px;border:0;padding:0;margin:0}.collections button{display:flex;align-items:center;gap:8px;min-height:44px;padding:0;font-size:12px;color:var(--secondary)}.collections button[aria-pressed=true]{color:var(--text);text-decoration:underline;text-underline-offset:5px}.dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none;background:var(--collection)}.gold{--collection:var(--gold)}.emerald{--collection:var(--emerald)}.amethyst{--collection:var(--amethyst)}.search{width:180px;flex:none}.search input{border:0;border-bottom:1px solid var(--line);border-radius:0;width:100%;padding:10px 0;background:var(--bg);font-size:13px;min-height:44px}.search input::placeholder{color:var(--secondary);opacity:1}.collection-group{margin-top:38px}.collection-group:first-child{margin-top:0}.collection-heading{display:flex;align-items:center;gap:10px;color:var(--collection);font-size:12px;font-weight:500;letter-spacing:.02em;margin:0 0 12px}.collection-heading .count{margin-left:auto;color:var(--secondary);font-size:11px}.records{display:grid;grid-template-columns:1fr 1fr;column-gap:48px}.record{min-width:0;border-top:1px solid var(--line);display:flex;align-items:stretch;gap:14px;padding:20px 0}.record-marker{font-size:11px;width:21px;padding-top:4px;color:var(--collection);flex:none}.record-button{display:block;text-align:left;flex:1;min-width:0;padding:0}.record-title{font-size:16px;line-height:1.45;display:block;overflow-wrap:anywhere}.record-description{font-size:11px;line-height:1.6;color:var(--secondary);display:block;margin-top:7px;overflow-wrap:anywhere}.record[data-active=true] .record-title{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:1px;text-underline-offset:5px}.record-action{align-self:flex-start;min-height:44px;width:28px;flex:none;font-size:16px;padding:0;color:var(--secondary)}.record[data-active=true] .record-action{color:var(--accent)}.noise-record{display:block;position:relative;padding:18px 0 15px 35px}.noise-record .record-marker{position:absolute;left:0;top:19px}.noise-label{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.noise-label output{color:var(--collection);font-size:11px;white-space:nowrap}.noise-record .record-description{margin-bottom:6px}.noise-record input{width:100%}.empty{font-size:14px;color:var(--secondary);padding:48px 0}.library-footer{margin-top:52px;border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;align-items:center;color:var(--secondary);font-size:11px;gap:18px}.library-footer .text-button{font-size:11px}
input[type=range]{appearance:none;-webkit-appearance:none;background:transparent;height:40px;margin:0;cursor:pointer;accent-color:var(--collection,var(--text))}input[type=range]::-webkit-slider-runnable-track{height:1px;background:var(--line)}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--collection,var(--text));margin-top:-5.5px;border:0}input[type=range]::-moz-range-track{height:1px;background:var(--line)}input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--collection,var(--text));border:0}
.player{position:fixed;z-index:4;bottom:0;left:0;right:0;padding:0 32px env(safe-area-inset-bottom);background:var(--bg);border-top:1px solid var(--text)}.player-inner{max-width:952px;margin:auto;display:flex;align-items:center;gap:28px;min-height:116px}.now-playing{flex:1;min-width:0}.track-line{display:flex;align-items:baseline;gap:12px;margin-top:5px}.track-line .dot{align-self:center}#track-title{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-detail{font-size:11px;color:var(--secondary);margin-left:20px;margin-top:3px}.transport{display:flex;align-items:center;gap:8px}.icon-button{width:40px;height:48px;font-size:23px;line-height:1}.play-button{width:48px;height:48px;border:1px solid var(--text);border-radius:50%;display:grid;place-items:center}.play-symbol{width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid var(--text);margin-left:3px}.play-button[data-playing=true] .play-symbol{width:11px;height:14px;border:0;border-left:3px solid;border-right:3px solid;margin-left:0}.master-volume{width:144px;font-size:10px;flex:none}.master-volume>span{display:flex;justify-content:space-between}.master-volume input{width:100%;height:30px}.native-toggle{font-size:11px}.native-player{max-width:952px;margin:0 auto;height:0;overflow:hidden}.native-player audio{display:block;width:min(100%,480px);height:48px;margin:0 auto 18px}.player.expanded .native-player{height:66px}.player-error{max-width:952px;margin:0 auto;padding:0 0 12px;font-size:12px;color:var(--accent)}
dialog{background:var(--bg);color:var(--text);border:1px solid var(--text);padding:0}dialog::backdrop{background:var(--scrim)}body:has(dialog[open]){overflow:hidden}.menu{position:fixed;inset:0 auto 0 0;margin:0;width:min(360px,calc(100vw - 36px));max-width:none;height:100dvh;max-height:none;border:0;border-right:1px solid var(--text)}.menu-content{display:flex;flex-direction:column;min-height:100%;padding:calc(20px + env(safe-area-inset-top)) 24px calc(24px + env(safe-area-inset-bottom));overflow:auto}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 24px;border-bottom:1px solid var(--line);flex:none}.dialog-heading h2{font-size:18px}.dialog-heading .square-button{border:0;width:44px;height:44px}.menu .dialog-heading{padding:0 0 30px;border:0;font-size:13px}.menu nav{display:flex;flex-direction:column;margin-top:28px}.menu nav button,.menu-secondary button,.theme-toggle{display:block;min-height:52px;text-align:left;padding:10px 0;font-size:15px}.menu-secondary{margin:40px 0}.theme-toggle{margin-top:auto;border-top:1px solid var(--line)}.small{font-size:12px;line-height:1.6}.muted{color:var(--secondary)}.surface{width:calc(100vw - 32px);max-width:440px;height:auto;max-height:calc(100dvh - 48px);margin:auto}.surface[open]{display:flex;flex-direction:column}.dialog-body{flex:0 1 auto;min-height:0;overflow:auto;padding:24px}.mixer-section{margin-top:26px}.mixer-section-heading{display:flex;align-items:center;justify-content:space-between}.mixer-section h3{font-size:15px}.mixer-section-heading .text-button{font-size:11px}.range-label{display:block;margin-top:12px;font-size:12px}.range-label>span{display:flex;justify-content:space-between;gap:20px}.range-label output{color:var(--secondary);white-space:nowrap}.range-label input{width:100%}.reset{color:var(--secondary);font-size:11px;margin-top:14px}.about-copy p+p{margin-top:18px}.about-copy{font-size:13px;line-height:1.7}
@media(min-width:1400px){main{padding-top:126px}}
@media(max-width:760px){.topbar{padding:calc(20px + env(safe-area-inset-top)) 24px 0;gap:16px}.topbar>.text-button{font-size:11px}.wordmark{font-size:11px}main{padding:64px 24px 230px}h1{font-size:36px}.page-heading{margin-bottom:30px}.tabs{gap:26px}.tabs button{font-size:14px}.tabs span{margin-left:3px;font-size:10px}.library-tools{display:block;margin:20px 0 34px}.collections{gap:17px}.collections button{font-size:11px}.search{display:block;width:100%;margin-top:8px}.search input{font-size:16px}.records{grid-template-columns:1fr}.collection-group{margin-top:34px}.record{padding:19px 0}.record-title{font-size:16px}.record-description{font-size:12px}.record-action{width:32px}.player{padding:0 24px env(safe-area-inset-bottom)}.player-inner{flex-wrap:wrap;gap:0 8px;padding:16px 0 8px;min-height:142px}.now-playing{flex-basis:calc(100% - 128px);max-width:calc(100% - 128px)}.transport{gap:2px}.icon-button{width:30px}.master-volume{width:auto;flex:1;margin-top:11px;margin-right:28px}.master-volume input{height:36px}.master-volume>span{font-size:10px}.native-toggle{font-size:11px;margin-top:9px}#track-title{font-size:13px}.track-detail{font-size:10px}.player .eyebrow{font-size:9px}.library-footer{align-items:flex-start}.library-footer .text-button{text-align:right;max-width:220px;padding-top:0}}
@media(max-width:360px){.topbar,main{padding-left:20px;padding-right:20px}.topbar{gap:12px}.wordmark{font-size:10px}.topbar>.text-button{max-width:82px;line-height:1.5}.collections{gap:13px}.collections button{font-size:10px}.tabs{gap:20px}h1{font-size:32px}.player{padding-left:20px;padding-right:20px}.record-title{font-size:15px}}
@media(prefers-reduced-motion:no-preference){button{transition:opacity 120ms ease}}

@media(max-height:650px) and (max-width:760px){main{padding-top:16px}.page-heading{margin-bottom:16px}h1{font-size:30px;margin-top:8px}.intro{margin-top:8px;font-size:12px}.tabs button{min-height:44px;padding-bottom:8px}.library-tools{margin:8px 0 14px}.collections button{min-height:36px}.search{margin-top:0}.search input{min-height:38px;padding:6px 0}.player-inner{min-height:122px;padding:12px 0 6px}.master-volume{margin-top:8px}.master-volume input{height:30px}.native-toggle{margin-top:5px}}

.device-volume{font-size:11px;color:var(--secondary);max-width:144px}.preparation-actions{max-width:952px;margin:0 auto;display:flex;align-items:center;gap:24px;padding-bottom:8px}.preparation-actions .text-button{font-size:12px}.duration-label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:24px 0 8px;font-size:12px}.duration-label select{font:400 16px var(--font);background:var(--bg);color:var(--text);border:1px solid var(--text);border-radius:0;padding:8px;min-width:140px}#recording-support-note{margin-top:12px}main{padding-bottom:300px}@media(max-width:760px){.preparation-actions{gap:16px;flex-wrap:wrap;padding-bottom:10px}.preparation-actions .small{font-size:10px}.device-volume{max-width:180px;flex:1;margin-top:15px}.duration-label{align-items:flex-start}}

.prepare-button{display:block;width:100%;padding:12px;margin-top:24px;min-height:48px;border:1px solid var(--text);font-size:13px;text-align:center}