.skip-link.svelte-12gk1yp{position:absolute;left:0;top:0;background:#06b6d4;color:#fff;padding:8px 16px;z-index:100;font-weight:600;text-decoration:none;border-radius:0 0 8px;transform:translateY(-100%);transition:transform .2s ease}.skip-link.svelte-12gk1yp:focus{transform:translateY(0)}.page-shell.svelte-12gk1yp{background:var(--midi-daw-page-bg)}.page-header.svelte-12gk1yp{position:relative;padding:2rem 2rem 5rem;min-height:180px;background:var(--midi-daw-page-bg)}.header-bg.svelte-12gk1yp{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.header-content.svelte-12gk1yp{position:relative;z-index:1;max-width:900px;margin:0 auto}.content-area.svelte-12gk1yp{background:var(--midi-daw-page-bg);min-height:calc(100vh - 180px);margin-top:-20px}.exercise-container.svelte-12gk1yp{max-width:1400px;margin:0 auto;padding:24px 16px 48px}.breadcrumb.svelte-12gk1yp{display:flex;align-items:center;gap:8px;font-size:.875rem;color:#ffffffd9;margin-bottom:24px;width:-moz-fit-content;width:fit-content;flex-wrap:nowrap}.breadcrumb.svelte-12gk1yp a:where(.svelte-12gk1yp),.breadcrumb.svelte-12gk1yp span:where(.svelte-12gk1yp){white-space:nowrap}.breadcrumb.svelte-12gk1yp a:where(.svelte-12gk1yp){display:inline-flex;width:auto;flex:0 0 auto;color:#fff;text-decoration:none}.breadcrumb.svelte-12gk1yp a:where(.svelte-12gk1yp):hover{text-decoration:underline}.breadcrumb.svelte-12gk1yp .separator:where(.svelte-12gk1yp){opacity:.6}.breadcrumb.svelte-12gk1yp .current:where(.svelte-12gk1yp){color:#fff}.exercise-header.svelte-12gk1yp{display:flex;gap:20px;align-items:center}.header-icon.svelte-12gk1yp{width:72px;height:72px;display:flex;align-items:center;justify-content:center;background:var(--midi-daw-header-icon-bg);border-radius:16px;color:var(--midi-daw-header-icon-fg);flex-shrink:0}.header-icon.svelte-12gk1yp svg{width:100%;height:auto;max-width:100%;max-height:100%;pointer-events:none}.header-text.svelte-12gk1yp h1:where(.svelte-12gk1yp){font-size:1.75rem;font-weight:400;color:#fff;margin:0 0 4px}.header-text.svelte-12gk1yp p:where(.svelte-12gk1yp){font-size:1rem;color:var(--midi-daw-hero-copy);margin:0}@media (max-width: 600px){.page-header.svelte-12gk1yp{padding:1.5rem 1rem 3rem}.exercise-container.svelte-12gk1yp{padding:16px}.exercise-header.svelte-12gk1yp{flex-direction:column;align-items:center;text-align:center}.header-icon.svelte-12gk1yp{width:60px;height:60px}.header-icon.svelte-12gk1yp svg{width:100%;height:auto;max-width:100%;max-height:100%}.header-text.svelte-12gk1yp h1:where(.svelte-12gk1yp){font-size:1.5rem}}
