*{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;font-size:16px;line-height:1.5}body{min-height:100vh;color:var(--color-text);background-color:var(--color-background-alt)}#root{min-height:100vh}button{font-family:inherit;font-size:inherit;color:inherit}.printable-lesson{--print-page-padding:24px;max-width:960px;padding:var(--print-page-padding);color:#111;background:#fff;margin:0 auto;font-family:system-ui,-apple-system,Segoe UI,sans-serif}.printable-lesson__header{border-bottom:2px solid #222;margin-bottom:24px;padding-bottom:12px}.printable-lesson__title{margin:0 0 4px;font-size:1.75rem}.printable-lesson__subtitle{color:#555;margin:0;font-size:1rem}.printable-lesson__meta{color:#666;flex-wrap:wrap;gap:16px;margin-top:8px;font-size:.85rem;display:flex}.printable-lesson__meta-item strong{color:#222;margin-right:4px}.printable-lesson__step{break-inside:avoid;page-break-inside:avoid;border-top:1px solid #ddd;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:2em;padding:3em 0;display:grid}.printable-lesson__step:first-of-type{border-top:none}.printable-lesson__step-machine{justify-content:center;align-items:flex-start;min-height:280px;display:flex}.printable-lesson__step-machine--hidden{color:#888;background:repeating-linear-gradient(45deg,#f5f5f5,#f5f5f5 10px,#eaeaea 10px 20px);border-radius:8px;justify-content:center;align-items:center;min-height:120px;font-style:italic;display:flex}.printable-lesson__step-body{flex-direction:column;gap:8px;display:flex}.printable-lesson__step-header{flex-wrap:wrap;align-items:baseline;gap:12px;display:flex}.printable-lesson__step-id{color:#fff;background:#222;border-radius:3px;padding:2px 8px;font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:.8rem}.printable-lesson__step-type{text-transform:uppercase;letter-spacing:.06em;color:#555;font-size:.75rem}.printable-lesson__step-emoji{font-size:1.5rem}.printable-lesson__step-text{font-size:.95rem;line-height:1.5}.printable-lesson__step-text strong{color:#000}.printable-lesson__interact-note{color:#555;border-left:3px solid #888;margin-top:8px;padding-left:8px;font-size:.8rem;font-style:italic}.printable-lesson__choose-options{margin:8px 0 0;padding-left:20px}.printable-lesson__choose-options li{margin-bottom:4px}@media print{body{background:#fff}.printable-lesson{max-width:none;padding:0}.printable-lesson__step{break-inside:avoid;page-break-inside:avoid;padding:12px 0}.printable-lesson-app-hide{display:none!important}.printable-lesson__step+.printable-lesson__step{break-before:page;page-break-before:always}}.printable-machine-snapshot{pointer-events:none;width:100%;font-size:1rem;position:relative}.printable-machine-snapshot .annotation-layer{text-align:center;z-index:100;font-size:1.5em}.anchor-chart{--print-page-padding:24px;max-width:960px;padding:var(--print-page-padding);color:#111;background:#fff;margin:0 auto;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:1.5em}.anchor-chart__header{text-align:center;border-bottom:2px solid #222;margin-bottom:24px;padding-bottom:12px}.anchor-chart__title{margin:0 0 6px;font-size:2em}.anchor-chart__subtitle{color:#555;margin:0;font-size:1em}.anchor-chart__diagram{break-inside:avoid;page-break-inside:avoid;justify-content:center;align-items:center;min-height:320px;margin:0 auto 28px;padding:48px 24px;display:flex}.anchor-chart__summary{margin-bottom:24px;font-size:1em;line-height:1.55}.anchor-chart__summary p{margin:0}.anchor-chart__summary strong{color:#000}.anchor-chart__legend-title{border-bottom:1px solid #ccc;margin:0 0 8px;padding-bottom:4px;font-size:1.1em}.anchor-chart__legend-list{grid-template-columns:1fr 1fr;gap:8px 24px;margin:0;display:grid}.anchor-chart__legend-row{grid-template-columns:max-content 1fr;align-items:baseline;gap:10px;display:grid}.anchor-chart__legend-row dt{color:#fff;white-space:nowrap;background:#222;border-radius:3px;padding:2px 8px;font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:.85em;font-weight:700}.anchor-chart__legend-row dd{margin:0;font-size:.9em;line-height:1.4}@media print{body{background:#fff}.anchor-chart{max-width:none;padding:0}.printable-lesson-app-hide{display:none!important}}.network-carousel{width:100%;display:grid;overflow:hidden}.network-carousel__slot{grid-area:1/1;align-items:stretch;width:100%;transition:transform .25s ease-in-out;display:flex}.network-carousel__slot--visible{transform:translateY(0)}.network-carousel__slot--below{transform:translateY(100%)}.network-carousel .network-visualization{max-width:100%!important}.piano-keyboard{width:100%;padding:1rem .5rem}.piano-keyboard__keys{justify-content:center;gap:2px;display:flex;position:relative}.piano-key{border-radius:0 0 4px 4px;justify-content:center;align-items:flex-end;transition:background-color .15s,box-shadow .15s;display:flex;position:relative}.piano-key--white{background:#f0f0f0;border:1px solid #bbb;width:28px;height:80px}.piano-key--white.piano-key--active{background:#e0ffe0}.piano-key--black{z-index:1;background:#222;border:1px solid #444;width:18px;height:52px;margin-left:-9px;margin-right:-9px}.piano-key--black.piano-key--active{background:#445}.piano-key__label{color:#999;-webkit-user-select:none;user-select:none;pointer-events:none;padding-bottom:4px;font-size:.6rem}@media (width<=768px){.piano-key--white{width:20px;height:60px}.piano-key--black{width:14px;height:40px;margin-left:-8px;margin-right:-8px}.piano-key__label{font-size:.5rem}}.song-beat-indicator{flex-direction:column;align-items:center;gap:4px;display:flex}.song-beat-indicator__row{opacity:.35;transition:opacity .3s}.song-beat-indicator__row--active{opacity:1}.song-beat-indicator__steps{gap:var(--step-gap);display:flex;position:relative}.song-beat-indicator__step{width:var(--step-width);height:var(--step-width);border-radius:calc(var(--step-width) / 4);background:var(--color-border);border:1px solid var(--color-text);transition:background-color .5s}.song-beat-indicator__step--active{border-color:#0000}.song-beat-indicator__tracker{pointer-events:none;position:absolute;left:0}.song-beat-indicator__tracker-frame{left:calc(var(--step-width) * -.5);width:var(--step-width);height:var(--step-width);border-radius:calc(var(--step-width) / 4);border:2px solid;position:relative}.page-layout{flex-direction:column;height:100vh;display:flex;overflow:hidden}@container (width>=720px){.page-layout{height:100vh}}.page-layout__split{width:100%;min-height:0;max-width:var(--container-lg,1280px);flex:1;margin:0 auto}.page-layout__split>.split__grid{height:100%}.page-layout__split>.split__grid>.split__pane:first-child{height:100%;padding:var(--spacing-md);z-index:1;justify-content:center;align-items:center;display:flex;position:relative}.page-layout__split>.split__grid>.split__pane:last-child{height:100%;min-height:0}.page-layout__content{height:100%;padding:var(--spacing-md);scrollbar-width:thin;scrollbar-color:#fff3 transparent;overflow-y:auto}.page-layout__content::-webkit-scrollbar{width:6px}.page-layout__content::-webkit-scrollbar-track{background:0 0}.page-layout__content::-webkit-scrollbar-thumb{background-color:#fff3;border-radius:13px}.page-layout__content p{line-height:1.8em}.nav-button{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:2px solid #0000;font-size:.875rem;font-weight:500;text-decoration:none;display:flex}.nav-button:hover{background:var(--overlay-light);color:var(--color-text)}.nav-button--active,.nav-button--filled{background:var(--overlay-light);border-color:var(--overlay-medium);color:var(--color-text)}.nav-button--filled:hover{background:var(--overlay-medium)}.nav-bar{padding:var(--spacing-sm) var(--spacing-md);border-bottom:1px solid var(--overlay-light)}