.play-app{--text:#17202b;--muted:#526070;--line:#c9d1dc;--panel:#fff;--lime:#0047ff;color:var(--text);background:#f7f9fc;min-height:100vh;color-scheme:light}.play-app main{max-width:1320px;margin:auto;padding:24px max(16px,env(safe-area-inset-right)) 70px}.play-header{background:white;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:20px}.play-header a{color:var(--text)}.play-title{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.play-title h1{font-size:clamp(30px,5vw,52px);letter-spacing:-1.5px}.play-panel{border:1px solid var(--line);background:white;padding:22px;margin:20px 0}.play-app button,.play-app input:not([type=range]),.play-app select,.play-app textarea{border-radius:0;background:white;color:var(--text);border-color:var(--line);min-height:44px}.play-app button:focus-visible,.play-app input:focus-visible{outline:3px solid #0047ff;outline-offset:2px}.play-app .primary,.play-app button[aria-pressed=true]{background:#0047ff;color:#fff}.play-row{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.play-row label{min-width:100px;flex:1 1}.play-app h2{font-size:22px}.play-help{display:inline-block;position:relative;font-size:14px;margin:0 4px}.play-help summary{display:inline-grid;place-items:center;min-width:44px;min-height:44px;color:#0047ff;list-style:none}.play-help p{max-width:340px;line-height:1.6;font-family:system-ui}.drawbars{display:grid;grid-template-columns:repeat(9,1fr);gap:12px}.drawbars label{font-family:monospace;text-align:center}.keyboard{height:200px;overflow-x:auto;user-select:none;-webkit-user-select:none;border:1px solid var(--line)}.keyboard,.keyboard button{display:flex;touch-action:none}.keyboard button{flex:1 1;min-width:44px;position:relative;background:#fff;flex-direction:column;justify-content:end;align-items:center;padding:12px 2px;color:#17202b;border:1px solid #9ba6b5}.keyboard button.sharp{background:#17202b;color:#fff;height:135px}.keyboard button.pressed{background:#0047ff;color:#fff}.keyboard small{opacity:.6}.play-caption{font-size:13px;color:var(--muted)}.roll-scroll{overflow:auto;max-width:100%;border:1px solid var(--line);margin:20px 0}.piano-roll{display:grid;min-width:520px}.roll-row{display:contents}.roll-row>span{position:sticky;left:0;background:#edf1f7;display:grid;place-items:center;font:12px monospace;z-index:1}.play-app .roll-row button{height:44px;min-height:44px;padding:0;border:1px solid #e2e7ee}.play-app .roll-row button.note{background:#0047ff;color:white}.play-app .roll-row button.cursor{box-shadow:inset 0 0 0 2px #e28c00}.play-app pre{background:#edf1f7;color:#17202b}.play-app .alert{color:#9a230c;border-color:#b6503a}.play-app button:disabled{opacity:.5;cursor:not-allowed}@media(max-width:650px){.play-panel{padding:14px}.drawbars{grid-template-columns:repeat(3,1fr)}.play-header{font-size:12px}.play-row>button{flex:1 1}.play-row label{flex-basis:40%}.play-help[open]{flex-basis:100%}.keyboard{height:175px}.keyboard button{min-width:44px}.play-title label{width:100%}}.play-app{--text:#f4f7fb!important;--muted:#a4adbb!important;--line:#303847!important;--panel:#141821!important;--lime:#a8ff46!important;background:radial-gradient(circle at 10% -20%,#26355b,transparent 34%),#090b10!important;color:var(--text)!important}.play-app .play-header{background:#090b10e8!important;border-color:#252d3a!important;-webkit-backdrop-filter:blur(18px)!important;backdrop-filter:blur(18px)!important}.play-app .play-panel,.play-app .play-start{background:linear-gradient(145deg,#161a23,#10131a)!important;border:1px solid #303847!important;border-radius:16px!important;box-shadow:0 16px 40px #0002}.play-app .play-start{padding:24px;margin:20px 0;display:flex;justify-content:space-between;gap:20px;align-items:center}.play-app .play-start h2{margin:0 0 8px;font-size:24px}.play-app .play-start p:not(.eyebrow){margin:0;color:var(--muted);font-size:13px}.play-start-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.play-start-actions span{font-size:12px;color:var(--muted);max-width:180px}.play-app button,.play-app input:not([type=range]),.play-app select,.play-app textarea{border-radius:10px!important;background:#202631!important;color:#f4f7fb!important;border-color:#394252!important}.play-app .primary,.play-app button[aria-pressed=true]{background:#a8ff46!important;color:#10150b!important;border-color:#a8ff46!important}.play-app .keyboard{height:230px!important;border-radius:14px!important;border-color:#3a4353!important;background:#0e1118!important}.play-app .keyboard button{background:#f2f4f8!important;color:#131820!important;border-color:#8791a0!important}.play-app .keyboard button.sharp{background:#141923!important;color:#f4f7fb!important}.play-app .keyboard button.pressed{background:#a8ff46!important;color:#10150b!important}.play-app .roll-scroll{border-color:#354052!important;border-radius:12px}.play-app .roll-row>span{background:#1d2430!important;color:#f4f7fb!important}.play-app .roll-row button.note{background:#a8ff46!important;color:#10150b!important}.play-app pre{background:#0c1016!important;color:#e7ecf5!important}@media(max-width:650px){.play-app .play-start{align-items:flex-start;flex-direction:column;padding:18px}.play-start-actions,.play-start-actions button{width:100%}.play-app .keyboard{height:190px!important}}.synth-rack{margin:18px 0;padding:18px;border:1px solid #3b4658;border-radius:15px;background:linear-gradient(145deg,#101722,#0b1018)}.synth-rack-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.synth-rack-head h2{margin:4px 0 0}.synth-rack-head button{border-color:#a8ff46!important;color:#a8ff46!important}.synth-controls{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:10px;margin-top:10px}.synth-controls label{padding:10px;border:1px solid #293445;border-radius:10px;color:#aab4c3;font-size:11px}.synth-controls select{width:100%;margin-top:7px}.synth-controls input[type=range]{width:100%;margin-top:12px;accent-color:#a8ff46}@media(max-width:950px){.synth-controls{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){.synth-rack{padding:14px}.synth-rack-head{align-items:flex-start;flex-direction:column}.synth-rack-head button{width:100%}.synth-controls{grid-template-columns:1fr 1fr}}.factory-instrument-list{display:grid;gap:8px;margin:16px 0}.factory-instrument-list article{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px;border:1px solid #2f3a4d;border-radius:12px;background:#0d141f}.factory-instrument-list article>div:first-child{display:flex;flex-direction:column;gap:4px}.factory-instrument-list small{color:#91a0b5}.factory-instrument-list .row{flex-wrap:nowrap}@media(max-width:680px){.factory-instrument-list article{align-items:flex-start;flex-direction:column}.factory-instrument-list .row{width:100%}.factory-instrument-list .row button{flex:1 1}}.play-app{--lime:#52e8ff!important;background:radial-gradient(circle at 86% -20%,#8b7cff20,transparent 34%),#050811!important}.play-app main{max-width:1500px}.play-title{align-items:end;border-bottom:1px solid #27364b;padding-bottom:22px}.play-title h1{font-size:clamp(38px,6vw,72px);letter-spacing:-.05em}.play-start{background:linear-gradient(145deg,#0d1b29,#0a1019)!important}.instrument-browser,.stargate-browser.play-panel{background:#080f18!important;border-color:#2c3c54!important}.instrument-browser-head,.stargate-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.instrument-browser-head h2,.stargate-head h2{font-size:30px;margin:4px 0}.instrument-browser-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.instrument-browser-grid article,.stargate-grid article{min-height:88px;background:#070c14!important;border-color:#29394f!important}.factory-instrument-list article{padding:11px 12px}.factory-instrument-list small{font-size:10px}.stargate-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.stargate-grid article{padding:12px!important}.stargate-grid article h3{font-size:14px!important;margin:5px 0!important}.stargate-grid article p{font-size:10px!important}.stargate-filters{grid-template-columns:1.5fr 1fr!important}.play-app .primary{background:linear-gradient(135deg,#52e8ff,#34d8bd)!important;color:#041017!important;border-color:#52e8ff!important}@media(max-width:850px){.instrument-browser-grid,.stargate-grid{grid-template-columns:1fr!important}}@media(max-width:650px){.instrument-browser-head,.stargate-head{align-items:flex-start;flex-direction:column}.stargate-filters{grid-template-columns:1fr!important}}.instrument-floating-transport{position:fixed;right:18px;bottom:92px;z-index:140;display:flex;align-items:center;gap:7px;padding:7px;border:1px solid #334861;border-radius:999px;background:#07101bea;box-shadow:0 14px 40px #000b,0 0 26px #52e8ff22;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.instrument-floating-transport button{min-height:40px!important;padding:8px 13px!important;border-radius:999px!important;background:#102030!important;color:#dff7ff!important;border:1px solid #355069!important}.instrument-floating-transport .record{color:#ff95a9!important;border-color:#74384b!important}.instrument-floating-transport .record.active{background:#ec4769!important;color:white!important;border-color:#ff6a88!important;box-shadow:0 0 18px #ff51755c}.instrument-floating-transport span{padding:0 9px;color:#8495aa;font:700 9px ui-monospace,monospace;white-space:nowrap}.performance-recorder{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:18px 0 10px;padding:16px 18px;border:1px solid #2e455d;border-radius:15px;background:radial-gradient(circle at 85% 0,#52e8ff18,transparent 38%),linear-gradient(145deg,#0d1925,#080e16)}.performance-recorder h2{margin:4px 0 5px}.performance-recorder p:last-child{margin:0;max-width:680px;color:#8494aa;font-size:11px;line-height:1.5}.performance-recorder-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.performance-recorder-actions label{display:flex;align-items:center;gap:6px;color:#93a3b7;font-size:10px}.play-app .keyboard{position:relative;display:flex!important;align-items:flex-start!important;gap:0!important;height:280px!important;padding:10px 12px 12px!important;overflow-x:auto!important;overflow-y:hidden!important;border:1px solid #34465e!important;border-radius:18px!important;background:linear-gradient(180deg,#0b111a,#070b11)!important;box-shadow:inset 0 1px #ffffff0a,0 18px 45px #0006!important}.play-app .keyboard button{flex:1 0 62px!important;min-width:62px!important;height:252px!important;margin:0!important;padding:0 4px 15px!important;border:1px solid #7d8794!important;border-radius:0 0 8px 8px!important;background:linear-gradient(180deg,#fbfcfe,#e8edf3 74%,#d7dde5)!important;color:#101720!important;box-shadow:inset 0 -10px 16px #adb6c255,0 5px 0 #8c95a1!important;z-index:1}.play-app .keyboard button:first-child{border-radius:8px 0 8px 8px!important}.play-app .keyboard button:last-child{border-radius:0 8px 8px 8px!important}.play-app .keyboard button.sharp{flex:0 0 42px!important;min-width:42px!important;width:42px!important;height:164px!important;margin-left:-21px!important;margin-right:-21px!important;padding-bottom:12px!important;z-index:4!important;border:1px solid #0c1118!important;border-radius:0 0 7px 7px!important;background:linear-gradient(180deg,#242b36,#10151d 72%,#05080c)!important;color:#eaf5ff!important;box-shadow:inset 0 -8px 11px #0009,0 7px 9px #0009!important}.play-app .keyboard button span{font-weight:900;font-size:11px;letter-spacing:.02em}.play-app .keyboard button small{margin-top:4px;font:700 8px ui-monospace,monospace;opacity:.48}.play-app .keyboard button.sharp span{font-size:9px}.play-app .keyboard button.pressed{transform:translateY(3px);background:linear-gradient(180deg,#6ff3ff,#4ddbbf 62%,#8d82ff)!important;color:#041017!important;box-shadow:inset 0 0 22px #fff5,0 2px 0 #236a70!important;border-color:#7bf5ff!important}.play-app .keyboard button.sharp.pressed{height:167px!important}.play-caption{margin:10px 4px 0!important;color:#77889f!important}@media(min-width:900px){.instrument-floating-transport{right:28px;bottom:28px}}@media(max-width:700px){.performance-recorder{align-items:flex-start;flex-direction:column}.performance-recorder-actions{width:100%}.performance-recorder-actions button{flex:1 1}.instrument-floating-transport{left:12px;right:12px;bottom:78px;justify-content:center}.instrument-floating-transport span{display:none}.play-app .keyboard{height:230px!important;padding:8px!important}.play-app .keyboard button{flex-basis:54px!important;min-width:54px!important;height:205px!important}.play-app .keyboard button.sharp{flex-basis:36px!important;min-width:36px!important;width:36px!important;height:138px!important;margin-left:-18px!important;margin-right:-18px!important}}.instrument-profile-picker{flex:2 1 420px;min-width:min(100%,300px);display:grid;gap:6px}.drive-instrument-intake>p,.instrument-engine-select>small,.instrument-profile-picker>small{color:#8498ae;font-size:10px;line-height:1.5}.play-app .sc-catalog-picker{min-width:0}.play-app .sc-filter-label{display:block;color:#94a9c0;font:700 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px}.play-app .sc-catalog-picker>button{width:100%;min-height:50px!important;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px!important;background:#0a1520!important;border:1px solid #35536a!important;border-radius:11px!important;color:#dcebf7!important;text-align:left}.play-app .sc-catalog-picker>button span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.play-app .sc-catalog-picker>button span:last-child{color:#66e7f3;font-size:18px}.play-app .sc-picker-dialog{width:min(680px,calc(100vw - 28px));max-height:84dvh;margin:auto;border:1px solid #45647b;border-radius:18px;background:#0b141f;overflow:hidden;box-shadow:0 30px 100px #000c}.play-app .sc-picker-dialog[open]{grid-template-rows:auto auto auto minmax(0,1fr)}.play-app .sc-picker-dialog header,.play-app .sc-picker-dialog>label,.play-app .sc-picker-dialog>p{min-height:0}.play-app .sc-picker-dialog::backdrop{background:#020711d4;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.play-app .sc-picker-dialog header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid #263a4e;background:linear-gradient(135deg,#0c1d29,#101625)!important}.play-app .sc-picker-dialog h2{font-size:22px;margin:0}.play-app .sc-picker-dialog header button{width:44px;min-height:44px!important;padding:0!important}.play-app .sc-picker-dialog>label{padding:14px 20px 0}.play-app .sc-picker-dialog input{width:100%;box-sizing:border-box;min-height:48px!important;padding:12px 14px!important;font-size:16px}.play-app .sc-picker-dialog>p{padding:0 20px;color:#8da2b9;font-size:11px}.play-app .sc-picker-options{position:relative;z-index:2;height:100%;overflow:auto;min-height:0;padding:0 14px 18px;scroll-padding:12px;overscroll-behavior:contain}.play-app .sc-picker-options button{position:relative;z-index:3;scroll-margin:12px;width:100%;display:flex;align-items:center;gap:10px;text-align:left;min-height:48px!important;padding:10px 12px!important;border:1px solid transparent!important;border-radius:9px!important;background:transparent!important;color:#cbd9e8!important}.play-app .sc-picker-options button:hover{background:#142536!important}.play-app .sc-picker-options button[aria-pressed=true]{background:#173442!important;border-color:#4f91a0!important;color:#85edf3!important}.play-app .sc-picker-options button>span:first-child{flex:1 1}.instrument-engine-select{flex:1 1 100%;margin-top:2px;padding:0;border:0}.instrument-engine-select summary{min-height:44px;display:flex;align-items:center;color:#8497ad;font-size:10px;cursor:pointer}.instrument-engine-select[open]{padding:10px 12px;border:1px solid #293d51;border-radius:10px;background:#0a111b}.instrument-engine-select label{display:grid!important;gap:6px!important}.drive-instrument-intake{margin-top:15px;border:1px solid #31485d;border-radius:12px;background:#09121c}.drive-instrument-intake>summary{min-height:48px;padding:14px 16px;color:#9ee9ef;font-size:12px;cursor:pointer}.drive-instrument-intake>p{padding:0 16px}.drive-instrument-intake .factory-instrument-list{padding:0 12px}.drive-instrument-intake article{background:#080e16!important}.drive-instrument-intake article button:disabled{color:#d5a878!important;border-color:#594936!important}.drive-instrument-intake>button{margin:0 12px 14px}.play-app .play-help summary{color:#67e5f0!important}@media(max-width:650px){.instrument-profile-picker{flex-basis:100%}.play-app .sc-picker-dialog[open]{display:block;overflow-y:auto;overscroll-behavior:contain}.play-app .sc-picker-dialog header,.play-app .sc-picker-dialog>label,.play-app .sc-picker-dialog>p{position:static;display:block}.play-app .sc-picker-options{position:static;height:auto;overflow:visible;scroll-padding:0}.play-app .sc-picker-dialog{width:100%;max-width:none;max-height:91dvh;margin:auto 0 0;border-radius:18px 18px 0 0;padding-bottom:env(safe-area-inset-bottom)}.play-app .sc-picker-dialog header{padding:14px 16px}.play-app .sc-picker-dialog>label{padding:12px 16px 0}.play-app .sc-picker-dialog>p{padding:0 16px}.instrument-engine-select{flex-basis:100%}.drive-instrument-intake .factory-instrument-list{padding:0 8px}}.play-app .sc-picker-dialog{inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#eaf4ff;overflow:visible;box-shadow:none;pointer-events:none}.play-app .sc-picker-dialog[open]{display:grid;place-items:center}.play-app .sc-picker-sheet{pointer-events:auto;width:min(680px,calc(100vw - 28px));max-height:84dvh;min-height:0;display:grid;grid-template-rows:auto auto auto minmax(0,1fr);border:1px solid #45647b;border-radius:18px;background:#0b141f;overflow:hidden;box-shadow:0 30px 100px #000c}.play-app .sc-picker-sheet>label{padding:14px 20px 0}.play-app .sc-picker-sheet>p{padding:0 20px;color:#8da2b9;font-size:11px}@media(max-width:650px){.play-app .sc-picker-dialog[open]{display:grid;place-items:end stretch;overflow:visible}.play-app .sc-picker-sheet{width:100%;max-width:none;max-height:91dvh;margin:0;display:block;overflow-y:auto;overscroll-behavior:contain;border-radius:18px 18px 0 0;padding-bottom:env(safe-area-inset-bottom)}.play-app .sc-picker-sheet>label{position:static;display:block;padding:12px 16px 0}.play-app .sc-picker-sheet>p{position:static;display:block;padding:0 16px}.play-app .sc-picker-sheet .sc-picker-options{position:static;height:auto;overflow:visible;scroll-padding:0}}@media(max-width:700px){.instrument-floating-transport{position:sticky!important;top:8px!important;left:auto!important;right:auto!important;bottom:auto!important;z-index:2000!important;width:max-content;max-width:calc(100vw - 24px);margin:0 0 12px auto;pointer-events:auto!important}}.instrument-quick-start{display:grid;gap:12px}.instrument-quick-start h2{margin:0 0 8px}.instrument-quick-choices{display:flex;flex-wrap:wrap;gap:9px}.instrument-quick-choices button{min-height:42px;border:1px solid #57748b;border-radius:10px;background:#1a2a3c;color:#deeffa;padding:10px 14px;cursor:pointer}.instrument-quick-choices button[aria-pressed=true]{background:#caeaff;color:#0c2a41;border-color:#a9e7ff}.instrument-quick-help{display:flex;gap:10px;flex-wrap:wrap;font-size:11px;color:#b6cce0}.instrument-quick-help kbd{border:1px solid #56758d;padding:2px 6px;border-radius:5px;background:#24364a}.play-app .instrument-range-controls{margin:12px 0 8px;gap:10px;align-items:center}.play-app .instrument-range-controls button{background:#163e4a!important;color:#dcfaff!important;border:1px solid #54c5d7!important;padding:8px 13px;font-weight:750}.play-app .instrument-range-controls button[aria-pressed=true]{background:#a8ff46!important;color:#061417!important}.play-app .instrument-range-controls output{color:#acbdcb;font-size:12px}.play-app .keyboard.full-range{overscroll-behavior-x:contain;scroll-snap-type:x proximity}.play-app .keyboard.full-range button{flex:0 0 54px!important;min-width:54px!important;scroll-snap-align:start}.play-app .keyboard.full-range button.sharp{flex:0 0 36px!important;min-width:36px!important;width:36px!important;margin-left:-18px!important;margin-right:-18px!important}