.studio-shell{color:#f6f6f7;width:min(100% - 32px,1200px);margin:0 auto;padding:44px 0 80px}.studio-shell button,.studio-shell input,.studio-shell select{font:inherit}.studio-header{border-bottom:1px solid #303038;grid-template-columns:1fr auto;align-items:end;gap:24px;padding:0 0 28px;display:grid}.studio-back{color:#aaaab2;text-transform:uppercase;grid-column:1/-1;font-size:.74rem;font-weight:800}.studio-header h1{letter-spacing:-.065em;margin-top:9px;font-size:clamp(2.3rem,7vw,5.7rem);line-height:.9}.studio-header p:not(.studio-kicker){color:#aaaab2;margin-top:12px;font-size:1rem}.studio-header>span{color:#aaaab2;font-family:var(--font-mono);border:1px solid #404047;padding:8px 10px;font-size:.58rem}.studio-kicker{color:#ff4252;font-family:var(--font-mono);letter-spacing:.15em;font-size:.62rem;font-weight:900}.studio-tabs{border:1px solid #36363e;grid-template-columns:repeat(3,1fr);margin-top:28px;display:grid}.studio-tabs button{color:#8d8d96;letter-spacing:.08em;background:#0c0c0e;border:0;border-right:1px solid #36363e;min-height:58px;font-weight:900}.studio-tabs button:last-child{border-right:0}.studio-tabs button[data-active=true]{color:#fff;background:#f1283c}.studio-module{background:#0c0c0f;border:1px solid #303038;margin-top:20px;padding:clamp(20px,4vw,44px)}.studio-module-head{justify-content:space-between;align-items:start;gap:24px;display:flex}.studio-module-head h2{letter-spacing:-.06em;margin-top:8px;font-size:clamp(1.8rem,4vw,3.7rem)}.studio-module-head p:not(.studio-kicker){color:#a2a2aa;max-width:650px;margin-top:13px;line-height:1.65}.studio-module button,.studio-actions button,.chord-builder button{color:#ededf0;text-transform:uppercase;cursor:pointer;background:#17171b;border:1px solid #484850;padding:11px 13px;font-size:.7rem;font-weight:800}.studio-module button:hover,.studio-actions button:hover,.chord-builder button:hover{color:#fff;border-color:#ff4252}.studio-primary{color:#fff!important;background:#e90d22!important;border-color:#f1283c!important}.studio-controls{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:30px;display:grid}.studio-controls label,.chord-builder label{color:#a4a4ac;font-family:var(--font-mono);text-transform:uppercase;gap:7px;font-size:.6rem;display:grid}.studio-controls input,.studio-controls select,.chord-builder select{color:#fff;background:#151519;border:1px solid #42424a;width:100%;padding:11px}.studio-controls .check{align-items:center;gap:8px;display:flex}.studio-controls .check input{width:auto}.studio-actions{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.chord-palette{grid-template-columns:repeat(7,1fr);gap:6px;margin-top:22px;display:grid}.chord-palette button{text-align:left;align-content:center;gap:7px;min-height:100px;display:grid}.chord-palette small{color:#ff5261}.chord-palette strong{font-size:1.15rem}.chord-palette span{color:#9797a0;font-size:.58rem}.progression-workspace{border-top:1px solid #303038;grid-template-columns:1fr auto;align-items:center;gap:20px;margin-top:28px;padding-top:26px;display:grid}.progression-workspace h3{margin-top:8px;font-size:1.4rem}.progression-chips{flex-wrap:wrap;gap:7px;display:flex}.progression-chips button[data-active=true]{background:#4a1118;border-color:#ff4252}.text-action{justify-self:end;color:#999!important;background:0 0!important}.chord-builder{border:1px solid #34343d;grid-template-columns:1fr 170px 170px auto;align-items:end;gap:12px;margin-top:24px;padding:18px;display:grid}.chord-builder h3{margin-top:6px;font-size:1.4rem}.chord-builder p{color:#aaaab2;margin-top:4px}.tuner-readout{text-align:center;place-items:center;gap:7px;min-height:330px;display:grid}.tuner-readout>p{letter-spacing:-.1em;font-size:clamp(5rem,15vw,10rem);font-weight:900;line-height:.75}.tuner-readout strong{color:#d9d9de;font-family:var(--font-mono);font-size:1rem}.tuner-readout>span{color:#ff6571;min-height:20px}.tuner-meter{color:#aaaab2;width:min(100%,600px);font-family:var(--font-mono);border-top:2px solid #6a6a70;grid-template-columns:1fr 1fr 1fr;margin-top:28px;padding-top:10px;font-size:.58rem;display:grid;position:relative}.tuner-meter i{background:#f1283c;width:3px;height:16px;position:absolute;top:-8px;transform:translate(-50%)}.tuner-meter em{text-align:center;font-style:normal}.tuner-meter b:last-child{text-align:right}.tuning-targets{color:#d4d4d8;text-align:center;margin-top:18px}.studio-status{color:#a6a6ad;margin-top:16px;font-size:.78rem}.piano{height:215px;margin-top:28px;padding:0 4px;display:flex;position:relative;overflow-x:auto}.piano button{color:#101014;background:#f4f4f2;border:1px solid #1b1b21;border-radius:0;flex:0 0 48px;padding:0;position:relative}.piano button.black{z-index:2;flex-basis:0;width:0}.piano button.black:before{content:"";background:#121216;width:32px;height:128px;position:absolute;top:0;left:-16px}.piano button[data-scale=true].white{background:#ffe2e5}.piano button[data-active=true].white,.piano button[data-active=true].black:before{background:#f1283c}.piano button span{z-index:3;font-size:.51rem;position:absolute;bottom:7px;left:0;right:0}.piano button.black span{color:#fff;width:32px;bottom:92px;left:-16px}.piano-help{color:#898992;margin-top:10px;font-size:.7rem}.piano-roll{background:repeating-linear-gradient(0deg,#111116 0 27px,#202027 28px);border:1px solid #36363e;min-height:230px;margin-top:28px;position:relative;overflow:hidden}.roll-label{color:#777780;font-family:var(--font-mono);font-size:.56rem;position:absolute;top:9px;left:11px}.piano-roll>p{color:#888891;padding:70px 15px}.midi-note{min-width:40px;display:block;position:absolute;overflow:hidden;color:#fff!important;background:#7c1522!important;border-color:#f1283c!important;padding:3px!important;font-size:.5rem!important}.studio-bottom{border:1px solid #303038;justify-content:space-between;gap:30px;margin-top:20px;padding:25px;display:flex}.studio-bottom h2{max-width:620px;margin-top:8px;font-size:1.2rem}.studio-bottom p{color:#9c9ca4}.studio-bottom a{color:#ff5261;margin-top:8px;font-weight:800;display:block}@media (width<=700px){.studio-shell{width:min(100% - 22px,1200px);padding-top:24px}.studio-header{display:block}.studio-header>span{margin-top:20px;display:inline-block}.studio-tabs button{font-size:.62rem}.studio-module-head,.studio-bottom{display:block}.studio-module-head>button{margin-top:18px}.chord-palette{grid-template-columns:repeat(2,1fr)}.chord-builder{grid-template-columns:1fr 1fr}.chord-builder>div{grid-column:1/-1}.progression-workspace{grid-template-columns:1fr}.text-action{justify-self:start}.studio-bottom>div+div{margin-top:22px}.piano button{flex-basis:42px}.tuner-readout{min-height:250px}}
