/* A compact workbench in the existing graphite, cyan and acid-lime identity. */
.music-tools{padding-block:38px 80px;min-width:0}.music-tool-hero{display:grid;grid-template-columns:minmax(0,1fr) 230px;align-items:center;gap:36px;padding:42px 48px;border:1px solid #28444e;border-radius:20px;background:radial-gradient(ellipse at 90% 50%,#16434a88,transparent 60%),#09171d;overflow:hidden;position:relative}.music-tool-hero>div{position:relative;z-index:1;min-width:0}.music-tool-hero h1{font-size:clamp(34px,4.8vw,68px);line-height:1.08;letter-spacing:-.045em;max-width:900px;margin:22px 0}.music-tool-hero p:last-child{color:#b3c6cd;line-height:1.7;max-width:730px;font-size:17px;margin-bottom:0}.music-tool-hero>img{width:230px;height:285px;object-fit:contain;filter:drop-shadow(0 18px 20px #0008)}.music-tools-nav{display:flex;flex-wrap:wrap;gap:8px;margin-block:22px 34px}.music-tools-nav a,.music-tool-secondary,.app-tabs button,.music-tool-offline,.music-tool-download{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:1px solid #34505c;border-radius:9px;background:#0c1b23;color:#e9f4f6;padding:10px 16px;line-height:1.4;text-align:center;text-decoration:none;font:inherit;font-size:13px;cursor:pointer}.music-tools-nav a:hover,.music-tool-secondary:hover,.app-tabs button:hover{border-color:#71e5ef;background:#12333e}.music-tools-nav a[aria-current],.app-tabs button[aria-pressed=true]{background:#17333c;border-color:#65deeb;color:#75e9f1}.music-tools :is(a,button,input,select):focus-visible{outline:3px solid #70e4ef;outline-offset:4px}.music-tools-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.music-tool-card{position:relative;display:flex;flex-direction:column;text-decoration:none;color:#f4f8fa;border:1px solid #2a454e;border-radius:16px;padding:30px;background:linear-gradient(140deg,#112932,#0a171e 70%);transition:border-color .2s,transform .2s;overflow:hidden}.music-tool-card:after{content:'';position:absolute;inset-inline-end:-10px;top:0;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,#2daabd20,transparent 65%);pointer-events:none}.music-tool-card:hover{border-color:#6ddfeb;transform:translateY(-3px)}.music-tool-card h2{font-size:24px;line-height:1.3;margin:24px 0 12px}.music-tool-card p{font-size:15px;line-height:1.75;color:#b4c6ce;margin:0 0 26px}.music-tool-card>span:last-child{margin-top:auto;display:flex;align-items:center;gap:12px;color:#7ce5ec;font-size:13px}.music-tool-card svg{width:22px;height:22px}.music-tool-card__icon{width:52px;height:52px;display:grid;place-items:center;border-radius:13px;border:1px solid #3c7179;background:#12313a;color:#7ce5ec;box-shadow:0 6px 18px #0004}.music-tool-controls,.app-toolbar{display:flex;gap:16px;align-items:end;flex-wrap:wrap;padding:24px;background:#0b1c24;border:1px solid #29434f;border-radius:14px}.music-tools label{display:flex;flex-direction:column;gap:9px;line-height:1.5;color:#bdcdd3;font-size:13px;flex:1 1 180px;min-width:0}.music-tools input,.music-tools select{color:#f4f8fa;background:#061219;border:1px solid #375662;border-radius:8px;min-height:48px;min-width:0;width:100%;padding:12px;font:inherit;font-size:16px}.music-tools input[type=number]{max-width:240px}.music-tools option{background:#0b1c24;color:#f4f8fa}.music-tool-primary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;background:#04d4ed;border:1px solid #57e9f5;color:#02141a;border-radius:9px;padding:12px 22px;font:inherit;font-weight:750;text-decoration:none;cursor:pointer}.music-tool-primary:hover{background:#7aebf4}.music-tool-note{font-size:13px;color:#9fb5c0;line-height:1.8;margin-block:16px 24px;max-width:880px}.music-tool-count{color:#87e5ed;min-height:1.5em;font-size:14px}.music-tool-results{display:grid;gap:10px}.music-tool-recording{display:grid;grid-template-columns:64px minmax(120px,1fr) auto;align-items:center;gap:18px;padding:18px;border:1px solid #233e49;border-radius:12px;background:#0b1921}.music-tool-recording[hidden]{display:none}.music-tool-recording>img{width:64px;height:64px;object-fit:cover;border-radius:8px}.music-tool-recording h3{font-size:16px;margin:0 0 5px;line-height:1.4;overflow-wrap:anywhere}.music-tool-recording__info>p{color:#a8bdc6;font-size:13px;line-height:1.65;margin:8px 0 0;max-width:630px}.music-tool-duration{color:#8eacb9;font-variant-numeric:tabular-nums;font-size:12px}.music-tool-recording__actions{display:flex;flex-wrap:wrap;justify-content:end;align-items:center;gap:8px;max-width:370px}.music-tool-play{display:flex;gap:8px;align-items:center;justify-content:center;min-height:44px;background:#183640;border:1px solid #467c86;border-radius:9px;padding:9px 14px;color:#b2f7fb;font:inherit;font-size:13px;cursor:pointer}.music-tool-play svg{width:16px;height:16px;flex:none}.music-favourite{width:44px;height:44px;display:grid;place-items:center;background:#101e27;border:1px solid #34505c;border-radius:9px;color:#b0c4cc;cursor:pointer;flex:none}.music-favourite svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5}.music-favourite[aria-pressed=true]{color:#c1f148;border-color:#7c9b39;background:#27341e}.music-favourite[aria-pressed=true] svg{fill:currentColor}.music-tool-offline{max-width:210px;font-size:11px;padding:8px 11px}.music-tool-offline[aria-pressed=true]{border-color:#7c9b39;color:#d0f88d}.music-tool-offline:disabled{opacity:.65;cursor:wait}.music-tool-recording.is-playing{border-color:#6bdded;background:#102831}.music-tool-license{padding:28px;margin-block:32px;border:1px solid #33535b;border-radius:14px;background:#0c1f27;line-height:1.9}.music-tool-license>p{max-width:900px}.phrase-workbench,.beat-workbench{padding:30px;border:1px solid #31505b;border-radius:16px;background:linear-gradient(140deg,#0c2028,#071219)}.phrase-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-block:24px}.phrase-results>div{display:flex;flex-direction:column;justify-content:space-between;gap:18px;border:1px solid #30545e;border-radius:12px;padding:24px;background:#112a32;min-width:0}.phrase-results span{font-size:13px;color:#b8cbd1}.phrase-results output{font-size:clamp(24px,3vw,40px);color:#c0f44c;font-weight:750;line-height:1.3;overflow-wrap:anywhere}.phrase-timeline{display:flex;gap:4px;margin:28px 0;height:38px}.phrase-timeline i{flex:1;background:linear-gradient(#56dbe4,#1c6675);border-radius:3px}.phrase-timeline i:nth-child(4n+1){background:linear-gradient(#c3f24d,#688531)}.music-tool-buttons{display:flex;gap:12px;flex-wrap:wrap;margin-block:24px}.beat-grid{overflow-x:auto;overscroll-behavior-inline:contain;padding:8px 3px;margin-block:24px;direction:ltr}.beat-row{display:grid;grid-template-columns:95px 1fr;gap:12px;align-items:center;min-width:570px;margin-bottom:10px}.beat-row>span{font-size:12px;color:#b9cbd1;overflow-wrap:anywhere}.beat-row>div{display:grid;grid-template-columns:repeat(16,minmax(24px,1fr));gap:6px}.beat-row button{aspect-ratio:1;min-height:28px;border:1px solid #325561;background:#101f29;border-radius:5px;color:#839ea9;font:inherit;font-size:9px;cursor:pointer}.beat-row button:nth-child(4n+1){border-inline-start:3px solid #4e7380}.beat-row button[aria-pressed=true]{background:#53d8e5;border-color:#8bf1f5;color:#05202a;box-shadow:0 2px 9px #00cad51a}.beat-row:nth-child(3) button[aria-pressed=true]{background:#b1e840;color:#1f3106;border-color:#d7fb80}.beat-row button.is-current{outline:2px solid white;outline-offset:2px}.beat-row--labels>div>span{text-align:center;color:#7599a7;font-size:10px}.app-toolbar{align-items:end;margin-bottom:22px;gap:12px}.app-tabs{display:flex;gap:6px;flex:1 1 240px}.app-tabs button{flex:1}.listening-room>[role=status]{font-size:14px;line-height:1.7;color:#c2ed91}.music-tools [hidden]{display:none!important}
@media(max-width:850px){.music-tool-hero{grid-template-columns:1fr 160px;padding:30px}.music-tool-hero>img{width:160px;height:210px}.music-tool-recording{grid-template-columns:58px minmax(0,1fr)}.music-tool-recording>img{width:58px;height:58px}.music-tool-recording__actions{grid-column:2;justify-content:start;max-width:none}.music-tool-offline{max-width:100%}.phrase-workbench,.beat-workbench{padding:20px}}
@media(max-width:560px){.music-tools{padding-top:18px}.music-tool-hero{display:block;padding:26px 22px}.music-tool-hero>img{position:absolute;inset-inline-end:-35px;bottom:-45px;width:150px;height:195px;opacity:.19}.music-tool-hero h1{font-size:36px;letter-spacing:-.035em}.music-tool-hero p:last-child{font-size:14px}.music-tool-hero .phonk-portal__eyebrow{font-size:10px}.music-tools-cards{grid-template-columns:1fr}.music-tool-card{padding:24px}.music-tool-card h2{font-size:23px}.music-tools-nav{gap:6px;margin-bottom:24px}.music-tools-nav a{padding:9px 11px;font-size:11px;flex:1 1 40%}.music-tool-controls,.app-toolbar{padding:16px;gap:14px}.music-tool-controls label{flex-basis:40%}.music-tool-controls label:first-child{flex-basis:100%}.phrase-results{grid-template-columns:1fr;gap:8px}.phrase-results>div{padding:18px;flex-direction:row;align-items:center;gap:14px}.phrase-results output{font-size:25px;text-align:end}.phrase-results span{max-width:50%}.phrase-workbench,.beat-workbench{padding:14px}.music-tool-recording{padding:14px;gap:12px}.music-tool-recording__actions{grid-column:1/-1}.music-tool-recording__info>p{font-size:12px}.music-tool-play,.music-tool-download{font-size:12px}.music-tool-license{padding:20px}.app-toolbar>label{flex-basis:40%}.app-toolbar>label:first-child{flex-basis:100%}.app-toolbar>[data-install-app]{width:100%}.app-tabs{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.music-tool-card{transition:none}.music-tool-card:hover{transform:none}}
@media(forced-colors:active){.music-tool-card,.music-tool-recording,.music-tool-hero{border:1px solid CanvasText}.music-favourite[aria-pressed=true],.beat-row button[aria-pressed=true]{outline:2px solid Highlight}.phrase-timeline i{background:CanvasText}}

/* The listening room opens with our releases; settings follow the recordings. */
.app-music-header{padding-block:8px 0}.app-music-header .phonk-portal__eyebrow{margin:0 0 10px}.app-music-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:20px}.app-music-heading h1{margin:0;font-size:clamp(26px,4.2vw,56px);line-height:1.1;letter-spacing:-.045em}.app-music-heading h1 span{color:#b8f13c}.app-music-heading>a{display:inline-flex;align-items:center;gap:9px;color:#b8cdd5;font-size:13px;text-decoration:none;flex-shrink:0}.app-music-heading>a svg{width:17px;height:17px}.app-releases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.app-release{position:relative;border:1px solid #29444f;border-radius:12px;background:#0b1b23;min-width:0;overflow:hidden}.app-release>a{display:flex;align-items:center;gap:18px;min-height:104px;padding-block:12px;padding-inline:12px 64px;color:#f4f8fa;text-decoration:none;font-size:19px;font-weight:750;line-height:1.2}.app-release>a:focus-visible{outline:3px solid #70e4ef;outline-offset:-4px}.app-release img{width:80px;height:80px;object-fit:cover;border-radius:7px;flex:none}.app-release>button{position:absolute;inset-inline-end:16px;top:50%;transform:translateY(-50%);width:42px;height:42px;display:grid;place-items:center;border:1px solid #36717c;border-radius:50%;background:#123640;color:#84edf6;cursor:pointer}.app-release>button:hover{background:#04d4ed;color:#03161c}.app-release>button svg{width:17px;height:17px}.music-tools[data-music-tool=app] .app-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.6fr);gap:10px;padding:0;margin-block:18px 16px;border:0;background:none}.music-tools[data-music-tool=app] .app-tabs{grid-column:1/-1}.music-tools[data-music-tool=app] .app-toolbar label{gap:0}.music-tools[data-music-tool=app] [data-app-status]:empty{display:none}.app-options{margin-top:22px;border-top:1px solid #29434f;padding-top:14px}.app-options summary{display:flex;align-items:center;gap:8px;cursor:pointer;min-height:36px;font-size:12px;color:#8edfe6;list-style:none}.app-options summary::-webkit-details-marker{display:none}.app-options summary:after{content:'+';margin-inline-start:auto;font-size:20px}.app-options[open] summary:after{content:'−'}.app-options>div{display:flex;align-items:end;gap:16px;margin-top:16px;flex-wrap:wrap}.app-options label{max-width:240px}.app-options[open]{padding-bottom:8px}
@media(max-width:560px){.music-tools[data-music-tool=app]{padding-top:18px}.app-music-heading{display:block;margin-bottom:16px}.app-music-heading h1{font-size:clamp(26px,7vw,36px)}.app-music-heading>a{margin-top:12px;font-size:12px}.app-releases{gap:10px}.app-release>a{display:block;padding-block:10px;padding-inline:10px 42px;min-height:106px;font-size:12px}.app-release>a:focus-visible{outline:3px solid #70e4ef;outline-offset:-4px}.app-release img{display:block;width:52px;height:52px;margin-bottom:8px}.app-release>button{width:44px;height:44px;inset-inline-end:6px;top:36px}.app-release>button svg{width:13px;height:13px}.music-tools[data-music-tool=app] .app-toolbar{grid-template-columns:1fr;gap:9px}.music-tools[data-music-tool=app] .app-tabs{margin:0}.music-tools[data-music-tool=app] .app-toolbar :is(input,select){min-height:44px;padding-block:9px}.app-options>div{align-items:stretch;flex-direction:column}.app-options label{max-width:none}}

.music-tools-entry{margin-block:26px;padding-block:20px;border-block:1px solid #29434f}.music-tools-entry h2{font-size:20px;margin:0 0 15px}.music-tools-entry .music-tools-nav{margin:0}.music-tools-entry>a svg{width:18px;height:18px}
