:root{font-family:EB Garamond,Georgia,serif;color:#465044;background:#f6f0e5;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #465044;--ink-deep: #29372d;--ink-soft: #73796e;--paper: #fffdf7;--paper-warm: #f6f0e5;--cream: #eee4d1;--mint: #dbe5d3;--mint-deep: #73866f;--coral: #b87973;--peach: #d8aa83;--yellow: #c4a65e;--mauve: #9d8ca4;--lavender: #d8cfde;--sky: #dbe6df;--gold: #ae9250;--blush: #ead0cd;--line: rgba(72, 89, 72, .23);--line-strong: rgba(70, 88, 69, .45);--soft-shadow: 0 15px 38px rgba(67, 61, 48, .08)}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}html{scroll-behavior:smooth}body{min-width:320px;overflow-x:hidden;letter-spacing:.006em}button,input,select{font:inherit}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #5f948b;outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.55}.app-shell{min-height:100vh;display:grid;grid-template-rows:76px 62px minmax(0,1fr);background:radial-gradient(circle at 6% 8%,rgba(255,255,255,.54) 0 1px,transparent 2px) 0 0 / 15px 17px,radial-gradient(circle at 91% 25%,rgba(205,142,115,.09) 0 1px,transparent 1.8px) 0 0 / 21px 19px,linear-gradient(115deg,#f9de9970,#cde2c980 46%,#ddc3ce5e),var(--paper-warm)}.site-header{position:relative;z-index:80;display:flex;align-items:center;justify-content:center;padding:0 28px;border-bottom:1px solid var(--line);background:#fff9dfdb;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.site-header:after{content:"";position:absolute;right:22px;bottom:5px;left:22px;height:2px;background:linear-gradient(90deg,transparent,var(--coral) 11% 24%,transparent 39%,var(--mint-deep) 54% 70%,transparent 87%);opacity:.52}.site-title{display:flex;align-items:baseline;gap:8px;color:var(--ink-deep);text-decoration:none}.site-title span{font:600 clamp(.68rem,1.3vw,.82rem)/1 "DM Mono",monospace;letter-spacing:.1em;text-transform:uppercase}.site-title strong{font:700 clamp(1.35rem,2.5vw,2.05rem)/1 "Fraunces",serif;letter-spacing:-.035em;text-shadow:2px 2px 0 rgba(230,169,115,.28)}.site-title:hover strong{color:#b96f69}.sound-unlock{position:absolute;right:25px;display:flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid var(--line-strong);border-radius:999px;background:#fffae5cc;box-shadow:2px 3px #a383701f;color:#765b65;cursor:pointer;font:600 .66rem DM Mono,monospace}.sound-unlock.is-ready{border-color:#5b928273;background:#d4ebd3d1;color:#467667}.sound-unlock.is-loading{border-color:#c18f5766;background:#f7e1b1d1;color:#886b4e}.sound-unlock.is-loading svg{animation:sound-loading 1.2s ease-in-out infinite alternate}@keyframes sound-loading{to{transform:scaleX(1.22);opacity:.58}}.lab-tabs{position:relative;z-index:70;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:7px 28px 0;border-bottom:1px solid var(--line);background:#fff9dfe6;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.lab-tabs button{position:relative;min-width:0;height:55px;display:flex;justify-content:center;align-items:center;gap:10px;border:0;border-bottom:3px solid transparent;background:transparent;color:#85867d;cursor:pointer}.lab-tabs button:after{content:"";position:absolute;right:0;top:12px;width:1px;height:25px;background:var(--line)}.lab-tabs button:last-child:after{display:none}.lab-tabs button:hover{color:var(--ink-deep)}.lab-tabs button.is-active{border-bottom-color:var(--coral);color:#b86764}.lab-tabs button span{font:500 .67rem DM Mono,monospace}.lab-tabs button strong{font-size:.82rem}.tab-short{display:none}.lab-stage{min-height:0;animation:lab-in .45s ease both}@keyframes lab-in{0%{opacity:0;transform:translateY(5px)}}.lab-loading{min-height:calc(100vh - 138px);display:grid;place-content:center;justify-items:center;gap:17px;color:var(--ink)}.lab-loading strong{font:500 .68rem DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase}.loading-string{position:relative;width:96px;height:30px;border-top:2px solid var(--coral)}.loading-string:after{content:"";position:absolute;top:-10px;left:0;width:100%;height:19px;border-top:3px solid var(--mauve);border-radius:50%;animation:loading-vibrate .45s ease-in-out infinite alternate}@keyframes loading-vibrate{to{transform:scaleY(-1)}}.lab-layout{min-height:calc(100vh - 138px);display:grid;grid-template-columns:minmax(0,1.55fr) minmax(395px,.95fr)}.demo-pane{position:sticky;top:0;min-width:0;height:calc(100vh - 138px);min-height:620px;overflow:hidden;border-right:1px solid var(--line);isolation:isolate}.demo-pane:before{content:"";position:absolute;z-index:-2;top:0;right:0;bottom:0;left:0;background:linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px) 0 0 / 40px 40px,linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px) 0 0 / 40px 40px,radial-gradient(ellipse at 48% 32%,rgba(255,249,222,.84),transparent 58%)}.demo-pane:after{content:"";position:absolute;z-index:200;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.27;background:repeating-radial-gradient(circle at 19% 31%,rgba(112,94,79,.13) 0 .6px,transparent .8px 4px),linear-gradient(105deg,#f5c16c1a,#c1dcc814,#be9eb914);mix-blend-mode:multiply}.demo-pane--string{background:#dbe4c5}.demo-pane--string:before{background:radial-gradient(ellipse at 45% 32%,rgba(255,246,204,.86),transparent 65%),linear-gradient(135deg,#dce8ce,#f1deb1 76%)}.demo-pane--action{background:#ead9bd}.demo-pane--action:before{background:radial-gradient(ellipse at 50% 34%,rgba(255,249,225,.88),transparent 63%),linear-gradient(135deg,#ead7b9,#d6e3cf 70%,#d6c2cb)}.demo-pane--grand{background:#cddfc9}.demo-pane--grand:before{background:radial-gradient(ellipse at 48% 35%,rgba(255,240,193,.69),transparent 58%),linear-gradient(140deg,#c7dfcd,#efe1b2 72%,#d6bfc7)}.demo-pane canvas{width:100%!important;height:100%!important;display:block;cursor:grab}.demo-pane canvas:active{cursor:grabbing}.scene-toolbar{position:absolute;z-index:230;top:16px;right:17px;left:17px;display:flex;justify-content:space-between;pointer-events:none}.scene-badge{min-height:35px;display:flex;align-items:center;gap:7px;padding:0 11px;border:1px solid rgba(87,92,83,.22);border-radius:15px 12px 16px 11px;background:#fff9e1d6;box-shadow:2px 3px #8b69571c;color:#576d69;font:500 .63rem DM Mono,monospace;letter-spacing:.025em;text-transform:uppercase}.icon-button{width:37px;height:37px;display:grid;place-items:center;border:1px solid rgba(87,92,83,.22);border-radius:50%;background:#fff9e1e0;box-shadow:2px 3px #8b69571c;cursor:pointer;pointer-events:auto}.icon-button:hover{color:var(--coral);transform:rotate(-7deg)}.scene-mode{position:absolute;z-index:225;top:17px;left:50%;transform:translate(-50%)}.segmented{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);padding:3px;border:1px solid rgba(100,96,84,.22);border-radius:13px 10px 14px 11px;background:#f0e8cfd1}.segmented button{min-width:0;min-height:31px;padding:5px 10px;border:0;border-radius:10px 8px 11px;background:transparent;color:#747c76;cursor:pointer;font-size:.63rem;font-weight:700;white-space:nowrap}.segmented button:hover{color:var(--ink-deep)}.segmented button.is-active{background:#687f7b;box-shadow:inset 0 0 0 1px #ffffff24;color:#fff9e4}.scene-mode .segmented{min-width:285px;background:#fff9e1de;box-shadow:2px 3px #8b69571c}.scene-mode .segmented button{font:500 .56rem DM Mono,monospace;letter-spacing:.03em;text-transform:uppercase}.lesson-pane{min-width:0;padding:clamp(30px,4vw,54px) clamp(26px,3.8vw,49px) 52px;background:#fff9e2de}.lesson-heading{margin:0 0 29px}.lesson-kicker{color:#b9726b;font:600 .64rem DM Mono,monospace;letter-spacing:.085em;text-transform:uppercase}.lesson-heading h1{max-width:650px;margin:9px 0 12px;color:var(--ink-deep);font:700 clamp(2rem,3.45vw,3.45rem)/.98 "Fraunces",serif;letter-spacing:-.045em;text-wrap:balance}.lesson-heading p{max-width:680px;margin:0;color:#687772;font-size:.88rem;line-height:1.62}.control-group{display:grid;gap:17px;margin:0 0 24px;padding:21px;border:1px solid var(--line);border-radius:22px 17px 25px 18px;background:#fcf6dec7;box-shadow:var(--soft-shadow)}.control-group--hero{border-top:4px solid rgba(215,121,112,.68)}.group-title{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding-bottom:11px;border-bottom:1px dashed rgba(102,110,99,.25)}.group-title span{color:var(--ink-deep);font:700 1rem Fraunces,serif}.group-title small{max-width:265px;color:var(--ink-soft);font:400 .56rem/1.4 DM Mono,monospace;text-align:right}.slider-control{display:grid;gap:8px;min-width:0}.slider-control.is-disabled{opacity:.5}.control-label{display:flex;justify-content:space-between;align-items:baseline;gap:12px;color:#6f7771;font-size:.68rem;font-weight:700}.control-label output{color:var(--ink-deep);font:500 .66rem DM Mono,monospace;text-align:right}.slider-hint{margin-top:-1px;color:#85877d;font-size:.61rem;line-height:1.45}input[type=range]{width:100%;height:20px;margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:5px;background:linear-gradient(90deg,var(--range-accent, var(--coral)) var(--range-progress, 0%),rgba(107,110,99,.16) var(--range-progress, 0%))}input[type=range]::-moz-range-track{height:5px;border-radius:5px;background:#6b6e6329}input[type=range]::-moz-range-progress{height:5px;border-radius:5px;background:var(--range-accent, var(--coral))}input[type=range]::-webkit-slider-thumb{width:18px;height:18px;margin-top:-6.5px;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #fff8dd;border-radius:50%;background:var(--range-accent, var(--coral));box-shadow:0 1px #53423d40,0 0 0 1px #53423d1f}input[type=range]::-moz-range-thumb{width:15px;height:15px;border:2px solid #fff8dd;border-radius:50%;background:var(--range-accent, var(--coral))}.metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0 31px}.metric-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}.metric{min-width:0;min-height:91px;display:flex;flex-direction:column;justify-content:center;gap:5px;padding:13px;border:1px solid rgba(145,99,91,.19);border-radius:16px 12px 18px 13px;background:#f3d0b5}.metric--mint{border-color:#56826f33;background:#d6e7cf}.metric--violet{border-color:#795b8433;background:#dfd0df}.metric--yellow{background:#f2dfa3}.metric span{color:#777970;font:500 .53rem DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase}.metric strong{overflow-wrap:anywhere;color:var(--ink-deep);font:700 clamp(.92rem,1.45vw,1.18rem)/1.16 "Fraunces",serif}.metric small{color:var(--ink-soft);font-size:.58rem}.lesson-section{padding:28px 0;border-top:1px solid var(--line)}.lesson-section h2,.jukebox h2{margin:0 0 13px;color:var(--ink-deep);font:700 1.42rem/1.08 Fraunces,serif;letter-spacing:-.02em}.body-copy{margin:0;color:#677470;font-size:.79rem;line-height:1.68}.body-copy--spaced{margin-top:16px}.body-copy sup{font-size:.62em}.note{display:grid;grid-template-columns:auto 1fr;gap:10px;margin:17px 0 0;padding:14px 15px;border:1px solid rgba(99,142,121,.23);border-radius:17px 13px 20px 14px;background:#d0e5ca9e;color:#4f6d62}.note--peach{border-color:#b5735f3b;background:#f0cba994;color:#775a51}.note svg{margin-top:2px}.note p{margin:0;font-size:.7rem;line-height:1.52}.equation-block{margin:17px 0;padding:20px;border:1px solid rgba(151,115,92,.2);border-radius:20px 14px 22px 15px;background:linear-gradient(135deg,#fae4adcc,#e6dcbf94)}.equation{color:#5a5f61;font:italic 600 1.55rem Fraunces,serif;text-align:center}.equation span{font-size:.8em}.equation-values{margin-top:11px;color:#8a756a;font:500 .58rem DM Mono,monospace;text-align:center}.equation-block p{margin:13px 0 0;color:#746f68;font-size:.65rem;line-height:1.5}.mode-control{display:grid;gap:15px}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer}.switch-row>span{min-width:0;display:grid;gap:2px}.switch-row strong{color:var(--ink-deep);font-size:.7rem}.switch-row small{color:var(--ink-soft);font-size:.58rem;line-height:1.4}.switch-row input{position:absolute;opacity:0;pointer-events:none}.switch-row>i{position:relative;flex:0 0 auto;width:42px;height:23px;border:1px solid rgba(85,96,89,.28);border-radius:999px;background:#d9d6c4;transition:.18s ease}.switch-row>i:after{content:"";position:absolute;top:3px;left:3px;width:15px;height:15px;border-radius:50%;background:#fff9df;box-shadow:0 1px 3px #48423738;transition:.18s ease}.switch-row input:checked+i{background:var(--mint-deep)}.switch-row input:checked+i:after{transform:translate(19px)}.switch-row:focus-within>i{outline:3px solid #5f948b;outline-offset:3px}.play-button,.secondary-button,.release-button{border:1px solid rgba(109,86,78,.3);border-radius:15px 11px 17px 12px;background:#e9b072;box-shadow:3px 4px #a3716521;color:#5f5350;cursor:pointer;font-weight:700}.play-button{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 15px}.play-button--large{min-height:46px}.play-button:hover,.secondary-button:hover,.release-button:hover{transform:translateY(-1px);box-shadow:4px 6px #a3716526}.secondary-button,.release-button{min-height:44px;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 13px;background:#dbe5ce}.release-button{width:100%;background:#dfc9dd}.strike-row{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:16px}.action-buttons{display:grid;grid-template-columns:1.3fr .7fr;gap:10px}.octave-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.octave-buttons button{min-height:58px;display:grid;place-content:center;gap:2px;padding:8px;border:1px dashed rgba(107,94,84,.3);border-radius:13px 10px 15px 11px;background:#f3e8c8ad;cursor:pointer;font-size:.66rem;font-weight:700}.octave-buttons button:hover{border-style:solid;background:#f2dcad}.octave-buttons span{color:var(--ink-soft);font:400 .5rem DM Mono,monospace}.callout-grid{display:grid;gap:9px}.lesson-callout{display:grid;grid-template-columns:35px 1fr;gap:10px;padding:13px 14px;border-left:3px solid var(--peach);border-radius:4px 15px 15px 4px;background:#f2e4bf9e}.lesson-callout:nth-child(2){border-color:var(--mint-deep)}.lesson-callout:nth-child(3){border-color:var(--mauve)}.lesson-callout>span{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#fff9ded6;color:#a56863;font:600 .57rem DM Mono,monospace}.lesson-callout h3{margin:0 0 3px;color:var(--ink-deep);font-size:.72rem}.lesson-callout p{margin:0;color:#717772;font-size:.64rem;line-height:1.48}.flow-chain{display:flex;flex-wrap:wrap;gap:4px;margin:15px 0}.flow-chain span{display:flex;align-items:center;gap:4px;color:#98978c;font:500 .55rem DM Mono,monospace}.flow-chain span.is-active b{border-color:#bf6f6659;background:#efc2a7;color:#7f5552}.flow-chain b{padding:6px 8px;border:1px solid rgba(123,122,111,.15);border-radius:9px;background:#e6e0caa6}.flow-chain i{font-style:normal}.next-lab{display:grid;gap:4px;margin-top:29px;padding:18px 19px;border:1px solid rgba(111,118,105,.22);border-radius:20px 15px 23px 16px;background:linear-gradient(120deg,#d2e5cbc2,#efd6abb8);color:var(--ink-deep);text-decoration:none}.next-lab:hover{border-color:#be6a636e;transform:translateY(-1px)}.next-lab span{color:#a66a67;font:500 .54rem DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase}.next-lab strong{font:700 1rem Fraunces,serif}.string-stage-readout{position:absolute;z-index:220;right:21px;bottom:112px;left:21px;display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:9px;padding:10px 14px;border:1px solid rgba(93,99,90,.18);border-radius:17px 12px 19px 13px;background:#fff9e0db;box-shadow:2px 3px #7f64541a}.string-stage-readout>span{display:grid;gap:2px;text-align:center}.string-stage-readout small{color:#8a887d;font:500 .48rem DM Mono,monospace;letter-spacing:.04em;text-transform:uppercase}.string-stage-readout strong{color:var(--ink-deep);font:700 .86rem Fraunces,serif}.string-stage-readout em{color:#b36f68;font: 500 .52rem DM Mono,monospace}.string-stage-readout>i{color:#bd8b70;font-style:normal}.demo-keyboard{position:absolute;z-index:240;right:0;bottom:0;left:0;border-top:1px solid rgba(93,95,86,.24);background:#fff8ddf2;box-shadow:0 -10px 25px #5f4d4114}.demo-keyboard--compact{height:102px}.demo-keyboard--grand{height:171px}.piano-keyboard-scroll{width:100%;height:136px;overflow-x:auto;overflow-y:hidden;scrollbar-color:rgba(111,137,126,.65) rgba(229,220,195,.8);scrollbar-width:thin;overscroll-behavior-x:contain}.piano-keyboard-scroll.is-compact{height:100%;overflow:hidden}.piano-keyboard{position:relative;min-width:1560px;height:126px;background:#6a6568;-webkit-user-select:none;user-select:none;touch-action:pan-x}.is-compact .piano-keyboard{min-width:100%;height:100%;touch-action:none}.piano-key{position:absolute;top:0;display:block;padding:0;cursor:pointer;transition:transform 65ms ease,background .08s ease,box-shadow .08s ease;transform-origin:top}.piano-key--white{z-index:1;height:100%;border:1px solid #aca38d;border-top:0;border-radius:0 0 5px 5px;background:linear-gradient(92deg,#fffdf0,#f4eccf 78%,#ddd2b7);box-shadow:inset 0 -8px 11px #7e6f551a}.piano-key--white:hover{background:#fff4c8}.piano-key--white.is-active{background:linear-gradient(#f6d28c,#eaa47c);box-shadow:inset 0 -7px 8px #af5e5124,0 0 12px #ebae6499;transform:perspective(260px) rotateX(-4deg)}.piano-key--white.is-held{border-bottom-color:#be6d68}.piano-key--black{z-index:3;height:63%;border:1px solid #4c5153;border-top:0;border-radius:0 0 5px 5px;background:linear-gradient(95deg,#68616e,#3f4f52 72%,#7b6a79);box-shadow:2px 4px 4px #3d37354d}.piano-key--black:hover{background:#7f6e81}.piano-key--black.is-active{border-color:#9a706e;background:linear-gradient(#c7959a,#b46f77);box-shadow:0 0 12px #ce8b7fa6;transform:perspective(220px) rotateX(-6deg)}.piano-key.is-selected:after{content:"";position:absolute;right:22%;bottom:6px;left:22%;height:3px;border-radius:99px;background:var(--mint-deep)}.piano-key--black.is-selected:after{right:18%;bottom:5px;left:18%;background:#efc777}.piano-key span{position:absolute;right:1px;bottom:10px;left:1px;color:#888174;font:500 .45rem DM Mono,monospace;writing-mode:vertical-rl;transform:rotate(180deg)}.is-compact .piano-key span{bottom:5px;font-size:.38rem}.keyboard-help{height:34px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;color:#747a73;font:500 .52rem DM Mono,monospace}kbd{padding:2px 4px;border:1px solid rgba(91,89,82,.25);border-bottom-width:2px;border-radius:4px;background:#fff9e1;color:#6b6265;font:inherit}.keyboard-help b{color:#a46d69;font-weight:500}.action-3d-stage{position:absolute;z-index:2;top:54px;right:0;bottom:153px;left:0;overflow:hidden}.action-3d-stage>[role=application]{min-height:0!important;border-radius:0!important}.action-part-inspector{position:absolute;z-index:224;top:65px;left:17px;width:min(250px,calc(100% - 34px));display:grid;grid-template-columns:1fr auto;gap:8px;padding:11px 11px 12px 13px;border:1px solid rgba(127,93,121,.3);border-left:4px solid var(--mauve);border-radius:15px 11px 17px 12px;background:#faefd6ed;box-shadow:4px 6px #7559691c}.action-part-inspector>span{display:grid;gap:2px}.action-part-inspector small{color:#8a6888;font:500 .44rem DM Mono,monospace;letter-spacing:.07em;text-transform:uppercase}.action-part-inspector strong{color:var(--ink-deep);font:700 .82rem Fraunces,serif}.action-part-inspector p{margin:2px 0 0;color:#707873;font-size:.56rem;line-height:1.4}.action-part-inspector button{width:25px;height:25px;display:grid;place-items:center;padding:0;border:1px solid rgba(101,91,96,.2);border-radius:50%;background:#fffae7c7;cursor:pointer}.action-timeline{position:absolute;z-index:220;right:20px;bottom:114px;left:20px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;padding:8px;border:1px solid rgba(100,98,88,.19);border-radius:16px 12px 18px 13px;background:#fff9e1d6}.action-timeline.is-repeat{grid-template-columns:repeat(3,minmax(0,1fr));border-color:#a76d5b6b;background:#fff6e0f0}.action-timeline span{min-width:0;display:grid;justify-items:center;gap:3px;color:#99958a;font:500 .43rem DM Mono,monospace;text-align:center}.action-timeline i{width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:#e3dcc4;font-style:normal}.action-timeline span.is-active{color:#7c5a58}.action-timeline span.is-active i{background:var(--coral);color:#fff7dc}.pedal-stack{display:grid;gap:9px}.pedal-card{width:100%;display:grid;grid-template-columns:45px 1fr auto;align-items:center;gap:11px;padding:11px 12px;border:1px solid rgba(103,104,94,.22);border-radius:16px 12px 18px 13px;background:#f4e9cba6;cursor:pointer;text-align:left}.pedal-card:hover{background:#eeddb8cc}.pedal-card.is-down{border-color:#b1676461;background:#ecc3a8b8;box-shadow:inset 4px 0 0 var(--coral)}.pedal-card__lever{position:relative;width:39px;height:25px;display:block;transform:perspective(60px) rotateX(-8deg)}.pedal-card__lever:before{content:"";position:absolute;top:8px;left:0;width:25px;height:7px;border-radius:9px 3px 3px 9px;background:#b78b56}.pedal-card__lever i{position:absolute;top:3px;right:0;width:18px;height:18px;border:1px solid #876f55;border-radius:50% 55% 45% 50%;background:linear-gradient(135deg,#f3ce7a,#b98046);transition:transform .15s ease}.pedal-card.is-down .pedal-card__lever i{transform:translateY(4px) rotate(6deg)}.pedal-card>span:nth-child(2){min-width:0;display:grid;gap:2px}.pedal-card small{color:#9a706b;font:500 .5rem DM Mono,monospace;text-transform:uppercase}.pedal-card strong{color:var(--ink-deep);font-size:.7rem}.pedal-card em{color:#7d8078;font: .57rem/1.35 DM Sans,sans-serif}.pedal-card>b{padding:4px 6px;border-radius:8px;background:#fffae2a6;color:#8c8177;font:500 .48rem DM Mono,monospace;text-transform:uppercase}.pedal-card.is-down>b{background:var(--coral);color:#fff8df}.grand-view-strip{position:absolute;z-index:225;right:15px;bottom:181px;left:15px;display:flex;justify-content:center;align-items:center;gap:8px;pointer-events:none}.grand-view-strip .segmented{max-width:590px;background:#fff9e0e0;box-shadow:2px 3px #7f64541a;pointer-events:auto}.grand-view-strip .segmented button{font:500 .51rem DM Mono,monospace;text-transform:uppercase}.grand-view-strip>button{min-height:37px;display:flex;align-items:center;gap:5px;padding:6px 10px;border:1px solid rgba(100,96,84,.22);border-radius:13px;background:#fff9e0e0;box-shadow:2px 3px #7f64541a;cursor:pointer;pointer-events:auto;font:500 .53rem DM Mono,monospace}.grand-view-strip>button.is-active{background:#728f86;color:#fff}.player-roll-stage{position:absolute;z-index:215;top:63px;right:17px;width:min(232px,28%);height:285px;filter:drop-shadow(0 9px 18px rgba(81,70,60,.13))}.model-interaction-guide{position:absolute;z-index:222;top:61px;left:17px;display:flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid rgba(85,113,104,.24);border-radius:13px;background:#daebd1db;box-shadow:2px 3px #7e5b501a;color:#55716a;font:600 .52rem DM Mono,monospace;letter-spacing:.01em;pointer-events:none;text-transform:uppercase}.model-part-card{position:absolute;z-index:223;top:98px;left:17px;width:min(260px,calc(100% - 34px));display:grid;grid-template-columns:1fr auto;gap:9px;padding:12px 12px 13px 14px;border:1px solid rgba(139,94,87,.28);border-left:4px solid var(--coral);border-radius:15px 11px 17px 12px;background:#fff7daed;box-shadow:4px 6px #8461521f;color:var(--ink-deep)}.model-part-card>span{display:grid;gap:3px}.model-part-card small{color:#a36965;font:500 .45rem DM Mono,monospace;letter-spacing:.07em;text-transform:uppercase}.model-part-card strong{font:700 .86rem Fraunces,serif}.model-part-card p{margin:1px 0 0;color:#6f7974;font-size:.57rem;line-height:1.42}.model-part-card button{width:26px;height:26px;display:grid;place-items:center;padding:0;border:1px solid rgba(104,96,87,.2);border-radius:50%;background:#fffbe8cc;cursor:pointer}.grand-pedal-label{width:184px;display:grid;gap:3px;padding:10px 12px 11px;border:1px solid rgba(89,111,101,.3);border-radius:14px 11px 16px 12px;background:#fff9e1f5;box-shadow:4px 6px #77574a24;color:var(--ink-deep);text-align:left}.grand-pedal-label small{color:#9a6e62;font:600 .46rem DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase}.grand-pedal-label strong{font:600 1rem Cormorant Garamond,Georgia,serif;line-height:1}.grand-pedal-label>span{color:#68766f;font:500 .64rem/1.35 EB Garamond,Georgia,serif}.grand-pedal-label b{width:max-content;margin-top:3px;padding:3px 6px;border-radius:7px;background:#e3ecdc;color:#516c62;font:600 .43rem DM Mono,monospace;letter-spacing:.03em;text-transform:uppercase}.grand-pedal-label.is-down{border-color:#a76d5b75;box-shadow:4px 6px #915b4b29}.grand-pedal-label.is-down b{background:#a76d5b;color:#fff8df}.player-roll{height:100%;display:grid;grid-template-rows:1fr 29px;overflow:hidden;border:1px solid rgba(100,91,80,.25);border-radius:18px 13px 20px 14px;background:#fff4cceb}.player-roll__paper{position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(192,145,102,.09) 1px,transparent 1px) 0 0 / 12px 100%,linear-gradient(#f4ddaa,#f9e9bd)}.player-roll__paper>i{position:absolute;z-index:0;top:0;bottom:0;width:1px;background:#746b5d1a}.player-roll__paper>i.is-c{background:#b169623b}.player-roll__paper>span{position:absolute;z-index:2;min-width:3px;border:1px solid color-mix(in srgb,var(--note-color) 76%,#8b6960);border-radius:999px;background:color-mix(in srgb,var(--note-color) 82%,#fff5d4);box-shadow:inset 0 0 0 1px #ffffff3b;transition:filter .06s ease}.player-roll__paper>span.is-playing{z-index:4;filter:brightness(1.18) saturate(1.2);box-shadow:0 0 8px var(--note-color)}.player-roll__playhead{position:absolute;z-index:5;right:0;left:0;height:2px;background:var(--coral);box-shadow:0 0 7px #d66f6873}.player-roll__playhead b{position:absolute;top:-8px;right:5px;padding:2px 4px;border-radius:4px;background:var(--coral);color:#fff8dd;font:500 .38rem DM Mono,monospace}.player-roll__caption{display:flex;align-items:center;justify-content:space-between;padding:0 9px;border-top:1px dashed rgba(110,95,81,.25);color:#826f65;font:500 .44rem DM Mono,monospace;text-transform:uppercase}.jukebox{margin:29px 0;padding:21px;border:1px solid rgba(141,101,90,.23);border-radius:24px 17px 27px 19px;background:linear-gradient(150deg,#f4dbaabf,#e2dac0a3);box-shadow:var(--soft-shadow)}.jukebox-heading>span{display:flex;align-items:center;gap:6px;margin-bottom:7px;color:#aa6c67;font:500 .55rem DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase}.jukebox-heading p{margin:-4px 0 17px;color:#777a72;font-size:.65rem;line-height:1.5}.tune-list{display:grid;gap:5px}.tune-list button{min-height:49px;display:grid;grid-template-columns:27px 1fr auto;align-items:center;gap:8px;padding:7px 9px;border:1px solid transparent;border-radius:13px 9px 14px 10px;background:#fff8da7a;cursor:pointer;text-align:left}.tune-list button:hover{border-color:#69706333}.tune-list button.is-active{border-color:#b1676459;background:#fae4bae0;box-shadow:inset 3px 0 0 var(--coral)}.tune-list button>span:first-child{color:#aa7971;font:500 .5rem DM Mono,monospace}.tune-list button>span:nth-child(2){min-width:0;display:grid;gap:1px}.tune-list strong{overflow:hidden;color:var(--ink-deep);font-size:.64rem;text-overflow:ellipsis;white-space:nowrap}.tune-list small{overflow:hidden;color:#89867b;font-size:.5rem;text-overflow:ellipsis;white-space:nowrap}.tune-list b{color:#9c706a;font:500 .48rem DM Mono,monospace}.tune-list b:after{content:" bpm"}.transport{display:grid;grid-template-columns:auto 32px 32px auto 1fr auto;align-items:center;gap:6px;margin:13px 0 8px}.transport button{min-height:32px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(107,91,81,.24);border-radius:10px;background:#fff8dcd1;cursor:pointer}.transport__play{gap:6px;padding:5px 11px;background:#d78172!important;color:#fff;font-size:.6rem;font-weight:700}.transport__icon.is-active{background:#7d9c8f;color:#fff}.transport>span{color:#827970;font:500 .47rem DM Mono,monospace}.transport input{min-width:40px}.pedal-stack--horizontal{grid-template-columns:repeat(3,minmax(0,1fr))}.pedal-stack--horizontal .pedal-card{min-width:0;grid-template-columns:1fr;justify-items:center;gap:7px;text-align:center}.pedal-stack--horizontal .pedal-card>b{display:none}.pedal-stack--horizontal .pedal-card em{display:block}.callout-grid--path{grid-template-columns:repeat(3,minmax(0,1fr))}.callout-grid--path .lesson-callout{grid-template-columns:1fr;align-content:start}.grand-finale{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;margin:24px 0 0;padding:20px;border:1px solid rgba(100,115,102,.22);border-radius:24px 17px 27px 19px;background:linear-gradient(120deg,#d8e7ce,#efd6ad 55%,#dbc8d8);color:#5d746e}.grand-finale strong{color:var(--ink-deep);font:700 .88rem Fraunces,serif}.grand-finale p{margin:3px 0 0;color:#757c76;font-size:.62rem;line-height:1.4}.site-footer{display:flex;justify-content:center;align-items:center;gap:7px;padding:13px 18px;border-top:1px solid var(--line);background:#fff9e1eb;color:var(--ink-soft);font:500 .53rem DM Mono,monospace}.site-footer a{color:#98706c;text-decoration:none}.site-footer i{font-style:normal}@media(max-width:1180px){.lab-layout{grid-template-columns:minmax(0,1.28fr) minmax(380px,.92fr)}.scene-mode{top:60px}.metric-grid--three{grid-template-columns:1fr 1fr}.metric-grid--three .metric:last-child{grid-column:1 / -1;min-height:72px}.pedal-stack--horizontal{grid-template-columns:1fr}.pedal-stack--horizontal .pedal-card{grid-template-columns:43px 1fr;justify-items:start;text-align:left}.callout-grid--path{grid-template-columns:1fr}.callout-grid--path .lesson-callout{grid-template-columns:35px 1fr}.grand-view-strip .segmented button{padding-inline:7px}}@media(max-width:880px){.lab-layout{display:block}.demo-pane{position:relative;top:auto;width:100%;height:min(76vh,720px);min-height:590px;border-right:0;border-bottom:1px solid var(--line)}.lesson-pane{padding-inline:clamp(22px,7vw,58px)}.lesson-heading h1{font-size:clamp(2.25rem,7vw,3.8rem)}.scene-mode{top:17px}.metric-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}.metric-grid--three .metric:last-child{grid-column:auto;min-height:91px}.pedal-stack--horizontal{grid-template-columns:repeat(3,minmax(0,1fr))}.pedal-stack--horizontal .pedal-card{grid-template-columns:1fr;justify-items:center;text-align:center}.callout-grid--path{grid-template-columns:repeat(3,minmax(0,1fr))}.callout-grid--path .lesson-callout{grid-template-columns:1fr}}@media(max-width:640px){.app-shell{grid-template-rows:64px 58px minmax(0,1fr)}.site-header{justify-content:flex-start;padding:0 14px}.site-title{display:grid;gap:1px}.site-title span{font-size:.52rem}.site-title strong{font-size:1.2rem}.sound-unlock{right:12px;padding:7px 9px}.sound-unlock span{display:none}.lab-tabs{padding:5px 6px 0}.lab-tabs button{height:53px;gap:5px}.lab-tabs button strong{font-size:.68rem}.lab-tabs button span{font-size:.53rem}.tab-long{display:none}.tab-short{display:inline}.demo-pane{height:625px;min-height:625px}.scene-toolbar{top:10px;right:10px;left:10px}.scene-badge{max-width:calc(100% - 48px);min-height:31px;padding-inline:8px;font-size:.51rem}.scene-badge svg{display:none}.icon-button{width:33px;height:33px}.scene-mode{top:49px}.scene-mode .segmented{min-width:245px}.segmented button{padding-inline:6px;font-size:.55rem}.lesson-pane{padding:31px 18px 44px}.lesson-heading{margin-bottom:23px}.lesson-heading h1{margin-top:7px;font-size:2.32rem}.lesson-heading p{font-size:.8rem}.control-group,.jukebox{padding:16px;border-radius:18px 14px 20px 15px}.group-title{display:grid}.group-title small{text-align:left}.strike-row,.action-buttons,.octave-buttons{grid-template-columns:1fr}.octave-buttons button{min-height:47px}.metric-grid,.metric-grid--three{grid-template-columns:1fr 1fr}.metric-grid--three .metric:last-child{grid-column:1 / -1;min-height:70px}.metric{min-height:82px}.string-stage-readout{right:8px;bottom:105px;left:8px;grid-template-columns:1fr 1fr;gap:5px;padding:8px}.string-stage-readout>i{display:none}.string-stage-readout>span:last-child{grid-column:1 / -1}.action-3d-stage{top:83px;right:0;bottom:165px;left:0}.action-part-inspector{top:85px;left:8px;width:min(225px,calc(100% - 16px))}.action-timeline{right:7px;bottom:111px;left:7px;gap:1px;padding:5px}.action-timeline b{display:none}.demo-keyboard--compact{height:100px}.demo-keyboard--grand{height:162px}.grand-view-strip{right:6px;bottom:166px;left:6px;display:grid;gap:5px}.grand-view-strip .segmented{width:100%;max-width:none;overflow-x:auto}.grand-view-strip>button{justify-self:center;min-height:31px}.player-roll-stage{top:88px;right:7px;width:145px;height:225px}.model-interaction-guide{top:49px;left:8px;max-width:calc(100% - 58px);padding:6px 8px;font-size:.43rem}.model-interaction-guide span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.model-part-card{top:82px;left:8px;width:min(225px,calc(100% - 16px))}.keyboard-help{padding-inline:7px;font-size:.42rem}.keyboard-help span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.piano-keyboard{min-width:1330px}.transport{grid-template-columns:auto 31px 31px 1fr}.transport>span{display:none}.transport input{grid-column:1 / -1}.pedal-stack--horizontal,.callout-grid--path{grid-template-columns:1fr}.pedal-stack--horizontal .pedal-card{grid-template-columns:42px 1fr;justify-items:start;text-align:left}.callout-grid--path .lesson-callout{grid-template-columns:35px 1fr}.grand-finale{grid-template-columns:auto 1fr}.grand-finale>svg:last-child{display:none}.site-footer{flex-wrap:wrap;text-align:center}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}.app-shell{position:relative;background:radial-gradient(circle at 7% 12%,rgba(255,255,255,.58),transparent 27%),radial-gradient(circle at 94% 18%,rgba(207,220,195,.34),transparent 31%),linear-gradient(118deg,#f8f3e8,#f2eddf 68%,#f5eadf)}.site-header{padding:0 30px;border-top:3px double rgba(115,134,111,.48);border-bottom:1px solid rgba(49,61,49,.34);background:#fffdf8f7;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.site-header:after{right:30px;bottom:5px;left:30px;height:1px;background:linear-gradient(90deg,transparent,var(--gold) 18%,var(--mint-deep) 50%,var(--gold) 82%,transparent);opacity:.52}.header-folio{position:absolute;left:30px;display:grid;gap:3px;color:#5f6f60;text-transform:uppercase}.header-folio:before{content:"";position:absolute;top:-5px;bottom:-5px;left:-10px;width:2px;border-left:1px solid rgba(174,146,80,.65);border-right:1px solid rgba(174,146,80,.35)}.header-folio span{font:500 .56rem/1 DM Mono,monospace;letter-spacing:.13em}.header-folio i{color:#967e54;font:italic 400 .72rem/1 EB Garamond,serif;letter-spacing:.05em;text-transform:none}.site-title{display:block;color:#2e352e}.site-title__mark{grid-row:1 / 3;width:34px;height:30px;color:#718970}.site-title__mark path,.site-title__mark circle,.folio-flourish path,.folio-flourish circle{stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.site-title__mark circle,.folio-flourish circle{fill:currentColor;stroke:none}.site-title span{align-self:end;margin-bottom:2px;color:#987b51;font:500 .5rem/1 DM Mono,monospace;letter-spacing:.16em}.site-title strong{display:block;color:#28342c;font:500 clamp(1.45rem,2.35vw,2rem)/1 "Cormorant Garamond",Georgia,serif;letter-spacing:.015em;text-shadow:none}.site-title:hover strong{color:#8e615a}.site-links{position:absolute;right:29px;display:flex;align-items:center;gap:13px;font:500 .55rem DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase}.site-links a{color:#855f55;text-decoration:none;border-bottom:1px solid rgba(133,95,85,.35)}.site-links a:hover{color:#3f493f;border-color:currentColor}.sound-unlock{right:29px;width:40px;min-height:36px;justify-content:center;padding:8px;border:1px solid rgba(45,52,44,.48);border-radius:1px;background:#fffdf8;box-shadow:none;color:#3f493f;font:500 .58rem DM Mono,monospace}.sound-unlock:after{display:none}.sound-unlock:hover{background:#edf2e6}.sound-unlock.is-ready{border-color:#718970;background:#dfe9d7;color:#465c49}.sound-unlock.is-loading{border-color:#b69d68;background:#f5ead1;color:#725e3f}.lab-tabs{padding:0 30px;border-bottom:3px double rgba(77,95,77,.38);background:#faf7eff7;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.lab-tabs button{height:61px;gap:11px;border-right:1px solid rgba(73,88,72,.17);border-bottom:0;color:#73796e;font-family:EB Garamond,Georgia,serif;letter-spacing:.035em}.lab-tabs button:first-child{border-left:1px solid rgba(73,88,72,.17)}.lab-tabs button:after{display:none}.lab-tabs button:hover{background:#dee8d580;color:#2f3a31}.lab-tabs button.is-active{border-bottom:0;background:#dfe8d7;box-shadow:inset 0 -3px #718970,inset 0 3px #ffffff6b;color:#354839}.lab-tabs button span{color:#a76d5b;font:500 .58rem DM Mono,monospace;letter-spacing:.08em}.lab-tabs button strong{font:500 .86rem EB Garamond,Georgia,serif;text-transform:uppercase;letter-spacing:.1em}.lab-stage{position:relative}.folio-flourish{position:absolute;z-index:12;top:18px;right:23px;width:92px;height:68px;color:#728872;opacity:.24;pointer-events:none;transform:rotate(9deg)}.lab-loading strong{color:#536355;font-family:DM Mono,monospace}.loading-string{border-color:#718970}.loading-string:after{border-color:#a76d5b}.lab-layout{background:#fffdf8}.demo-pane{border-right:4px double rgba(73,90,73,.43);background:#dfe7d7}.demo-pane:before{background:radial-gradient(ellipse at 50% 39%,rgba(255,253,243,.88),transparent 64%),linear-gradient(135deg,#c5d8ad8c,#efdfbd6b)}.demo-pane:after{top:12px;right:12px;bottom:12px;left:12px;border:1px solid rgba(91,111,90,.34);background:none;box-shadow:inset 0 0 0 4px #fffdf72e;mix-blend-mode:normal;opacity:1}.demo-pane--string{background:#dfe8d7}.demo-pane--string:before{background:radial-gradient(ellipse at 48% 36%,rgba(255,252,238,.91),transparent 65%),linear-gradient(135deg,#dce7d3,#efe3c7)}.demo-pane--action{background:#e9ded0}.demo-pane--action:before{background:radial-gradient(ellipse at 50% 34%,rgba(255,253,242,.92),transparent 64%),linear-gradient(135deg,#eadfd0,#dce5d6 74%,#e8d4d2)}.demo-pane--grand{background:#d9e5d2}.demo-pane--grand:before{background:radial-gradient(ellipse at 47% 34%,rgba(255,250,229,.83),transparent 61%),linear-gradient(140deg,#d7e5d7,#eee3c3 72%,#e5d2d5)}.lesson-pane{position:relative;padding-top:clamp(40px,4.8vw,66px);background:radial-gradient(circle at 100% 0,rgba(214,226,202,.28),transparent 25%),radial-gradient(circle at 4% 72%,rgba(234,208,205,.13),transparent 32%),#fffdf8}.lesson-pane:before{content:"";position:absolute;top:24px;right:25px;width:54px;height:54px;border-top:1px solid rgba(174,146,80,.38);border-right:1px solid rgba(174,146,80,.38);pointer-events:none}.lesson-heading{margin-bottom:32px;padding:0 72px 29px 0;border-bottom:3px double rgba(83,102,83,.36)}.lesson-kicker{color:#9d6254;font:500 .58rem DM Mono,monospace;letter-spacing:.14em}.lesson-heading h1{margin:11px 0 14px;color:#2e352e;font:500 clamp(2.7rem,4.1vw,4.35rem)/.9 "Cormorant Garamond",Georgia,serif;letter-spacing:-.035em}.lesson-heading p{max-width:610px;color:#60695f;font:italic 400 1rem/1.55 EB Garamond,Georgia,serif}.control-group,.jukebox{border:1px solid rgba(75,93,75,.38);border-radius:4px;background:#fffdf7eb;box-shadow:inset 0 0 0 4px #7189700e,0 13px 28px #3641310e}.control-group--hero{border-top:1px solid rgba(75,93,75,.38);box-shadow:inset 0 4px #dfe8d7,inset 0 0 0 4px #71897013}.group-title{border-bottom:1px solid rgba(76,92,75,.27)}.group-title span{color:#303b32;font:600 1.25rem Cormorant Garamond,Georgia,serif;letter-spacing:.01em}.group-title small,.control-label output,.metric span,.equation-values,.slider-hint,.flow-chain span,.keyboard-help,.player-roll__caption,.transport>span{font-family:DM Mono,monospace}.group-title small{color:#7d7c70}.control-label{color:#4e5a4e;font:600 .7rem DM Sans,system-ui,sans-serif}.control-label output{color:#334139}.slider-hint{color:#7f8278}input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:0;background:linear-gradient(90deg,var(--range-accent, #a76d5b) var(--range-progress, 0%),rgba(84,97,82,.18) var(--range-progress, 0%))}input[type=range]::-moz-range-track{height:3px;border-radius:0}input[type=range]::-moz-range-progress{height:3px;border-radius:0}input[type=range]::-webkit-slider-thumb{width:17px;height:17px;margin-top:-7px;border:2px solid var(--range-accent, #a76d5b);background:#fffdf8;box-shadow:0 0 0 2px #fffdf8e6}input[type=range]::-moz-range-thumb{border-color:var(--range-accent, #a76d5b);background:#fffdf8}.metric-grid{gap:8px}.metric{min-height:94px;border:1px solid rgba(155,104,87,.24);border-radius:0;background:#f3e0d1}.metric--mint{border-color:#53705540;background:#e1ebd9}.metric--violet{border-color:#75627d38;background:#e7dfe9}.metric--yellow{background:#f2e6c8}.metric strong{color:#303a31;font:600 clamp(1.08rem,1.6vw,1.32rem)/1.08 "Cormorant Garamond",Georgia,serif}.lesson-section{border-top:3px double rgba(80,98,80,.28)}.lesson-section h2,.jukebox h2{color:#303830;font:600 1.72rem/1 Cormorant Garamond,Georgia,serif;letter-spacing:-.01em}.body-copy{color:#59645a;font:400 .91rem/1.72 EB Garamond,Georgia,serif}.note,.equation-block,.lesson-callout,.next-lab,.grand-finale{border-radius:0;box-shadow:none}.note{border-color:#53705547;background:#edf3e7;color:#4d6250}.note--peach{border-color:#a76d5b45;background:#f4e5da;color:#6f554d}.note p{font:400 .8rem/1.55 EB Garamond,Georgia,serif}.equation-block{border-color:#ae92505c;background:#f8f0dc;box-shadow:inset 0 0 0 4px #ae925012}.equation{color:#414c42;font:italic 500 1.8rem Cormorant Garamond,Georgia,serif}.equation-block p{font:400 .76rem/1.55 EB Garamond,Georgia,serif}.play-button,.secondary-button,.release-button{border:1px solid #657a67;border-radius:1px;background:#718970;box-shadow:none;color:#fffdf8;font:500 .6rem DM Mono,monospace;letter-spacing:.055em;text-transform:uppercase}.play-button:hover,.secondary-button:hover,.release-button:hover{border-color:#405544;background:#5f765f;box-shadow:none;transform:none}.secondary-button,.release-button{border-color:#495b4961;background:#eef3e8;color:#435346}.release-button{background:#eee5ef}.octave-buttons button{border:1px solid rgba(76,92,76,.31);border-radius:0;background:#faf6eb;font-family:DM Sans,system-ui,sans-serif}.octave-buttons button:hover{background:#e8efdf}.switch-row strong,.pedal-card strong,.tune-list strong,.lesson-callout h3{font-family:DM Sans,system-ui,sans-serif}.switch-row>i{border-radius:1px;background:#ddd9ce}.switch-row>i:after{border-radius:0;background:#fffdf8}.switch-row input:checked+i{background:#718970}.lesson-callout{border:1px solid rgba(85,99,82,.2);border-left:2px solid #a76d5b;background:#faf4e8}.lesson-callout:nth-child(2){border-left-color:#718970}.lesson-callout:nth-child(3){border-left-color:#9d8ca4}.lesson-callout>span{border:1px solid rgba(167,109,91,.28);border-radius:50%;background:#fffdf8}.lesson-callout p{font:400 .73rem/1.55 EB Garamond,Georgia,serif}.flow-chain b{border-radius:0;background:#f1eee3}.flow-chain span.is-active b{border-color:#a76d5b59;background:#ead0c7}.next-lab{border-color:#4d604d5c;background:linear-gradient(90deg,#e4ecd9,#faf4e6);box-shadow:inset 0 0 0 4px #fffdf870}.next-lab strong{font:600 1.22rem Cormorant Garamond,Georgia,serif}.scene-badge,.scene-mode .segmented,.grand-view-strip .segmented,.grand-view-strip>button,.icon-button,.string-stage-readout,.action-part-inspector,.action-timeline,.model-interaction-guide,.model-part-card,.player-roll{border-color:#4152415c;border-radius:1px;background-color:#fffdf7e8;box-shadow:none}.scene-badge{color:#4d6250;letter-spacing:.075em}.icon-button{border-radius:50%}.icon-button:hover{background:#e6edde;color:#8f5d53;transform:none}.segmented{border-radius:1px;background:#f1eee1e6}.segmented button{border-radius:0}.segmented button.is-active{background:#677d69;color:#fffdf8}.string-stage-readout{box-shadow:inset 0 0 0 3px #7189700f}.string-stage-readout strong{font:600 1rem Cormorant Garamond,Georgia,serif}.action-part-inspector,.model-part-card{border-left:3px solid #a76d5b;background:#fffdf7f2}.action-part-inspector{border-left-color:#9d8ca4}.action-part-inspector strong,.model-part-card strong{font:600 1.02rem Cormorant Garamond,Georgia,serif}.action-part-inspector p,.model-part-card p{font-family:EB Garamond,Georgia,serif;font-size:.66rem}.action-timeline i{border-radius:50%;background:#e5e1d4}.action-timeline span.is-active i{background:#a76d5b}.model-interaction-guide{background:#e0ebd7f0}.demo-keyboard{border-top:3px double rgba(71,85,69,.42);background:#fffdf7f7;box-shadow:none}.piano-keyboard{background:#4a4b47}.piano-key--white{border-color:#a9a394;background:linear-gradient(90deg,#fffefa,#f3eddd 84%,#d8d0c1)}.piano-key--black{border-color:#262b28;background:linear-gradient(95deg,#454b46,#292f2c 72%,#55534f)}.piano-key--white.is-active{background:linear-gradient(#efdfbd,#dcb6a1)}.piano-key--black.is-active{background:linear-gradient(#9a817f,#765f61)}.pedal-card{border-radius:0;background:#f7f1e5}.pedal-card:hover{background:#eef2e7}.pedal-card.is-down{border-color:#a76d5b75;background:#f0ddd3;box-shadow:inset 3px 0 #a76d5b}.pedal-card em{font-family:EB Garamond,Georgia,serif}.pedal-card.is-down>b{background:#a76d5b}.jukebox{background:#f7f0de;box-shadow:inset 0 0 0 4px #ae925014}.jukebox-heading>span{color:#9d6254}.jukebox-heading p{color:#6f746b;font:italic 400 .78rem/1.5 EB Garamond,Georgia,serif}.tune-list{gap:4px}.tune-list button{border:1px solid rgba(77,91,75,.16);border-radius:0;background:#fffdf7ad}.tune-list button:hover{border-color:#4b5e4c59;background:#fffdf8}.tune-list button.is-active{border-color:#a76d5b6b;background:#f1dfd5;box-shadow:inset 3px 0 #a76d5b}.transport button{border-radius:0;background:#fffdf8}.transport__play{background:#718970!important}.transport__icon.is-active{background:#a76d5b}.player-roll{background:#f8edccf2}.player-roll__paper{background:linear-gradient(90deg,rgba(174,146,80,.12) 1px,transparent 1px) 0 0 / 12px 100%,linear-gradient(#f4e4ba,#fbf0d0)}.player-roll__playhead{background:#a76d5b;box-shadow:none}.player-roll__playhead b{border-radius:0;background:#a76d5b}.grand-finale{border-color:#4c5e4c59;background:linear-gradient(90deg,#e0ead7,#f5e8d1 56%,#eadde9);box-shadow:inset 0 0 0 4px #fffdf866}.grand-finale strong{font:600 1.08rem Cormorant Garamond,Georgia,serif}.grand-finale p{font:400 .72rem/1.45 EB Garamond,Georgia,serif}.site-footer{border-top:3px double rgba(74,91,74,.38);background:#faf6ed;color:#74786e;font:500 .5rem DM Mono,monospace;letter-spacing:.025em}.site-footer a{color:#855f55;border-bottom:1px solid rgba(133,95,85,.35)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-color:#718970}@media(max-width:880px){.folio-flourish{top:calc(min(76vh,720px) + 22px)}.demo-pane{border-right:0;border-bottom:4px double rgba(73,90,73,.43)}.lesson-heading{max-width:720px}}@media(max-width:720px){.header-folio{display:none}}@media(max-width:640px){.site-header{justify-content:center;padding-inline:13px}.site-header:after{right:13px;left:13px}.site-title{display:block}.site-title__mark{width:27px;height:26px}.site-title strong{font-size:1.08rem}.site-links{right:12px;gap:8px;font-size:.45rem;letter-spacing:.035em}.sound-unlock{right:12px;min-height:34px;padding:6px 8px}.sound-unlock:after{display:none}.lab-tabs{padding:0 6px}.lab-tabs button{height:58px;gap:6px}.lab-tabs button strong{font-size:.64rem;letter-spacing:.07em}.lab-tabs button span{font-size:.48rem}.folio-flourish{top:644px;right:14px;width:65px;height:48px;opacity:.17}.lesson-pane{padding:38px 18px 48px}.lesson-pane:before{top:16px;right:16px;width:38px;height:38px}.lesson-heading{padding:0 40px 24px 0}.lesson-heading h1{font-size:2.8rem}.lesson-heading p{font-size:.94rem}.control-group,.jukebox,.scene-badge,.action-part-inspector,.action-timeline,.model-interaction-guide,.model-part-card,.string-stage-readout{border-radius:1px}}
