*,:before,:after,::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}:before,:after{--tw-content:""}html,:host{-webkit-text-size-adjust:100%;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-feature-settings:normal;font-variation-settings:normal;font-family:IBM Plex Mono,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-feature-settings:inherit;font-variation-settings:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (width>=640px){.container{max-width:640px}}@media (width>=768px){.container{max-width:768px}}@media (width>=1024px){.container{max-width:1024px}}@media (width>=1280px){.container{max-width:1280px}}@media (width>=1536px){.container{max-width:1536px}}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.visible{visibility:visible}.invisible{visibility:hidden}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.z-10{z-index:10}.mx-auto{margin-left:auto;margin-right:auto}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.block{display:block}.flex{display:flex}.table{display:table}.grid{display:grid}.h-16{height:4rem}.min-h-dvh{min-height:100dvh}.w-full{width:100%}.max-w-\[1280px\]{max-width:1280px}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.resize{resize:both}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.bg-ink{--tw-bg-opacity:1;background-color:rgb(10 11 12/var(--tw-bg-opacity,1))}.px-6{padding-left:1.5rem;padding-right:1.5rem}.pb-3{padding-bottom:.75rem}.text-left{text-align:left}.font-display{font-family:Tektur,sans-serif}.font-mono{font-family:IBM Plex Mono,monospace}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.tracking-\[0\.14em\]{letter-spacing:.14em}.tracking-\[0\.2em\]{letter-spacing:.2em}.text-\[\#e6e2d8\]{--tw-text-opacity:1;color:rgb(230 226 216/var(--tw-text-opacity,1))}.shadow{--tw-shadow:0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.\!filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}@media (width>=768px){.md\:grid-cols-\[84px_1fr_110px\]{grid-template-columns:84px 1fr 110px}}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--font-brand:"Syne", sans-serif;--font-display:"Tektur", sans-serif;--font-ui:"Plus Jakarta Sans", system-ui, sans-serif;--font-mono:"IBM Plex Mono", monospace;--glass-bg:#121620b8;--glass-bg-card:#161b28a6;--glass-border:#ffffff1f;--glass-border-bright:#ffffff38;--glass-glow:#5ec8ff40;--chassis-hi:#34383c;--chassis-1:#26292c;--chassis-2:#1b1e21;--chassis-3:#15181a;--chassis-edge:#0a0b0c;--hairline:#4a4f55;--label:#9aa1a8;--label-dim:#7c838a;--well:#0e1012;--well-line:#22262a;--text:#e6e2d8;--ivory-face:linear-gradient(180deg,#fff 0%,#fbfaf7 2%,#f2f0ea 52%,#e6e3da 80%,#d5d1c6 100%);--ivory-lip:linear-gradient(180deg,#f4f2ec 0%,#e0dcd1 45%,#c6c1b4 100%);--ebony-face:linear-gradient(180deg,#3b3f44 0%,#23262a 5%,#15171a 42%,#0c0e10 88%,#1d2024 100%);--ebony-lip:linear-gradient(180deg,#0f1114 0%,#2b2f34 55%,#43474d 100%);--key-gap:#14161a;--felt:#660505;--keybed-h:210px;--white-w:56px;--notefall-h:82px;--you:231,195,106;--agent:157,255,106;--next:94,200,255;--landmark:186,148,255;--led-green:#a6ff2e;--led-amber:#ffb545;--lcd-bg:#c3e02a;--lcd-bg-2:#a5c41c;--lcd-ink:#2c3a08;--r-chassis:16px;--r-key:3px;--r-tile:22px;--t-key:70ms;--t-ui:.17s;--ease-key:cubic-bezier(.2,.8,.3,1);--ease-out:cubic-bezier(.22,1,.36,1);--screw:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7.5' fill='%230a0b0c'/%3E%3Ccircle cx='8' cy='7.3' r='6' fill='%23434750'/%3E%3Ccircle cx='8' cy='8' r='6' fill='%2321252a'/%3E%3Cpath d='M8 4.3l3.2 1.85v3.7L8 11.7 4.8 9.85v-3.7z' fill='%230d0f11'/%3E%3Cpath d='M8 5.5l2.2 1.27v2.46L8 10.5 5.8 9.23V6.77z' fill='none' stroke='%23596069' stroke-width='.5'/%3E%3C/svg%3E")}body{background:radial-gradient(1100px 620px at 18% -12%,#1d2226 0%,#0000 55%),radial-gradient(900px 500px at 92% 8%,#1a1f18 0%,#0000 60%),#0a0b0c}.grain{pointer-events:none;opacity:.11;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");position:fixed;inset:0}.rack{min-width:0}.rack-face{isolation:isolate;border-radius:var(--r-chassis);border:1px solid var(--chassis-edge);background-image:var(--screw), var(--screw), var(--screw), var(--screw), linear-gradient(180deg, #ffffff0f, #fff0 150px), repeating-linear-gradient(90deg, #ffffff05 0 1px, #00000006 1px 2px, #ffffff03 2px 3px, transparent 3px 5px), linear-gradient(180deg, var(--chassis-hi) 0%, var(--chassis-1) 20%, var(--chassis-2) 76%, var(--chassis-3) 100%);background-repeat:no-repeat;background-size:16px 16px,16px 16px,16px 16px,16px 16px,auto,auto,auto;background-position:14px 14px, calc(100% - 14px) 14px, 14px calc(100% - var(--keybed-h) - 26px), calc(100% - 14px) calc(100% - var(--keybed-h) - 26px), 0 0, 0 0, 0 0;padding:16px 22px 0;position:relative;box-shadow:inset 0 1px #ffffff24,inset 0 -1px #000c,inset 0 0 70px #0000006b,0 30px 80px #0000008c}.logo-plaque{background:linear-gradient(#26292d,#16181a);border-radius:6px;padding:7px 20px;display:inline-block;box-shadow:inset 0 1px #ffffff29,inset 0 -1px #000000e6,0 2px 6px #0009}.logo-plaque span{background:linear-gradient(#f2f5f7 0%,#9aa1a8 46%,#5b6167 54%,#c9ced3 100%);color:#0000;-webkit-text-stroke:.6px #d2d8de80;filter:drop-shadow(0 1px #000000d9);-webkit-background-clip:text;background-clip:text}.rack-sub{color:var(--label-dim)}.section-rule{align-items:center;gap:16px;margin-top:14px;display:flex}.section-rule:before,.section-rule:after{content:"";background:linear-gradient(90deg, transparent, var(--hairline) 18%, var(--hairline) 82%, transparent);flex:1;height:1px;box-shadow:0 1px #000000a6}.section-rule span{letter-spacing:.3em;color:var(--label);text-shadow:0 1px #000000d9,0 -1px #ffffff12;font-family:Tektur,sans-serif;font-size:12px}.studio-summary{cursor:pointer;transition:opacity var(--t-ui);list-style:none}.studio-summary::-webkit-details-marker{display:none}.studio-summary:hover{opacity:.78}.studio-summary span:after{content:" +";color:var(--label-dim)}.studio[open]>.studio-summary span:after{content:" −"}.studio-summary:focus-visible{outline:2px solid var(--led-green);outline-offset:4px}.lcd{isolation:isolate;background:radial-gradient(125% 90% at 50% 36%, var(--lcd-bg) 0%, var(--lcd-bg-2) 70%, #8fac16 100%);width:100%;min-height:138px;color:var(--lcd-ink);letter-spacing:.06em;text-align:left;text-shadow:0 1px #fff3;border:0;border-radius:5px;padding:14px 18px;font-weight:600;position:relative;box-shadow:0 0 0 9px #0d0f10,0 0 0 10px #ffffff12,inset 0 0 30px #3c50006b,inset 0 2px 6px #0000004d,0 0 42px #a6ff2e26}.lcd:before{content:"";pointer-events:none;border-radius:inherit;opacity:.3;mix-blend-mode:multiply;background-image:linear-gradient(90deg,#0000008c 1px,#0000 1px),linear-gradient(#0000008c 1px,#0000 1px);background-size:3px 3px;position:absolute;inset:0}.lcd:after{content:"";pointer-events:none;border-radius:inherit;background:linear-gradient(115deg,#fff3 0%,#ffffff17 26%,#fff0 28% 100%);position:absolute;inset:0}.lcd:focus-visible{outline:2px solid var(--led-green);outline-offset:12px}#env-path{stroke:var(--lcd-ink)}.power-wrap{justify-items:center;gap:5px;display:grid}.power-wrap em{letter-spacing:.22em;color:var(--label-dim);font-size:9px;font-style:normal}.power{width:56px;height:14px;transition:background var(--t-ui), box-shadow var(--t-ui);background:linear-gradient(#14161a,#0a0b0d);border-radius:4px;box-shadow:inset 0 0 0 2px #0a0b0d,inset 0 2px 4px #000000e6}.power.live{background:linear-gradient(180deg, #d8ff85 0%, var(--led-green) 42%, #6fd400 100%);animation:3.6s ease-in-out infinite led-breathe;box-shadow:inset 0 0 0 2px #0a0b0d,inset 0 -2px 5px #ffffff80,0 0 10px #a6ff2ee6,0 0 26px #a6ff2e6b}#agent-chip{color:var(--label-dim);transition:color var(--t-ui)}#agent-chip.live{color:var(--led-green);text-shadow:0 0 10px #a6ff2e80}.ghost-btn,.mini,.chip{border:1px solid var(--chassis-edge);color:#d7d2c6;letter-spacing:.12em;text-transform:uppercase;transition:background var(--t-ui), color var(--t-ui), box-shadow var(--t-ui), transform 90ms var(--ease-key);background:linear-gradient(#2b2f33,#191c1f);border-radius:999px;padding:8px 14px;font-size:11px;box-shadow:inset 0 1px #ffffff1f,0 1px 2px #0009}.ghost-btn:hover,.mini:hover,.chip:hover{color:#fff;background:linear-gradient(#363a3f,#1e2225)}.ghost-btn:active,.mini:active,.chip:active{transform:translateY(1px);box-shadow:inset 0 2px 4px #000000b3}.ghost-btn:focus-visible,.mini:focus-visible,.chip:focus-visible,.generate:focus-visible,.agent-input:focus-visible{outline:2px solid var(--led-green);outline-offset:2px}.mini{border-radius:7px;padding:6px 10px}.file{cursor:pointer}select.ghost-btn,select.mini{appearance:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background-image:linear-gradient(45deg, transparent 50%, var(--label) 50%), linear-gradient(135deg, var(--label) 50%, transparent 50%), linear-gradient(180deg, #2b2f33, #191c1f);background-position:calc(100% - 14px) calc(50% + 1px),calc(100% - 10px) calc(50% + 1px),0 0;background-repeat:no-repeat;background-size:4px 4px,4px 4px,auto;padding-right:26px}select.ghost-btn option,select.mini option{background:var(--chassis-2);color:var(--text)}.picker{align-items:center;gap:6px;display:inline-flex}.picker>span{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--label-dim);font-size:9px}.picker select{min-width:118px}.generate{color:#1b1408;letter-spacing:.14em;text-transform:uppercase;transition:filter var(--t-ui), transform 90ms var(--ease-key), box-shadow var(--t-ui);background:linear-gradient(#f6dc90,#c4922c);border:0;border-radius:999px;padding:10px 22px;font-family:Tektur,sans-serif;box-shadow:inset 0 1px #ffffff73,0 2px 8px #e7c36a47}.generate:hover{filter:brightness(1.07)}.generate:active{transform:translateY(1px);box-shadow:inset 0 2px 5px #00000059}.generate.sm{padding:8px 14px}.knob-wrap{color:var(--label);letter-spacing:.16em;justify-items:center;gap:5px;padding-top:9px;font-size:10px;display:grid;position:relative}.knob-wrap.sm:before{content:"";background:var(--led-amber);width:5px;height:5px;opacity:calc(.14 + var(--val,0) * .86);box-shadow:0 0 calc(3px + var(--val,0) * 7px) #ffb545e6, 0 0 calc(6px + var(--val,0) * 14px) #ffb54559;transition:opacity var(--t-ui), box-shadow var(--t-ui);border-radius:50%;margin-left:-2.5px;position:absolute;top:0;left:50%}.dial{background:repeating-conic-gradient(#3a3e43 0deg 3deg,#1c1f22 3deg 6deg),#24272b;border-radius:50%;width:46px;height:46px;position:relative;box-shadow:inset 0 0 0 1px #0a0b0c,0 4px 8px #000000a6,0 1px #ffffff1a}.dial.master{width:54px;height:54px}.dial:before{content:"";background:conic-gradient(from 210deg,#4a4e54,#2a2d31,#43474d,#232629,#4a4e54),#2b2e32;border-radius:50%;position:absolute;inset:5px;box-shadow:inset 0 1px #ffffff2e,inset 0 -2px 4px #0009,0 1px 2px #00000080}.dial:after{content:"";width:2.5px;height:13px;transform:translateX(-50%) rotate(var(--rot));transform-origin:50% 16px;background:#f3ead4;border-radius:2px;transition:transform .1s linear;position:absolute;top:7px;left:50%;box-shadow:0 0 5px #f3ead4a6}.dial.master:after{transform-origin:50% 20px;height:14px}.knob-wrap input[type=range]{appearance:none;width:54px;height:3px;accent-color:var(--led-amber);background:#0d0f11;border-radius:99px;box-shadow:inset 0 1px 2px #000000e6}.knob-wrap input[type=range]::-webkit-slider-thumb{appearance:none;background:linear-gradient(#6a7078,#33383d);border-radius:50%;width:9px;height:9px;box-shadow:0 1px 2px #000c}.knob-wrap input[type=range]::-moz-range-thumb{background:linear-gradient(#6a7078,#33383d);border:0;border-radius:50%;width:9px;height:9px}.knob-wrap em{font-style:normal}.fx-row{grid-template-columns:repeat(5,1fr);align-items:end;gap:8px;margin-top:14px;display:grid}.keybed-scroll{overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:none;scroll-behavior:smooth;background:#08090b;border-radius:0 0 15px 15px;margin:12px -22px 0;overflow:auto hidden}.keybed-scroll::-webkit-scrollbar{display:none}.notefall{height:var(--notefall-h,82px);min-width:calc(var(--whites,21) * var(--white-w));border-bottom:1px solid rgba(var(--next),.16);background:repeating-linear-gradient(#ffffff0b 0 1px,#0000 1px 26px),linear-gradient(#05070a 0%,#0b0e13 100%);position:relative;overflow:hidden}.notefall-bar{background:linear-gradient(180deg, rgba(var(--next),.3), rgba(var(--next),.62));box-shadow:inset 0 0 0 1px rgba(var(--next),.55), 0 0 10px rgba(var(--next),.22);transition:bottom .16s var(--ease-out);border-radius:3px;position:absolute}.notefall-bar.now{background:linear-gradient(180deg, rgba(var(--next),.62), rgba(var(--next),.95));box-shadow:inset 0 0 0 1px #ffffff80, 0 0 16px rgba(var(--next),.6)}.piano{height:var(--keybed-h);min-width:calc(var(--whites,21) * var(--white-w));isolation:isolate;perspective:1200px;perspective-origin:50% 0;touch-action:pan-x;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:contain;position:relative}.piano:before{content:"";z-index:5;pointer-events:none;background:linear-gradient(#000000f2 0%,#000000b3 25%,#0000004d 60%,#0000 100%);height:28px;position:absolute;inset:0 0 auto}.piano:after{content:"";z-index:6;pointer-events:none;background:linear-gradient(180deg, var(--felt), #180508);height:3px;position:absolute;inset:0 0 auto}.key{appearance:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:pan-x;transform-origin:50% 0;animation:key-in .42s var(--ease-out) backwards;animation-delay:calc(var(--i,0) * 11ms);transition:transform var(--t-key) var(--ease-key), background var(--t-key) linear, box-shadow var(--t-key) linear;border:0;padding:0;position:absolute;bottom:0;transform:rotateX(4deg)}.key.white{z-index:1;border-radius:0 0 var(--r-key) var(--r-key);background:var(--ivory-face);height:100%;box-shadow:inset 0 1px 0 #fffffff2, inset 1px 0 0 #ffffffd9, inset -1px 0 0 var(--key-gap), inset -4px 0 7px -5px #00000052, inset 0 -26px 20px -22px #00000042}.key.black{z-index:3;background:var(--ebony-face);border-radius:0 0 3px 3px;height:62%;top:0;box-shadow:inset 0 1px #ffffff4d,inset 1.5px 0 #fff3,inset -1.5px 0 #000000e6,0 3px 5px #0000008c,3px 4px 9px -2px #0009}.key.black:before{content:"";pointer-events:none;background:linear-gradient(#ffffff38 0%,#ffffff0f 40%,#fff0 100%);border-radius:2px;width:24%;position:absolute;top:3px;bottom:13px;left:14%}.key-face{pointer-events:none;position:absolute;bottom:0;left:0;right:0}.key.white>.key-face{border-radius:0 0 var(--r-key) var(--r-key);background:linear-gradient(180deg, #0000003d 0 2px, #0000 2px), var(--ivory-lip);height:14px;box-shadow:inset 0 1px #ffffffbf}.key.black>.key-face{background:var(--ebony-lip);border-radius:0 0 3px 3px;height:10px;box-shadow:inset 0 1px #000000d9}.key-name{pointer-events:none;text-align:center;letter-spacing:.06em;color:#1e1c1857;opacity:0;transition:opacity var(--t-ui) var(--ease-out);font-size:8px;position:absolute;bottom:19px;left:0;right:0}.piano:hover .key-name,.piano:focus-within .key-name,.piano.show-names .key-name{opacity:1}.key.black.on-landmark{background-image:linear-gradient(180deg, rgba(var(--landmark),.16) 0%, rgba(var(--landmark),.42) 100%), var(--ebony-face);box-shadow:inset 0 0 0 2px rgba(var(--landmark),.92), inset 0 1px 0 #ffffff38, 0 0 16px rgba(var(--landmark),.55)}.key.black.on-landmark:after{content:"";pointer-events:none;background:rgb(var(--landmark));width:6px;height:6px;box-shadow:0 0 8px rgba(var(--landmark),.9);border-radius:99px;margin-left:-3px;position:absolute;top:9px;left:50%}.key-finger{pointer-events:none;color:#16181a;letter-spacing:.02em;text-align:center;z-index:5;background:#f6f4ee;border-radius:99px;min-width:17px;padding:2px 5px;font-size:11px;font-weight:700;line-height:1;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 1px 3px #0000008c,inset 0 -1px #0000001f}.key.white .key-finger{bottom:36px}.key.black .key-finger{min-width:15px;font-size:10px;bottom:16px}.keybed-bar{justify-content:space-between;align-items:center;gap:12px;margin-top:10px;display:flex}.keybed-legend{letter-spacing:.16em;color:var(--label-dim);font-size:10px}.keybed-tools{flex-shrink:0;align-items:center;gap:6px;display:flex}.keybed-tools .mini.hidden-pan{visibility:hidden}.tempo-tools{border-right:1px solid var(--well-line);align-items:center;gap:4px;margin-right:2px;padding-right:6px;display:flex}.bpm-label{text-align:center;letter-spacing:.12em;min-width:58px;color:var(--label);font-variant-numeric:tabular-nums;font-size:10px}.tempo-slider{letter-spacing:.2em;color:var(--label-dim);align-items:center;gap:8px;font-size:9px;display:inline-flex}.tempo-slider input{width:116px;accent-color:rgb(var(--next))}.hand-map{background:var(--well);border:1px solid var(--well-line);border-radius:10px;justify-content:center;gap:40px;margin-top:12px;padding:10px 12px 8px;display:flex;box-shadow:inset 0 2px 8px #0009}.hand{opacity:.38;transition:opacity var(--t-ui) var(--ease-out);justify-items:center;gap:4px;display:grid}.hand.active{opacity:1}.hand em{letter-spacing:.22em;color:var(--label-dim);font-size:8px;font-style:normal}.hand.active em{color:var(--label)}.hand-svg{width:130px;height:102px}.hand-outline .palm,.hand-outline .bone{fill:#ffffff0d;stroke:var(--hairline);stroke-width:2px;transition:fill var(--t-ui) var(--ease-out), stroke var(--t-ui) var(--ease-out)}.hand.active .hand-outline .palm,.hand.active .hand-outline .bone{fill:rgba(var(--you),.08);stroke:rgba(var(--you),.42)}.digit circle{fill:#1b1e21;stroke:var(--hairline);stroke-width:1.5px;transition:fill var(--t-ui) var(--ease-out), stroke var(--t-ui) var(--ease-out)}.digit text{fill:var(--label-dim);text-anchor:middle;transition:fill var(--t-ui) var(--ease-out);font-family:IBM Plex Mono,monospace;font-size:12px;font-weight:600}.digit.lit circle{fill:rgb(var(--you));stroke:#fff3d2}.digit.lit text{fill:#1b1408}.key-badge{pointer-events:none;color:#04202b;letter-spacing:.06em;z-index:4;background:#5ec8fff2;border-radius:99px;min-width:16px;padding:1px 5px;font-size:10px;font-weight:700;position:absolute;top:10px;left:50%;transform:translate(-50%);box-shadow:0 0 10px #5ec8ff99}.key.black .key-badge{font-size:9px;top:7px}.key.on-human{--sig:var(--you)}.key.on-agent{--sig:var(--agent)}.key.white.on-human,.key.white.on-agent{background-image:linear-gradient(180deg, rgba(var(--sig),.15) 0%, rgba(var(--sig),.5) 45%, rgba(var(--sig),.92) 100%), var(--ivory-face);box-shadow:inset 0 6px 12px -5px #0009, inset 1px 0 0 #ffffffbf, inset -1px 0 0 var(--key-gap), inset 0 -22px 18px -20px #00000052, 0 0 12px rgba(var(--sig),.85), 0 0 28px rgba(var(--sig),.55), 0 0 55px rgba(var(--sig),.3);z-index:6;transform:rotateX(1.8deg)translateY(3px)}.key.black.on-human,.key.black.on-agent{background-image:linear-gradient(180deg, rgba(var(--sig),.1) 0%, rgba(var(--sig),.45) 50%, rgba(var(--sig),.85) 100%), var(--ebony-face);box-shadow:inset 0 4px 8px -5px #000000e6, inset 1.5px 0 0 #ffffff4d, 0 1px 2px #00000080, 0 0 12px rgba(var(--sig),.8), 0 0 25px rgba(var(--sig),.5);z-index:8;transform:rotateX(1.8deg)translateY(3px)}.key.white.on-both{background-image:linear-gradient(100deg, #e7c36ae6 0%, #e7c36abf 38%, #9dff6abf 62%, #9dff6ae6 100%), var(--ivory-face);z-index:6;transform:rotateX(1.8deg)translateY(3px);box-shadow:inset 0 6px 10px -6px #00000080,0 0 15px #9dff6a99,0 0 35px #e7c36a80}.key.black.on-both{background-image:linear-gradient(100deg, #e7c36ad9 0%, #e7c36ab3 40%, #9dff6ab3 60%, #9dff6ad9 100%), var(--ebony-face);z-index:8;transform:rotateX(1.8deg)translateY(3px);box-shadow:inset 0 4px 8px -5px #000000e6,0 0 14px #9dff6ab3,0 0 30px #e7c36a80}.key.on-next{z-index:5}.key.white.on-next{background-image:linear-gradient(180deg, #5ec8ff26 0%, #5ec8ff73 50%, #5ec8ffd9 100%), var(--ivory-face);animation:1.3s ease-in-out infinite next-breathe;box-shadow:inset 0 0 0 2px #5ec8fff2,inset 0 -22px 18px -20px #00000047,0 0 15px #5ec8ffcc,0 0 35px #5ec8ff80,0 0 70px #5ec8ff4d}.key.black.on-next{background-image:linear-gradient(180deg, #5ec8ff33 0%, #5ec8ff99 50%, #5ec8ffe6 100%), var(--ebony-face);animation:1.3s ease-in-out infinite next-breathe;box-shadow:inset 0 0 0 2px #5ec8fff2,0 0 15px #5ec8ffd9,0 0 35px #5ec8ff80}.key:focus-visible{outline:2px solid var(--led-green);outline-offset:-3px;z-index:7}.duet-strip,.lesson-strip{background:var(--well);border:1px solid var(--well-line);letter-spacing:.12em;text-transform:uppercase;transition:border-color var(--t-ui), box-shadow var(--t-ui);border-radius:8px;align-items:center;gap:10px;margin-top:14px;padding:10px 12px;font-size:11px;display:grid;box-shadow:inset 0 2px 6px #0009}.duet-strip{grid-template-columns:auto 1fr auto auto 1fr}.lesson-strip{grid-template-columns:auto 1fr auto auto}.strip-row{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:12px;display:grid}.strip-row>*{margin-top:10px}.duet-strip.together{border-color:#9dff6a99;box-shadow:inset 0 2px 6px #0009,0 0 0 1px #9dff6a38}.lesson-strip.teaching{border-color:#5ec8ff99;box-shadow:inset 0 2px 6px #0009,0 0 0 1px #5ec8ff40}.pill{border:1px solid var(--well-line);color:var(--label-dim);transition:background var(--t-ui), color var(--t-ui), border-color var(--t-ui), box-shadow var(--t-ui);border-radius:99px;padding:3px 8px}.pill.you.live{color:#1b1408;background:#e7c36a;border-color:#e7c36a;box-shadow:0 0 12px #e7c36a73}.pill.agent.live{color:#08140a;background:#9dff6a;border-color:#9dff6a;box-shadow:0 0 12px #9dff6a73}.pill.next.live{color:#041820;background:#5ec8ff;border-color:#5ec8ff;box-shadow:0 0 12px #5ec8ff73}.duet-notes{color:var(--text);text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.duet-mid{color:var(--label-dim);letter-spacing:.2em}.lesson-hits{color:var(--label-dim);white-space:nowrap}.take-line{letter-spacing:.08em;text-transform:uppercase;color:var(--label-dim);margin-top:12px;font-size:11px}.take-line span{color:var(--text)}.chip.live{color:var(--led-green);border-color:#9dff6ab3;box-shadow:inset 0 1px #ffffff1a,0 0 10px #9dff6a40}.mini.live{border-color:rgba(var(--next),.7);color:rgb(var(--next));box-shadow:inset 0 1px 0 #ffffff1a, 0 0 10px rgba(var(--next),.22)}.roll{background:repeating-linear-gradient(180deg, #ffffff06 0 1px, transparent 1px 19px), var(--well);border:1px solid var(--well-line);border-radius:8px;grid-auto-columns:1fr;grid-auto-flow:column;height:76px;margin-top:14px;display:grid;overflow:hidden;box-shadow:inset 0 2px 8px #000000b3}.roll-beat{border-right:1px solid #ffffff0d;position:relative}.roll-bar{background:#e7c36a0d;box-shadow:inset 1px 0 #e7c36a2e}.roll-hit{background:#e7c36a;border-radius:99px;width:7px;height:7px;position:absolute;box-shadow:0 0 8px #e7c36ab3}.rack-status{letter-spacing:.14em;text-transform:uppercase;color:var(--label-dim);text-align:right;white-space:nowrap;flex-direction:column;gap:2px;font-size:10px;display:flex}.chat-bar-wrap{z-index:10;max-width:1280px;margin:0 auto;padding:0 24px 14px;position:relative}.chat-bar{border:1px solid var(--chassis-edge);background:repeating-linear-gradient(90deg, #ffffff05 0 1px, #00000006 1px 2px, transparent 2px 5px), linear-gradient(180deg, var(--chassis-1) 0%, var(--chassis-2) 70%, var(--chassis-3) 100%);border-radius:12px;grid-template-columns:1fr auto;grid-template-areas:"head head""line form""chips chips""music music""log log";align-items:center;gap:8px 18px;padding:10px 14px;display:grid;box-shadow:inset 0 1px #ffffff1a,inset 0 -1px #000c,0 12px 34px #00000073}.chat-head{border-bottom:1px solid #ffffff0f;flex-wrap:wrap;grid-area:head;align-items:center;gap:6px 10px;padding-bottom:8px;display:flex}.chat-head-tools{align-items:center;gap:6px;margin-left:auto;display:flex}.chat-line{flex-wrap:wrap;grid-area:line;align-items:baseline;gap:6px 12px;min-width:0;display:flex}.chat-take.is-empty{display:none}.chat-pill{border:1px solid rgba(var(--agent),.35);letter-spacing:.22em;color:rgb(var(--agent));border-radius:99px;padding:3px 8px;font-size:9px}.chat-coach{min-width:220px;color:var(--text);flex:1;font-size:12px;line-height:1.5}.quit-chip{color:#f0c9c3;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;transition:background var(--t-ui), color var(--t-ui), transform 90ms var(--ease-key);background:linear-gradient(#3c2220e6,#261615e6);border:1px solid #dc786e6b;border-radius:999px;flex:none;margin-left:auto;padding:6px 12px;font-size:10px;box-shadow:inset 0 1px #ffffff14,0 1px 2px #00000080}.quit-chip:hover{color:#fff;background:linear-gradient(#562c28f2,#341c1af2)}.quit-chip:active{transform:translateY(1px)}.chat-take{letter-spacing:.14em;text-transform:uppercase;color:var(--label-dim);white-space:nowrap;font-size:10px}.chat-take span{color:rgb(var(--you))}.chat-form{grid-area:form;align-items:center;gap:8px;width:min(420px,100%);display:flex}.chat-chips{border-top:1px solid var(--well-line);flex-wrap:wrap;grid-area:chips;align-items:center;gap:6px;padding-top:8px;display:flex}.chat-chips .chip{padding:5px 10px;font-size:10px}.chip.voice-chip:before{content:"";vertical-align:middle;width:5px;height:5px;transition:background var(--t-ui), box-shadow var(--t-ui);background:#4a5157;border-radius:50%;margin-right:6px;display:inline-block}.chip.voice-chip.live:before{background:var(--led-green);box-shadow:0 0 6px #a6ff2eb3}.ghost-btn.songs-btn{border-color:rgba(var(--next),.55);color:rgb(var(--next));box-shadow:inset 0 1px 0 #ffffff1a, 0 0 10px rgba(var(--next),.18)}.ghost-btn.songs-btn:hover{border-color:rgba(var(--next),.85);color:#eaf7ff;box-shadow:inset 0 1px 0 #ffffff24, 0 0 14px rgba(var(--next),.32)}body[data-mode=dj] .teach-only,body[data-mode=teach] .dj-only{display:none!important}.mode-switch{border:1px solid var(--well-line);background:#00000047;border-radius:999px;gap:4px;padding:3px;display:inline-flex}.mode-switch .chip{box-shadow:none;background:0 0;border-color:#0000;padding:4px 12px}.mode-switch .chip.live{border-color:rgba(var(--next),.6);background:rgba(var(--next),.14);color:#eaf7ff}.mode-switch .chip[data-mode-pick=dj].live{color:#ffe9f8;background:#ff4fc129;border-color:#ff4fc1a6}.chat-transcript{grid-area:log}.music-result{background:linear-gradient(90deg,#ffd23f14,#13161475);border:1px solid #ffd23f52;border-radius:9px;grid-area:music;grid-template-columns:minmax(0,1fr) minmax(180px,320px) auto;align-items:center;gap:10px 14px;padding:9px 10px 9px 12px;display:grid}.music-result-copy{min-width:0}.music-result-kicker{color:#ffd23f;letter-spacing:.2em;margin-bottom:2px;font-size:9px}.music-result-copy>p:last-child{color:var(--label-dim);font-size:11px;line-height:1.35}.music-result audio{accent-color:#ffd23f;width:100%;height:30px}.chat-transcript summary{letter-spacing:.2em;text-transform:uppercase;width:max-content;color:var(--label-dim);cursor:pointer;font-size:10px}.chat-transcript summary:hover,.chat-transcript[open] summary{color:var(--label)}.agent-log{-webkit-user-select:text;user-select:text;max-height:220px;padding-right:4px;overflow:auto}.bubble{-webkit-user-select:text;user-select:text;border:1px solid #0000;border-radius:10px;margin-bottom:10px;padding:10px 12px;font-size:12px;line-height:1.45;position:relative}.bubble-head{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.bubble-head span{letter-spacing:.18em;text-transform:uppercase;color:var(--label-dim);-webkit-user-select:none;user-select:none;font-size:9px}.bubble-copy{color:var(--label-dim);font-family:var(--font-mono);letter-spacing:.08em;cursor:pointer;opacity:.65;transition:all .12s var(--ease-out);-webkit-user-select:none;user-select:none;background:#00000059;border:1px solid #ffffff1f;border-radius:4px;padding:2px 6px;font-size:9px}.bubble:hover .bubble-copy,.bubble-copy:focus-visible{opacity:1;color:#fff;border-color:#ffffff4d}.bubble-copy.copied{color:#9dff6a;opacity:1;background:#9dff6a33;border-color:#9dff6a99}.bubble-body{white-space:pre-wrap;-webkit-user-select:text;user-select:text;cursor:text}.bubble.user{background:#1e2225;border-color:#2b3034}.bubble.agent{background:#182016;border-color:#9dff6a38}.bubble.pending{color:var(--label-dim)}.bubble.pending i{background:currentColor;border-radius:50%;width:3px;height:3px;margin-left:3px;animation:1.05s ease-in-out infinite bubble-dot;display:inline-block}.bubble.pending i:nth-of-type(2){animation-delay:.18s}.bubble.pending i:nth-of-type(3){animation-delay:.36s}@keyframes bubble-dot{0%,60%,to{opacity:.25}30%{opacity:1}}@media (prefers-reduced-motion:reduce){.bubble.pending i{opacity:.6;animation:none}}.agent-input{border:1px solid var(--chassis-edge);min-width:0;color:var(--text);background:#0d0f11;border-radius:8px;flex:1;padding:8px 12px;font-size:12px;box-shadow:inset 0 2px 5px #000000bf;-webkit-user-select:text!important;user-select:text!important}.agent-input::placeholder{color:#5d646a}.paste-btn{border-radius:8px;padding:6px 10px;font-size:11px}.meter-wrap{justify-items:center;gap:4px;display:grid}.meter{background:#08090a;border-radius:3px;width:26px;height:66px;box-shadow:inset 0 0 0 1px #000,inset 0 2px 6px #000000e6}.meter-labels{letter-spacing:.2em;color:var(--label-dim);gap:10px;font-size:8px;display:flex}.intro{z-index:60;overscroll-behavior:contain;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:radial-gradient(900px 500px at 50% -8%,#ffffff0d 0%,#0000 65%),radial-gradient(600px 400px at 85% 15%,#000000e6 0%,#0000 70%),#060708f0;padding:32px 20px;position:fixed;inset:0;overflow:auto}.intro-card{border-radius:var(--r-chassis);border:1px solid var(--chassis-edge);background-image:var(--screw), var(--screw), var(--screw), var(--screw), linear-gradient(180deg, #ffffff12 0%, #fff0 140px), repeating-linear-gradient(90deg, #ffffff05 0 1px, #00000006 1px 2px, #ffffff03 2px 3px, transparent 3px 5px), linear-gradient(180deg, var(--chassis-hi) 0%, var(--chassis-1) 18%, var(--chassis-2) 72%, var(--chassis-3) 100%);width:min(920px,100%);animation:intro-rise .4s var(--ease-out) backwards;background-position:14px 14px,calc(100% - 14px) 14px,14px calc(100% - 14px),calc(100% - 14px) calc(100% - 14px),0 0,0 0,0 0;background-repeat:no-repeat;background-size:16px 16px,16px 16px,16px 16px,16px 16px,auto,auto,auto;margin:auto;padding:32px 34px 28px;position:relative;box-shadow:inset 0 1px #ffffff29,inset 0 -1px #000000d9,inset 0 0 60px #00000073,0 35px 90px #000000d9}.intro-close{border:1px solid var(--chassis-edge);width:28px;height:28px;color:var(--label);cursor:pointer;transition:all var(--t-ui) var(--ease-out);background:linear-gradient(#2b2e32 0%,#17191b 100%);border-radius:4px;justify-content:center;align-items:center;font-family:Tektur,sans-serif;font-size:11px;font-weight:700;display:flex;position:absolute;top:14px;right:14px;box-shadow:inset 0 1px #ffffff1f,0 2px 5px #0009}.intro-close:hover{border-color:var(--hairline);color:#fff;background:linear-gradient(#383c42 0%,#1e2124 100%)}.intro-plaque-wrap{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:16px;display:flex}.intro-plaque{letter-spacing:.22em;color:#f1ede4;text-shadow:0 1px 2px #000;background:linear-gradient(#1f2226 0%,#0d0f11 100%);border:1px solid #000;border-radius:4px;padding:6px 18px 5px;font-size:26px;display:inline-block;box-shadow:inset 0 1px #ffffff1f,0 2px 6px #000000b3}.intro-serial{letter-spacing:.24em;text-transform:uppercase;color:var(--label-dim);font-size:10px}.swatch{width:10px;height:10px;box-shadow:inset 0 1px 1px #ffffff80, 0 0 10px rgba(var(--sig), .8);background:rgb(var(--sig));border:1px solid #000c;border-radius:99px;flex:none}.swatch.next{--sig:var(--next)}.swatch.landmark{--sig:var(--landmark)}.swatch.you{--sig:var(--you)}.swatch.agent{--sig:var(--agent)}.generate.lg{letter-spacing:.12em;align-items:center;gap:10px;padding:13px 28px;font-family:Tektur,sans-serif;font-size:13px;font-weight:700;display:inline-flex}.pilot-dot{width:8px;height:8px;transition:all var(--t-ui);background:#1b1509;border:1px solid #000c;border-radius:99px;box-shadow:inset 0 1px 1px #000c}.generate.lg:hover .pilot-dot{background:#fff;box-shadow:0 0 8px #fff}.celebration-backdrop{z-index:70;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:intro-rise .3s var(--ease-out) backwards;background:#060708eb;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.celebration-card{text-align:center;border-radius:var(--r-chassis);border:1px solid var(--chassis-edge);background-image:var(--screw), var(--screw), var(--screw), var(--screw), linear-gradient(180deg, #ffffff12 0%, #fff0 100px), linear-gradient(180deg, var(--chassis-hi) 0%, var(--chassis-1) 20%, var(--chassis-2) 75%, var(--chassis-3) 100%);width:min(500px,100%);animation:celebration-pop .35s var(--ease-out) backwards;background-position:12px 12px,calc(100% - 12px) 12px,12px calc(100% - 12px),calc(100% - 12px) calc(100% - 12px),0 0,0 0;background-repeat:no-repeat;background-size:14px 14px,14px 14px,14px 14px,14px 14px,auto,auto;padding:34px 32px 30px;position:relative;box-shadow:inset 0 1px #ffffff29,inset 0 -1px #000000d9,0 30px 80px #000000e6}.celebration-badge{color:#f6dc90;letter-spacing:.25em;background:linear-gradient(#1f2226 0%,#0d0f11 100%);border:1px solid #000;border-radius:4px;margin-bottom:14px;padding:4px 14px;font-family:Tektur,sans-serif;font-size:9px;font-weight:700;display:inline-block;box-shadow:inset 0 1px #ffffff1a,0 2px 4px #0009}.star-rating{color:#2b2e32;justify-content:center;gap:16px;margin:12px 0 18px;font-size:32px;display:flex}.star.lit{color:#ffc038;text-shadow:0 0 16px #ffc038d9,0 0 32px #ffc03866;animation:.45s cubic-bezier(.175,.885,.32,1.275) backwards star-bounce}.star:nth-child(2){animation-delay:90ms}.star:nth-child(3){animation-delay:.18s}.celebration-title{letter-spacing:.08em;color:#f1ede4;text-shadow:0 1px 2px #000;margin-bottom:6px;font-family:Tektur,sans-serif;font-size:22px;font-weight:700}.celebration-msg{color:#9da3a8;margin-bottom:22px;font-size:12px;line-height:1.5}.celebration-stats{justify-content:center;gap:14px;margin-bottom:24px;display:flex}.stat-pill{background:var(--well);border:1px solid var(--well-line);border-radius:4px;flex-direction:column;padding:8px 16px;display:flex;box-shadow:inset 0 2px 4px #000c}.stat-pill span{color:var(--led-green);text-shadow:0 0 8px #9dff6a80;font-family:IBM Plex Mono,monospace;font-size:18px;font-weight:700}.stat-pill em{letter-spacing:.2em;text-transform:uppercase;color:var(--label-dim);font-size:8px;font-style:normal}.celebration-actions{justify-content:center;gap:12px;display:flex}@keyframes celebration-pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes star-bounce{0%{opacity:0;transform:scale(.3)rotate(-30deg)}70%{transform:scale(1.2)rotate(10deg)}to{opacity:1;transform:scale(1)rotate(0)}}.generate.lg{padding:13px 30px;font-size:14px}.intro-note{min-width:200px;color:var(--label-dim);flex:1;font-size:11px;line-height:1.5}.hidden{display:none!important}.sr-only{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}@keyframes led-breathe{0%,to{filter:brightness()}50%{filter:brightness(1.15)}}@keyframes next-breathe{0%,to{filter:brightness()}50%{filter:brightness(1.22)}}@keyframes key-in{0%{opacity:0;translate:0 16px}to{opacity:1;translate:0}}@keyframes intro-rise{0%{opacity:0;translate:0 14px}to{opacity:1;translate:0}}@media (width>=1024px){.stage{grid-template-columns:minmax(0,1fr) clamp(288px,22vw,380px);gap:18px;max-width:1760px;margin:0 auto;padding:0 24px;display:grid}.stage>main{grid-area:1/1;max-width:none;margin:0;padding-left:0;padding-right:0}.stage>.chat-bar-wrap{grid-area:1/2;min-width:0;max-width:none;min-height:460px;margin:0;padding:0;position:relative}.chat-bar{flex-direction:column;align-items:stretch;gap:10px;display:flex;position:absolute;inset:0;overflow:hidden}.chat-form{width:100%}.chat-head{order:0}.chat-line{order:1}.chat-transcript{order:2}.music-result{order:3}.chat-chips{order:4}.chat-form{order:5}.chat-head-tools{margin-left:0}.chat-line{border:1px solid var(--chassis-edge);border-left:2px solid rgba(var(--next), .75);background:linear-gradient(#ffffff09,#00000029);border-radius:10px;align-items:center;padding:10px 12px;box-shadow:inset 0 1px #ffffff0d}.chat-coach{flex:100%;min-width:0;font-size:13px}.chat-transcript{background:var(--well);border:1px solid #00000080;border-radius:10px;flex:1;min-height:0;padding:0 10px 8px;overflow:auto;box-shadow:inset 0 2px 7px #0000008c}.chat-transcript summary{z-index:1;background:var(--well);width:auto;margin:0 -10px 2px;padding:8px 10px 6px;position:sticky;top:0}.agent-log{max-height:none}.chat-chips{gap:4px}.chat-chips .chip{letter-spacing:.06em;padding:4px 8px}.music-result{grid-template-columns:minmax(0,1fr) auto}.music-result audio{grid-column:1/-1}}@media (pointer:coarse){:root{--t-key:32ms;--white-w:64px}.key,.key.on-next{animation:none}}@media (width<=900px){.fx-row{grid-template-columns:repeat(3,1fr);row-gap:16px}:root{--keybed-h:176px}.strip-row{grid-template-columns:1fr;gap:0}.chat-bar-wrap{padding:0 16px 12px}.chat-bar{grid-template-columns:1fr;grid-template-areas:"head""line""form""chips""music""log"}.chat-form{width:100%}.chat-take{display:none}.music-result{grid-template-columns:minmax(0,1fr) auto}.music-result audio{grid-column:1/-1}}@media (width<=700px){.intro-card{padding:24px 20px 22px}.intro-actions{margin-top:22px}}@media (width<=640px){.lesson-strip{grid-template-columns:auto minmax(0,1fr)}.duet-strip{grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr)}.duet-strip .duet-mid{display:none}}@media (height<=900px){:root{--keybed-h:184px}}@media (height<=780px){:root{--keybed-h:160px}.chat-bar{gap:6px 14px}.lcd{min-height:120px}}.audio-blocked{left:50%;bottom:calc(12px + env(safe-area-inset-bottom));z-index:80;border:1px solid rgba(var(--you), .5);width:min(420px,100vw - 24px);color:var(--text);text-align:left;background:#24201a;border-radius:12px;align-items:center;gap:10px;padding:12px 16px;font-size:13px;line-height:1.35;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 10px 30px #0009}.audio-blocked strong{color:rgb(var(--you));display:block}.audio-blocked-icon{flex-shrink:0;font-size:20px}.keybed-scroll{position:relative}.keybed-scroll.can-pan-left.can-pan-right{-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 22px calc(100% - 22px),#0000 100%);mask-image:linear-gradient(90deg,#0000 0,#000 22px calc(100% - 22px),#0000 100%)}.keybed-scroll.can-pan-left:not(.can-pan-right){-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 22px 100%);mask-image:linear-gradient(90deg,#0000 0,#000 22px 100%)}.keybed-scroll.can-pan-right:not(.can-pan-left){-webkit-mask-image:linear-gradient(90deg,#000 0 calc(100% - 22px),#0000 100%);mask-image:linear-gradient(90deg,#000 0 calc(100% - 22px),#0000 100%)}@media (width<=640px){:root{--white-w:42px;--keybed-h:168px;--notefall-h:56px}.rack-face{flex-direction:column;padding:12px 14px 0;display:flex}.rack-face>.flex{flex-wrap:wrap;order:1;gap:10px}.rack-face>.strip-row{order:2}.rack-face>.keybed-bar{order:3}.rack-face>.hand-map{order:4}.rack-face>.keybed-scroll{order:5}.rack-face>.mt-4.grid{order:90}.rack-face>.studio{order:95}.keybed-scroll{margin:10px -14px 0}main{padding-left:max(12px, env(safe-area-inset-left));padding-right:max(12px, env(safe-area-inset-right));padding-bottom:calc(12px + env(safe-area-inset-bottom))}.chat-bar-wrap{padding-left:max(12px, env(safe-area-inset-left));padding-right:max(12px, env(safe-area-inset-right))}.agent-input,select.ghost-btn,select.mini{font-size:16px}.agent-input{padding:10px 12px}.chip,.mini,.ghost-btn,.quit-chip{letter-spacing:.08em;min-height:44px;padding:10px 14px;font-size:12px}.chat-chips{overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;padding-bottom:2px;overflow-x:auto}.chat-chips::-webkit-scrollbar{display:none}.chat-chips .chip{flex:none;min-height:44px;padding:10px 14px;font-size:12px}.generate{min-height:44px}.rack-status{display:none}.chat-head{scrollbar-width:none;flex-wrap:nowrap;overflow-x:auto}.chat-head::-webkit-scrollbar{display:none}.chat-head .chat-pill{display:none}.chat-head-tools{flex-wrap:nowrap;flex:none}.chat-head>*{flex:none}.rack-face>.flex>.logo-plaque,#duet-strip,.keybed-legend,.chat-transcript{display:none}.keybed-tools .mini{min-width:44px;padding:10px}.studio-summary,.chat-transcript summary{align-items:center;min-height:44px;display:flex}.chat-transcript summary{font-size:12px}.intro-close{width:44px;height:44px;font-size:16px}.keybed-bar{flex-wrap:wrap;gap:8px}.keybed-legend{letter-spacing:.1em;flex-basis:100%;order:2;font-size:11px}.keybed-tools{order:1}.lesson-strip,.duet-strip{letter-spacing:.06em;font-size:12px}.chat-coach{min-width:0;font-size:14px}.key-name{font-size:10px}.intro{-webkit-backdrop-filter:none;backdrop-filter:none;padding:16px 14px calc(16px + env(safe-area-inset-bottom));background:#0c0f14}.intro-card{flex-direction:column;padding:18px 16px 16px;display:flex}.intro-head{order:1}.intro-lede{order:2}.intro-actions{order:3;margin-top:16px}.intro-legend{order:4;font-size:10px}.intro-pick{order:5;margin-top:18px}}@media (height<=500px) and (orientation:landscape) and (pointer:coarse){:root{--keybed-h:min(46vh, 172px);--white-w:52px;--notefall-h:44px}.chat-head,.chat-chips,.chat-transcript,.studio,.rack-face>.mt-4.grid,.rack-face>.flex,.strip-row,.keybed-legend,.chat-take{display:none}.chat-bar-wrap{z-index:30;padding:4px max(10px, env(safe-area-inset-right)) 2px max(10px, env(safe-area-inset-left))}.chat-bar{gap:4px;padding:6px 12px}.chat-line{gap:8px;padding-right:132px}.chat-coach{min-width:0;font-size:13px}.chat-form{width:min(340px,100%)}.agent-input{padding:6px 10px;font-size:16px}main{padding-top:0;padding-bottom:calc(4px + env(safe-area-inset-bottom));padding-left:max(10px, env(safe-area-inset-left));padding-right:max(10px, env(safe-area-inset-right))}.rack-face{padding:6px 12px 0}.keybed-scroll{margin:6px -12px 0}.keybed-bar{margin-top:4px}.keybed-tools .mini{min-width:40px;min-height:40px;padding:8px}.quit-chip{top:max(6px, env(safe-area-inset-top));right:max(10px, env(safe-area-inset-right));z-index:20;min-height:40px;padding:8px 12px;font-size:11px;position:fixed}}.intro-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px 20px;display:flex}.intro-lede{max-width:62ch;font-family:var(--font-ui);color:#b9c0c8;margin-top:14px;font-size:15px;line-height:1.55}.intro-lede em{color:rgb(var(--next));font-style:normal}.intro-legend{border-top:1px solid var(--glass-border);font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--label-dim);flex-wrap:wrap;gap:10px 20px;margin-top:18px;padding-top:14px;font-size:10px;display:flex}.intro-legend li{align-items:center;gap:8px;display:flex}.intro-pick{margin-top:20px}.bento{grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:minmax(112px,auto);gap:14px;display:grid}.bento-tile{grid-column:span 3}.bento-tile.is-hero,.bento-tile.is-featured{grid-area:span 2/span 6}.bento-tile.is-wide{grid-column:span 12}.bento-tile{--sig:var(--next);isolation:isolate;text-align:left;border:1px solid var(--glass-border);border-radius:var(--r-tile);color:inherit;background:radial-gradient(120% 90% at 18% -12%, rgba(var(--sig), .24), transparent 62%), linear-gradient(158deg, #ffffff13, #ffffff03 44%), var(--glass-bg-card);-webkit-backdrop-filter:blur(20px)saturate(160%);backdrop-filter:blur(20px)saturate(160%);box-shadow:inset 0 1px 0 var(--glass-border-bright), inset 0 -34px 60px -44px rgba(var(--sig), .6), 0 22px 46px -24px #000000d9;transition:transform .22s var(--ease-out), border-color var(--t-ui), box-shadow .26s var(--ease-out);animation:tile-rise .52s var(--ease-out) backwards;animation-delay:calc(var(--i,0) * 26ms);align-content:start;gap:7px;padding:16px 18px 18px;display:grid;position:relative;overflow:hidden}button.bento-tile{cursor:pointer}.bento-tile:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(50% 50% at 50% 50%, rgba(var(--sig), .34), transparent 70%);filter:blur(26px);opacity:.85;height:90%;transition:opacity .26s var(--ease-out), transform .42s var(--ease-out);position:absolute;inset:-40% -20% auto}.bento-tile:after{content:"";z-index:-1;pointer-events:none;opacity:.3;mix-blend-mode:screen;width:52%;height:46%;transition:opacity .26s var(--ease-out);background-repeat:no-repeat;position:absolute;bottom:0;right:0;-webkit-mask-image:linear-gradient(105deg,#0000 0%,#000 55%);mask-image:linear-gradient(105deg,#0000 0%,#000 55%)}.bento-tile:hover,.bento-tile:focus-visible{border-color:rgba(var(--sig), .55);box-shadow:inset 0 1px 0 #ffffff4d, inset 0 -34px 60px -40px rgba(var(--sig), .8), 0 30px 60px -22px #000000e6;transform:translateY(-3px)}.bento-tile:hover:before{opacity:1;transform:translateY(8%)}.bento-tile:hover:after{opacity:.5}.bento-tile:focus-visible{outline:2px solid rgba(var(--sig), .9);outline-offset:3px}.bento-tile:active{transform:translateY(-1px)}.tile-meta{font-family:var(--font-mono);letter-spacing:.18em;align-items:center;gap:10px;font-size:9px;font-style:normal;display:flex}.tile-num{color:rgba(var(--sig), .95);font-style:normal}.tile-tier{color:var(--label-dim);border:1px solid rgba(var(--sig), .28);background:rgba(var(--sig), .07);border-radius:99px;padding:2px 7px;font-style:normal}.bento-tile em{font-family:var(--font-ui);letter-spacing:-.01em;color:#f4f7fa;font-size:16px;font-style:normal;font-weight:700}.tile-say{font-family:var(--font-ui);color:#a8b0b9;max-width:46ch;font-size:12.5px;line-height:1.5}.bento-tile.is-hero em,.bento-tile.is-featured em{font-family:var(--font-brand);letter-spacing:-.02em;margin-top:4px;font-size:clamp(26px,3vw,38px);font-weight:800;line-height:1.02}.bento-tile.is-hero .tile-say,.bento-tile.is-featured .tile-say{max-width:30ch;font-size:14px}.bento-tile.is-hero,.bento-tile.is-featured{padding:20px 22px 22px}.bento-tile.is-hero:after,.bento-tile.is-featured:after{opacity:.34;width:46%;height:66%}.fam-start{--sig:var(--next)}.fam-basic{--sig:var(--agent)}.fam-mid{--sig:var(--you)}.fam-adv{--sig:var(--landmark)}.fam-duet{--sig:255,120,150}.fam-dj{--sig:255,79,193}[data-viz=groups]:after{background-image:linear-gradient(90deg, rgba(var(--sig), .85) 0 14%, transparent 14%), linear-gradient(90deg, transparent 0 34%, #ffffff80 34% 44%, transparent 44%), linear-gradient(90deg, transparent 0 54%, #ffffff80 54% 64%, transparent 64%);background-position:0 100%,0 100%,0 100%;background-size:100% 62%,100% 88%,100% 88%}[data-viz=run]:after{background-image:linear-gradient(90deg, rgba(var(--sig), .75) 0 18%, transparent 18%), linear-gradient(90deg, transparent 0 28%, rgba(var(--sig), .6) 28% 46%, transparent 46%), linear-gradient(90deg, transparent 0 56%, rgba(var(--sig), .45) 56% 74%, transparent 74%);background-position:0 100%,0 100%,0 100%;background-size:100% 46%,100% 68%,100% 92%}[data-viz=hand]:after{background-image:linear-gradient(90deg, rgba(var(--sig), .5) 0 12%, transparent 12%), linear-gradient(90deg, transparent 0 20%, rgba(var(--sig), .65) 20% 32%, transparent 32%), linear-gradient(90deg, transparent 0 40%, rgba(var(--sig), .85) 40% 52%, transparent 52%), linear-gradient(90deg, transparent 0 60%, rgba(var(--sig), .65) 60% 72%, transparent 72%), linear-gradient(90deg, transparent 0 80%, rgba(var(--sig), .5) 80% 92%, transparent 92%);background-position:0 100%;background-size:100% 52%,100% 74%,100% 96%,100% 74%,100% 52%}[data-viz=mirror]:after{background-image:linear-gradient(90deg, rgba(var(--sig), .85) 0 12%, transparent 12%), linear-gradient(90deg, transparent 0 20%, rgba(var(--sig), .65) 20% 32%, transparent 32%), linear-gradient(90deg, transparent 0 40%, rgba(var(--sig), .5) 40% 52%, transparent 52%), linear-gradient(90deg, transparent 0 60%, rgba(var(--sig), .4) 60% 72%, transparent 72%), linear-gradient(90deg, transparent 0 80%, rgba(var(--sig), .3) 80% 92%, transparent 92%);background-position:0 100%;background-size:100% 96%,100% 74%,100% 58%,100% 46%,100% 36%}[data-viz=pair]:after{background-image:linear-gradient(90deg, rgba(var(--sig), .7) 0 8%, transparent 8%), linear-gradient(90deg, transparent 0 14%, rgba(var(--sig), .5) 14% 22%, transparent 22%), linear-gradient(90deg, transparent 0 62%, rgba(var(--sig), .5) 62% 70%, transparent 70%), linear-gradient(90deg, transparent 0 76%, rgba(var(--sig), .7) 76% 84%, transparent 84%);background-position:0 100%;background-size:100% 84%,100% 62%,100% 62%,100% 84%}[data-viz=stack]:after{background-image:radial-gradient(circle at 26% 74%, rgba(var(--sig), .55) 0 14%, transparent 15%), radial-gradient(circle at 46% 54%, rgba(var(--sig), .45) 0 14%, transparent 15%), radial-gradient(circle at 66% 34%, rgba(var(--sig), .35) 0 14%, transparent 15%);background-size:100% 100%}[data-viz=wave]:after{background-image:radial-gradient(ellipse 42% 60% at 10% 78%, rgba(var(--sig), .45), transparent 62%), radial-gradient(ellipse 40% 58% at 44% 34%, rgba(var(--sig), .38), transparent 62%), radial-gradient(ellipse 42% 60% at 82% 66%, rgba(var(--sig), .32), transparent 62%);background-size:100% 100%}[data-viz=duet]:after{background-image:radial-gradient(ellipse 38% 46% at 18% 32%, rgba(var(--sig), .45), transparent 64%), radial-gradient(ellipse 38% 46% at 50% 70%, rgba(var(--agent), .34), transparent 64%), radial-gradient(ellipse 38% 46% at 82% 30%, rgba(var(--sig), .38), transparent 64%);background-size:100% 100%}.intro-head .mode-switch{padding:4px}.intro-head .mode-switch .chip{padding:9px 16px;font-size:11px}.intro-actions{border-top:1px solid var(--glass-border);flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:20px;padding-top:18px;display:flex}.intro-note{font-family:var(--font-ui);color:var(--label-dim);max-width:46ch;font-size:12px}@keyframes tile-rise{0%{opacity:0;translate:0 14px}to{opacity:1;translate:0}}@media (width<=1000px){.bento{grid-template-columns:repeat(6,minmax(0,1fr))}.bento-tile{grid-column:span 3}.bento-tile.is-hero,.bento-tile.is-featured{grid-area:span 1/span 6}.bento-tile.is-wide{grid-column:span 6}}@media (width<=640px){.bento{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.bento-tile{grid-column:span 1;padding:13px 14px 15px}.bento-tile.is-hero,.bento-tile.is-featured,.bento-tile.is-wide{grid-column:span 2}.bento-tile.is-hero em,.bento-tile.is-featured em{font-size:24px}.bento-tile em{font-size:14px}.tile-say{font-size:11.5px}.bento-tile.is-hero .tile-say,.bento-tile.is-featured .tile-say{font-size:12.5px}.bento-tile:not(.is-hero):not(.is-featured):not(.is-wide):after{opacity:.28}.intro-lede{font-size:13.5px}}.tile-chips-row{z-index:2;flex-wrap:wrap;gap:6px;margin-top:10px;display:flex;position:relative}.tile-chip{color:#ffe9f8;font-family:var(--font-mono);letter-spacing:.05em;text-transform:lowercase;cursor:pointer;transition:all .15s var(--ease-out);background:#ff4fc11f;border:1px solid #ff4fc166;border-radius:99px;align-items:center;padding:4px 10px;font-size:11px;font-weight:500;display:inline-flex;box-shadow:inset 0 1px #ffffff1f,0 2px 4px #0006}.tile-chip:hover{color:#fff;background:#ff4fc159;border-color:#ff4fc1d9;transform:translateY(-1px);box-shadow:0 0 10px #ff4fc180}.tile-chip:active{transform:translateY(0)}.spotlight-pulse{outline-offset:4px;border-radius:8px;animation:2.4s ease-in-out forwards spotlight-glow;position:relative;outline:2px solid #ff4fc1d9!important;box-shadow:0 0 22px #ff4fc1a6,inset 0 0 12px #ff4fc140!important}@keyframes spotlight-glow{0%{box-shadow:0 0 #ff4fc100}20%,70%{box-shadow:0 0 28px #ff4fc1cc,inset 0 0 14px #ff4fc14d}to{box-shadow:0 0 #ff4fc100;outline-color:#0000!important}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}