.theory-shell{box-sizing:border-box;max-width:1000px;min-height:100dvh;font-family:var(--font);color:#202020;background:#fff;margin:0 auto;padding:88px 40px 40px;font-size:16px;line-height:1.55}.theory-shell *{box-sizing:border-box}.theory-shell button,.theory-shell a{font:inherit;-webkit-tap-highlight-color:transparent}.theory-shell a{color:inherit;text-decoration:none}.theory-shell button{cursor:pointer}.theory-shell button:disabled{opacity:.3;cursor:default}.theory-shell button:focus-visible{outline-offset:4px;outline:2px solid #66859a}.theory-shell a:focus-visible{outline-offset:4px;outline:2px solid #66859a}.theory-staff [tabindex]:focus-visible{outline-offset:4px;outline:2px solid #66859a}.theory-back{align-items:center;min-height:44px;display:inline-flex;color:#666!important;font-size:14px!important}.theory-shell h1{letter-spacing:-.025em;margin:28px 0 12px;font-size:28px;font-weight:600;line-height:1.25}.theory-shell p{color:#555;margin:0}.theory-explanation{max-width:760px;min-height:50px}.theory-home{max-width:1000px}.theory-course{border:1px solid #e4e4e4;border-radius:12px;margin-top:38px;display:block;overflow:hidden}.theory-course>svg{color:#171717;background:#fbfbfb;width:100%;height:280px;display:block}.theory-course>div{justify-content:space-between;align-items:center;gap:20px;padding:22px 26px;display:flex}.theory-course h2{margin:0 0 5px;font-size:18px;font-weight:550}.theory-course p{font-size:14px}.theory-course>div>span{white-space:nowrap;font-size:14px}.theory-course:hover{border-color:#aaa}.theory-paper{background:#fff;min-height:355px;margin-top:18px}.theory-staff{color:#171717;-webkit-user-select:none;user-select:none;width:100%;height:auto;max-height:345px;display:block;overflow:visible}.theory-staff.is-editable{touch-action:none;cursor:crosshair}.theory-staff-line{stroke:#333;stroke-width:1.1px}.theory-staff-line.is-lit{stroke:#53758b;stroke-width:2.2px}.theory-space{fill:#0000;transition:fill .15s}.theory-space.is-lit{fill:#e9eef1}.theory-line-label{font:14px var(--font);fill:#888}.theory-line-label.is-lit{fill:#314f64}.theory-position-dot{fill:#53758b}.theory-position-label{font:14px var(--font);fill:#53758b}.theory-staff-target{cursor:pointer}.theory-staff-target:focus-visible rect{stroke:#66859a;stroke-width:2px}.theory-clef{fill:#171717}.theory-quarter-note{fill:#171717;color:#171717}.theory-note{transition:transform .12s ease-out}.theory-note-halo{fill:#7896a8;opacity:0;transition:opacity .1s}.theory-note.is-selected .theory-note-halo{opacity:.12}.theory-note.is-playing .theory-note-halo{opacity:.25}.theory-ledger{stroke:#171717;stroke-width:1.5px}.theory-pitch-label{font:15px var(--font);fill:#333}.theory-solfege-label{font:15px var(--font);fill:#777}.theory-empty line{stroke:#d2d2d2;stroke-dasharray:2 7}.theory-empty.is-selected line{stroke:#6a8393}.theory-empty text{text-anchor:middle;fill:#888;font:14px var(--font)}.theory-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;min-height:50px;margin-top:8px;display:flex}.theory-controls button,.theory-footer button,.theory-footer a,.theory-tracing button{color:#444;background:0 0;border:0;border-radius:8px;min-height:44px;padding:8px 15px;font-size:14px}.theory-controls button:hover,.theory-footer button:hover,.theory-tracing button:hover{background:#f2f2f2}.theory-pitch-controls{border:1px solid #e1e1e1;border-radius:8px;display:flex}.theory-pitch-controls button{min-width:44px;font-size:18px}.theory-alphabet{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.theory-alphabet button{color:#222;background:0 0;border:1px solid #0000;border-radius:8px;gap:3px;min-width:61px;min-height:60px;padding:8px 14px;font-size:16px;display:grid}.theory-alphabet button>span+span{color:#777}.theory-alphabet [aria-pressed=true]{background:#f5f5f5;border-color:#d5d5d5}.theory-note-text{text-align:center;font-size:14px;margin:12px 0!important}.theory-feedback{color:#555;min-height:46px;padding:12px 0;font-size:14px}.theory-footer{border-top:1px solid #e8e8e8;justify-content:space-between;align-items:center;gap:20px;margin-top:12px;padding-top:16px;display:flex}.theory-footer>span{color:#888;font-size:14px}.theory-footer button:last-child,.theory-footer>a:last-child{text-align:center;background:#f2f2f2;min-width:90px}.theory-tracing>svg{touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair;width:100%;max-height:345px;display:block}.theory-tracing .theory-explore-controls{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.theory-caption{font:14px var(--font);fill:#666}.theory-tracing .theory-instruction{text-align:center;margin:12px 0;font-size:14px}.theory-trace-demo{stroke-dasharray:1;stroke-dashoffset:0;animation:3s ease-in-out both theory-trace}@keyframes theory-trace{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@media (max-width:900px){.theory-shell{padding:76px 26px 32px}}@media (max-width:650px){.theory-shell{padding:68px 18px 30px}.theory-shell h1{margin-top:20px;font-size:25px}.theory-explanation{min-height:70px}.theory-paper{min-height:300px;margin-top:6px}.theory-staff{min-height:220px}.theory-course>svg{height:200px}.theory-course>div{gap:12px;padding:18px}.theory-course h2{font-size:17px}.theory-alphabet{gap:2px}.theory-alphabet button{min-width:36px;padding:8px;font-size:14px}.theory-controls{gap:6px}.theory-controls button{padding:8px 12px}.theory-tracing>svg{min-height:220px}}@media (prefers-reduced-motion:reduce){.theory-shell *{transition:none!important;animation:none!important}}.theory-lesson{flex-direction:column;height:100dvh;min-height:700px;padding-bottom:24px;display:flex}.theory-lesson>.theory-back{flex-shrink:0;align-self:flex-start}.theory-lesson>h1{flex-shrink:0;margin:14px 0 6px;font-size:24px}.theory-lesson .theory-paper{flex-shrink:0;min-height:0;margin-top:0}.theory-lesson .theory-staff,.theory-lesson .theory-tracing>svg{height:clamp(235px,34vh,330px);min-height:0}.theory-lesson .theory-controls{min-height:46px;margin-top:0}.theory-lesson .theory-feedback{min-height:28px;padding:4px 0;font-size:14px}.theory-story{min-height:150px;padding:0 0 var(--story-tail,140px);overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d2d2d2 transparent;border-top:1px solid #e7e7e7;flex:1;margin:16px 0 0;list-style:none;position:relative;overflow-y:auto}.theory-story li{color:#898989;border-left:2px solid #0000;padding:4px 16px;transition:color .2s}.theory-story li.is-current{color:#222;border-left-color:#333}.theory-story button{text-align:left;width:100%;color:inherit;background:0 0;border:0;min-height:64px;padding:12px 0;font-size:16px;line-height:1.7;display:block}.theory-story li p{color:inherit;margin:0 0 15px;font-size:14px}.theory-practice-prompt{text-align:center;font-size:15px;margin:0 0 8px!important}.theory-lesson .theory-alphabet{min-height:46px}.theory-lesson .theory-alphabet button{min-height:44px;padding:4px 12px}.theory-lesson:has(.theory-alphabet) .theory-controls:empty{display:none}.theory-tracing .theory-instruction{display:none}@media (max-height:850px) and (min-width:651px){.theory-lesson{min-height:650px;padding-top:65px}.theory-lesson .theory-staff,.theory-lesson .theory-tracing>svg{height:250px}.theory-lesson>.theory-back{min-height:36px}.theory-lesson>h1{margin-top:8px}}@media (max-width:650px){.theory-lesson{min-height:720px}.theory-lesson .theory-staff,.theory-lesson .theory-tracing>svg{height:220px}.theory-story button{font-size:15px}}.theory-activity{text-align:center;border-radius:12px;min-height:90px;padding:16px 20px 8px;transition:background .2s}.theory-activity>p{color:#222;font-size:21px;line-height:1.4}.theory-activity>div{color:#666;min-height:26px;margin-top:6px;font-size:15px}.theory-activity.is-correct{background:#edf8ef;animation:.35s ease-out theory-confirm}.theory-activity.is-correct>div{color:#23703c}.theory-activity.is-incorrect>div{color:#a34132}@keyframes theory-confirm{0%{transform:scale(.985)}to{transform:scale(1)}}.theory-line-label{animation:.5s both theory-count}@keyframes theory-count{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.theory-story{flex:0 30vh;min-height:150px;margin-top:auto}.sequence-staff{touch-action:none;width:100%;height:clamp(220px,32vh,350px);display:block;overflow:visible}.sequence-line{stroke:#333;stroke-width:1.1px}.sequence-line.is-anchor{stroke:#53758b;stroke-width:2px}.sequence-number,.sequence-spaces,.sequence-clef,.sequence-g-anchor,.sequence-note,.sequence-note-name{opacity:0;pointer-events:none;transition:opacity .5s,transform .65s}.sequence-note{cursor:grab;touch-action:none;transition:opacity .5s,transform .12s ease-out}.sequence-note:active{cursor:grabbing}.sequence-note.is-visible{pointer-events:auto}.sequence-note:focus-visible{outline:none}.sequence-note.is-ghost{pointer-events:none}.sequence-note.is-ghost .theory-quarter-note{opacity:.18}.sequence-number.is-visible,.sequence-spaces.is-visible,.sequence-clef.is-visible,.sequence-g-anchor.is-visible,.sequence-note.is-visible,.sequence-note-name.is-visible{opacity:1}.sequence-hit{fill:#7896a8;fill-opacity:0}.sequence-note.is-playing .sequence-hit{fill-opacity:.23}.sequence-ledger{stroke:#171717;stroke-width:1.5px;stroke-dasharray:48;transition:stroke-dashoffset .65s}.sequence-ledger.is-hidden,.sequence-hidden-head{opacity:0}.sequence-note-name{text-anchor:middle;font:17px var(--font);fill:#333}.sequence-note-name tspan{fill:#777;font-size:15px}.sequence-g-anchor circle{fill:none;stroke:#53758b}.sequence-g-anchor line{stroke:#53758b}.sequence-g-anchor text,.sequence-question{fill:#53758b;font:18px var(--font);text-anchor:middle}.sequence-keyboard{display:none}.sequence-keyboard.is-visible{max-width:420px;margin:0 auto 6px;display:block}.sequence-keyboard svg{width:100%;display:block}.sequence-keyboard rect{stroke:#777;stroke-width:.8px;cursor:pointer}.sequence-keyboard .white-key{fill:#fff}.sequence-keyboard .black-key{fill:#222}.sequence-keyboard .is-key-active{fill:#9db6c6}.sequence-keyboard text{text-anchor:middle;font:13px var(--font);pointer-events:none;fill:#555}.sequence-keyboard [role=button]:focus-visible{outline:2px solid #53758b}@media (max-height:850px){.theory-activity{min-height:76px;padding-top:8px}.sequence-staff{height:220px}.theory-activity>p{font-size:19px}.theory-lesson{min-height:740px}}@media (max-width:650px){.theory-activity{padding-left:0;padding-right:0}.theory-activity>p{font-size:18px}.sequence-staff{height:220px}.theory-story li.is-current button{font-size:17px}.theory-lesson{min-height:800px}.theory-controls{gap:2px}}.theory-timeline{border-bottom:1px solid #eee;flex-shrink:0;gap:18px;margin:6px 0 14px;display:flex;overflow-x:auto}.theory-timeline button{white-space:nowrap;color:#777;background:0 0;border:0;border-bottom:2px solid #0000;min-height:44px;padding:8px 0;font-size:14px}.theory-timeline button[aria-current]{color:#222;border-bottom-color:#222}.theory-scene-copy{text-align:center;max-width:740px;font-size:18px;line-height:1.5;color:#333!important;margin:8px auto 0!important}.theory-activity{min-height:70px;padding-top:10px}.theory-transition{text-align:right;margin:8px 0}.theory-transition button{color:#444;background:0 0;border:0;min-height:44px;padding:8px 12px;font-size:15px}.theory-transition button:hover{background:#f5f5f5;border-radius:8px}.theory-story{flex-basis:22vh;min-height:110px;padding-bottom:20px!important}.theory-story button{min-height:56px;font-size:14px}.theory-story li.is-current button{font-size:15px}.theory-lesson .theory-paper{min-height:0}.theory-staff-line.is-lit{stroke:#bb352e}.theory-line-label.is-lit,.theory-position-label,.theory-position-dot,.theory-tracing .theory-pitch-label{fill:#bb352e}@media (max-height:850px){.theory-lesson{min-height:860px}.theory-scene-copy{font-size:17px}.theory-lesson .theory-staff,.theory-lesson .theory-tracing>svg,.sequence-staff{height:220px}}@media (max-width:650px){.theory-timeline{gap:14px}.theory-scene-copy{font-size:16px}.theory-lesson{min-height:960px}}.theory-lesson .theory-paper{flex:1 0 auto}.theory-story{flex:20vh;max-height:24vh}.theory-transition{margin-bottom:10px}.theory-scene-copy{font-size:17px}.theory-lesson{grid-template-rows:auto auto minmax(0,1fr) 28px clamp(170px,24vh,240px);gap:0;height:100dvh;min-height:740px;padding-bottom:18px;display:grid}.theory-lesson .theory-paper{overscroll-behavior:contain;scrollbar-width:thin;min-height:0;overflow-y:auto}.theory-story{overflow-anchor:none;flex:none;height:100%;min-height:0;max-height:none;margin:0;scroll-padding:0;-webkit-mask-image:linear-gradient(#0000,#000 12% 88%,#0000);mask-image:linear-gradient(#0000,#000 12% 88%,#0000);padding:var(--transcript-pad,70px) 0!important}.theory-story li{color:#999;border:0;padding:0 18px;transition:color .3s}.theory-story li.is-current{color:#222;border:0}.theory-story button,.theory-story li.is-current button{transform-origin:0;min-height:44px;padding:9px 0;font-size:15px;line-height:1.4;transition:transform .35s,color .35s;transform:scale(.9)}.theory-story li.is-current button{font-weight:500;transform:scale(1)}@media (min-width:651px){.theory-story button,.theory-story li.is-current button{font-size:17px}}@media (max-width:650px){.theory-lesson{grid-template-rows:auto auto minmax(0,1fr) 28px 180px;min-height:740px}}.theory-lesson>.theory-feedback{border-bottom:1px solid #e7e7e7}.theory-story{border-top:0}.theory-controls .theory-check{background:#f3f3f3;order:10;margin-left:auto}.theory-controls{justify-content:flex-start}.theory-controls .theory-check:only-child{margin-left:auto}.theory-lesson .theory-paper{flex-direction:column;display:flex}.theory-paper>.theory-scene-copy{order:2;font-size:16px;margin:8px auto!important}.theory-paper>.theory-controls{order:3}.theory-paper>.theory-transition{order:4;margin-top:auto}.theory-activity.is-guide{order:1;min-height:44px;padding:4px 12px}.theory-activity.is-guide>div:empty{display:none}.theory-activity.is-challenge{background:#fcf8ef;border:1px solid #e9dfcb;align-self:center;max-width:680px;margin:4px 0 12px;padding:10px 18px;position:relative}.theory-activity.is-challenge:before{content:"🍪";position:absolute;top:12px;left:-32px}.theory-activity.is-correct{background:#edf8ef}.theory-activity.is-incorrect{background:#fff0ed}.theory-paper>.theory-staff,.theory-paper>.sequence-figure,.theory-paper>.theory-tracing{flex-shrink:0}.theory-activity>p{font-size:16px}.theory-lesson .theory-staff,.theory-lesson .theory-tracing>svg{height:clamp(180px,26vh,260px)}.theory-activity.is-guide{min-height:36px}.theory-activity.is-guide>div{min-height:0}.theory-transition{z-index:1;background:#fff;flex-shrink:0;position:sticky;bottom:0}.theory-lesson:has(.sequence-keyboard.is-visible) .sequence-staff{height:200px}.sequence-keyboard.is-visible{max-width:370px}.theory-paper>.theory-scene-copy{order:-2;margin:8px auto 14px!important}.theory-activity.is-challenge{order:1}.theory-activity.is-challenge:before{content:none}.theory-transition.is-ready button{background:#f7edce;border-radius:8px;animation:1.3s ease-in-out 3 theory-next-cue}@keyframes theory-next-cue{50%{background:#f1dfa4;box-shadow:0 0 0 5px #e8cb7638}}.staff-build-line{transform-origin:0;animation:.65s both staff-line-arrive}@keyframes staff-line-arrive{0%{opacity:0;transform:scaleX(.08)}to{opacity:1;transform:scaleX(1)}}.staff-build-space{animation:1.4s both staff-space-arrive}@keyframes staff-space-arrive{0%{fill:#0000}30%,75%{fill:#eec8c5}to{fill:#f5e7e5}}.theory-staff-target{animation:.4s both theory-count}.theory-line-label{fill:#bb352e}.ledger-slider{color:#666;align-items:center;gap:14px;max-width:560px;margin:0 auto;font-size:14px;display:flex}.ledger-slider input{accent-color:#8c3930;width:100%;min-height:44px}.ledger-explorer .sequence-staff{overflow:hidden}.ledger-explorer .sequence-note{transition:transform .45s,opacity .3s}.sequence-note.is-visible{animation:.7s both theory-note-arrive}@keyframes theory-note-arrive{0%{opacity:0}to{opacity:1}}.theory-activity>div{white-space:normal}@media (max-height:850px) and (min-width:900px){.theory-lesson{grid-template-rows:auto auto minmax(0,1fr) 20px 165px;min-height:700px;padding-top:62px}.theory-lesson .theory-staff,.theory-lesson .theory-tracing>svg{height:155px}.theory-paper>.theory-scene-copy{font-size:15px;margin:4px auto 8px!important}.theory-activity{min-height:54px;padding:6px 12px}.theory-activity>div{min-height:20px;margin-top:2px}.theory-activity.is-challenge{margin-bottom:4px;padding:6px 12px}.theory-lesson:has(.sequence-keyboard.is-visible) .sequence-figure{grid-template-columns:1.8fr 1fr;align-items:center;gap:16px;display:grid}.theory-lesson:has(.sequence-keyboard.is-visible) .sequence-staff{height:190px}.sequence-keyboard.is-visible{width:100%;margin:0}.theory-transition{margin:0}}.sequence-note.is-playing .theory-quarter-note{fill:#b9362e;color:#b9362e}.sequence-note.is-playing .sequence-hit{fill:#bb352e;fill-opacity:.1}.sequence-keyboard .is-key-active{fill:#efd1cd;stroke:#b9362e;stroke-width:1.5px}.theory-paper>.theory-activity{display:none}.theory-paper>#lesson-companion{flex-shrink:0;order:2;justify-content:center;align-items:center;min-height:94px;padding:10px 12px;display:flex}.theory-paper>.theory-scene-copy{text-align:left;text-wrap:pretty;order:1;width:100%;max-width:58ch;padding:0 14px;line-height:1.5;margin:10px auto!important}.theory-paper{padding-top:18px}.theory-staff-target:focus-visible rect{stroke:none}.theory-staff-target:focus-visible .theory-position-dot{stroke:#333;stroke-width:2px}.theory-staff [tabindex]:focus-visible{outline:none}.theory-position-label{paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}.theory-controls{justify-content:center;gap:12px}.theory-controls .theory-check{margin-left:12px}.theory-controls button{min-height:40px}.theory-controls:empty{display:none}.theory-staff [role=button]:focus,.sequence-staff [role=button]:focus,.sequence-keyboard [role=button]:focus{outline:none!important}.theory-staff-target:focus-visible rect{fill:#bb352e0a;stroke:none!important}.sequence-note:focus-visible .sequence-hit{stroke:#bb352e;stroke-width:1px}.theory-lesson{--staff-height:clamp(260px,34vh,340px);grid-template-rows:auto auto minmax(0,1fr) 16px clamp(125px,18vh,175px);min-height:800px}.theory-lesson .theory-paper{padding-top:4px}.theory-lesson .theory-staff,.theory-lesson .theory-tracing>svg,.theory-lesson .sequence-staff{height:var(--staff-height);width:100%;min-height:0;max-height:none}.theory-lesson:has(.sequence-keyboard.is-visible) .sequence-staff{height:var(--staff-height);width:100%;min-height:0;max-height:none}.theory-lesson:has(.sequence-keyboard.is-visible) .sequence-figure{display:block}.theory-lesson .sequence-keyboard.is-visible{width:280px;max-width:65%;margin:-8px auto 6px}.theory-paper>.theory-scene-copy{max-width:55ch;min-height:54px;padding:0 12px;font-size:18px;line-height:1.5;animation:.3s ease-out lesson-copy-in;margin:8px auto!important}.theory-paper>#lesson-companion{min-height:76px;padding:4px 12px}.theory-paper .is-docked .cookie-pet-bubble{min-height:58px;padding:12px 18px;font-size:17px}.theory-paper>.theory-transition{margin-top:6px;position:static}.theory-demonstrations{order:1;justify-content:center;gap:20px;margin:0 0 6px;display:flex}.theory-demonstrations button{color:#777;background:0 0;border:0;border-bottom:2px solid #0000;min-height:40px;padding:6px 2px;font-size:15px}.theory-demonstrations button[aria-pressed=true]{color:#a33b30;border-color:#a33b30}.theory-timeline{border:0;justify-content:space-between;gap:0;margin:10px 0 0;padding:0 0 4px;display:flex;position:relative;overflow-x:auto}.theory-timeline button{flex:1;min-width:82px;min-height:60px;padding:30px 7px 8px;font-size:13px;position:relative;border:0!important}.theory-timeline button:before{content:"";background:#eadfce;height:2px;position:absolute;top:13px;left:0;right:0}.theory-timeline button:after{content:"";background:#e5d2b2;border-radius:50%;width:10px;height:10px;transition:background .25s,transform .25s;position:absolute;top:9px;left:calc(50% - 5px)}.theory-timeline button[aria-current]:after{background:radial-gradient(circle at 30% 30%,#80542d 0 2px,#0000 2.5px),radial-gradient(circle at 68% 45%,#80542d 0 2px,#0000 2.5px),radial-gradient(circle at 40% 75%,#80542d 0 2px,#0000 2.5px),#dbac65;border:1px solid #bc8945;width:22px;height:22px;top:3px;left:calc(50% - 11px);transform:rotate(-12deg)}.staff-moving-note{pointer-events:none;animation:3.2s ease-in-out infinite note-line-space}@keyframes note-line-space{0%,20%,to{transform:translate(290px,176px)}45%,70%{transform:translate(470px,164px)}}@keyframes lesson-copy-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.ledger-explorer .sequence-ledger{transform-box:fill-box;transform-origin:50%;animation:.7s ease-out both ledger-grow}@keyframes ledger-grow{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@media (max-height:850px){.theory-lesson{--staff-height:260px;grid-template-rows:auto auto minmax(0,1fr) 16px 125px;min-height:800px;padding-top:62px}}@media (max-width:650px){.theory-lesson{--staff-height:240px}.theory-paper>.theory-scene-copy{font-size:17px}.theory-timeline button{min-width:76px}}@media (prefers-reduced-motion:reduce){.staff-moving-note{transform:translate(400px,164px)}.theory-paper>.theory-scene-copy{animation:none}}@media (min-width:900px){.theory-lesson{--staff-height:clamp(240px,31vh,340px);grid-template-rows:auto auto minmax(0,1fr) 12px clamp(90px,14vh,150px);min-height:720px}.theory-lesson:has(.sequence-keyboard.is-visible) .sequence-figure{position:relative}.theory-lesson .sequence-keyboard.is-visible{width:220px;max-width:none;margin:8px 0 0;position:absolute;top:100%;right:12px}.theory-lesson:has(.sequence-keyboard.is-visible) .theory-scene-copy{width:calc(100% - 255px);min-height:54px;margin:8px 0 0!important}.theory-lesson:has(.sequence-keyboard.is-visible) .theory-demonstrations{justify-content:flex-start;width:calc(100% - 255px);margin:0;padding-left:12px}.theory-paper .is-docked .cookie-pet-bubble{font-size:16px}.theory-paper>#lesson-companion{min-height:68px}}.theory-lesson .sequence-keyboard.is-visible{width:340px;max-width:85%}@media (min-width:900px){.theory-lesson .sequence-keyboard.is-visible{width:340px;max-width:none}:is(.theory-lesson:has(.sequence-keyboard.is-visible) .theory-scene-copy,.theory-lesson:has(.sequence-keyboard.is-visible) .theory-demonstrations){width:calc(100% - 370px)}.theory-lesson:has(.sequence-keyboard.is-visible) .theory-demonstrations{gap:14px}}@media (min-width:900px) and (max-height:850px){.theory-lesson{--staff-height:220px;grid-template-rows:auto auto minmax(0,1fr) 8px 90px;padding-top:60px;padding-bottom:12px}.theory-lesson>h1{margin:4px 0;font-size:21px}.theory-timeline{margin-top:4px}.theory-timeline button{min-height:50px;padding-top:27px;padding-bottom:4px}.theory-paper>#lesson-companion{min-height:64px}.theory-paper>.theory-transition{margin-top:0;margin-bottom:0}}@media (min-width:900px){.theory-lesson:has(.sequence-keyboard.is-visible) .theory-scene-copy{align-items:center;min-height:106px;display:flex;margin-top:0!important}}.theory-lesson .sequence-keyboard.is-visible{width:340px;max-width:85%;margin:0 auto 8px;display:block;position:static}.theory-paper>.theory-transition{text-align:right;z-index:3;background:#fff;min-height:44px;margin-top:auto;padding:0;position:sticky;bottom:0}.theory-transition>span{color:#666;padding:10px 12px;font-size:15px;display:block}.theory-paper:has(.sequence-keyboard) #lesson-companion{min-height:76px}.theory-memory-methods{order:1;grid-template-columns:repeat(3,1fr);gap:12px;padding:8px 12px;display:grid}.theory-memory-methods button{text-align:left;color:#333;background:#fffdf8;border:1px solid #e8e1d7;border-radius:12px;min-height:88px;padding:12px}.theory-memory-methods strong{margin-bottom:5px;font-size:15px;font-weight:500;display:block}.theory-memory-methods span{color:#777;font-size:13px;line-height:1.4;display:block}.theory-scene-copy>span{animation:.3s ease-out lesson-copy-in}@media (max-width:650px){.theory-memory-methods{gap:6px;padding:6px 0}.theory-memory-methods button{padding:9px}.theory-memory-methods strong{font-size:14px}.theory-memory-methods span{font-size:12px}}.theory-memory-methods{gap:18px}.theory-memory-methods button{background:0 0;border:0;border-top:2px solid #e7dac7;border-radius:0;padding:14px 6px;animation:.45s both lesson-copy-in}.theory-memory-methods button:nth-child(2){animation-delay:.1s}.theory-memory-methods button:nth-child(3){animation-delay:.2s}.theory-memory-methods button[aria-pressed=true]{background:0 0;border-color:#b58745}.theory-memory-methods button:hover{border-color:#b58745}