.tutorial-steps.svelte-or201g{border-radius:.5rem;border-width:1px;border-color:var(--color-border);padding:1.5rem;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);background-color:#fff}.dark .tutorial-steps.svelte-or201g{background-color:#111827}.step-item.svelte-or201g{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.step-item.svelte-or201g:is(.dark:where(.svelte-or201g) :where(.svelte-or201g)){--tw-border-opacity: 1;border-color:rgb(55 65 81 / var(--tw-border-opacity, 1))}.step-item.active.svelte-or201g{--tw-border-opacity: 1;border-color:rgb(0 108 233 / var(--tw-border-opacity, 1))}.step-header.svelte-or201g{width:100%;padding:1rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.step-header.svelte-or201g:hover{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.dark .step-header.svelte-or201g:hover{--tw-bg-opacity: 1;background-color:rgb(31 41 55 / var(--tw-bg-opacity, 1))}.step-header.completed.svelte-or201g{background-color:#f0fdf4}.dark .step-header.completed.svelte-or201g{background-color:#14532d33}.step-indicator.svelte-or201g{display:flex;height:2rem;width:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:9999px;--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1))}.step-indicator.svelte-or201g:is(.dark:where(.svelte-or201g) :where(.svelte-or201g)){--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity, 1))}.step-indicator.svelte-or201g{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.step-indicator.svelte-or201g:is(.dark:where(.svelte-or201g) :where(.svelte-or201g)){--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity, 1))}.step-header.completed.svelte-or201g .step-indicator:where(.svelte-or201g){--tw-bg-opacity: 1;background-color:rgb(34 197 94 / var(--tw-bg-opacity, 1))}.step-content.svelte-or201g{padding:1rem;padding-top:0}.task-box.svelte-or201g{margin-bottom:1rem;border-radius:.5rem;padding:1rem;background-color:#eff6ff}.dark .task-box.svelte-or201g{background-color:#1e3a8a33}.hint-box.svelte-or201g{margin-bottom:1rem;border-radius:.5rem;padding:1rem;background-color:#fefce8}.dark .hint-box.svelte-or201g{background-color:#78350f33}.btn-sm.svelte-or201g{padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem}.prose code{border-radius:.25rem;--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1));padding:.125rem .25rem}.prose code:is(.dark.svelte-or201g :where(.svelte-or201g)){--tw-bg-opacity: 1;background-color:rgb(31 41 55 / var(--tw-bg-opacity, 1))}.prose pre{--tw-bg-opacity: 1;background-color:rgb(17 24 39 / var(--tw-bg-opacity, 1))}.prose pre:is(.dark.svelte-or201g :where(.svelte-or201g)){--tw-bg-opacity: 1;background-color:rgb(3 7 18 / var(--tw-bg-opacity, 1))}.tutorial-example-layout.svelte-7x3xdy{display:flex;height:100%;flex-direction:column}.tutorial-header.svelte-7x3xdy{display:flex;align-items:flex-start;justify-content:space-between;border-bottom-width:1px;border-color:var(--color-border);padding:1rem 1.5rem;flex-shrink:0}.tutorial-main.svelte-7x3xdy{display:flex;min-height:0px;flex:1 1 0%}.tutorial-left.svelte-7x3xdy{display:flex;flex:1 1 0%;flex-direction:column;border-right-width:1px;border-color:var(--color-border)}.view-mode-tabs.svelte-7x3xdy{display:flex;border-bottom-width:1px;border-color:var(--color-border);padding-left:1rem;padding-right:1rem;flex-shrink:0;background-color:#f9fafb}.dark .view-mode-tabs.svelte-7x3xdy{background-color:#11182780}.view-mode-tab.svelte-7x3xdy{border-bottom-width:2px;border-color:transparent;padding:.75rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.view-mode-tab.svelte-7x3xdy:hover{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.view-mode-tab.svelte-7x3xdy:is(.dark:where(.svelte-7x3xdy) :where(.svelte-7x3xdy)){--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.view-mode-tab.svelte-7x3xdy:hover:is(.dark:where(.svelte-7x3xdy) :where(.svelte-7x3xdy)){--tw-text-opacity: 1;color:rgb(243 244 246 / var(--tw-text-opacity, 1))}.view-mode-tab.active.svelte-7x3xdy{--tw-border-opacity: 1;border-color:rgb(0 108 233 / var(--tw-border-opacity, 1));--tw-text-opacity: 1;color:rgb(0 108 233 / var(--tw-text-opacity, 1))}.content-area.svelte-7x3xdy{display:flex;flex:1 1 0%;flex-direction:column;overflow:hidden}.code-editor-container.svelte-7x3xdy{display:flex;height:100%;flex-direction:column}.editor-tabs.svelte-7x3xdy{display:flex;border-bottom-width:1px;border-color:var(--color-border);padding-left:1rem;padding-right:1rem;flex-shrink:0}.editor-tab.svelte-7x3xdy{border-bottom-width:2px;border-color:transparent;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.editor-tab.svelte-7x3xdy:hover{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.editor-tab.svelte-7x3xdy:is(.dark:where(.svelte-7x3xdy) :where(.svelte-7x3xdy)){--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.editor-tab.svelte-7x3xdy:hover:is(.dark:where(.svelte-7x3xdy) :where(.svelte-7x3xdy)){--tw-text-opacity: 1;color:rgb(243 244 246 / var(--tw-text-opacity, 1))}.editor-tab.active.svelte-7x3xdy{--tw-border-opacity: 1;border-color:rgb(0 108 233 / var(--tw-border-opacity, 1));--tw-text-opacity: 1;color:rgb(0 108 233 / var(--tw-text-opacity, 1))}.editor-container.svelte-7x3xdy{flex:1 1 0%;overflow:hidden;position:relative}.editor-container.typing-mode.svelte-7x3xdy{display:flex;flex-direction:column}.typing-solution.svelte-7x3xdy{border-bottom-width:1px;border-color:var(--color-border);max-height:40%;overflow-y:auto;flex-shrink:0;background-color:#f9fafb}.dark .typing-solution.svelte-7x3xdy{background-color:#1f2937b3}.typing-solution-header.svelte-7x3xdy{display:flex;align-items:center;justify-content:space-between;border-bottom-width:1px;border-color:var(--color-border);padding:.5rem 1rem;position:sticky;top:0;z-index:10;background-color:#f3f4f6}.dark .typing-solution-header.svelte-7x3xdy{background-color:#1f2937}.typing-solution-code.svelte-7x3xdy{padding:.75rem 1rem;font-size:.875rem;line-height:1.25rem}.typing-solution-code.svelte-7x3xdy pre:where(.svelte-7x3xdy){margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.75rem;line-height:1rem;line-height:1.625;white-space:pre-wrap;word-wrap:break-word}.typing-solution-code.svelte-7x3xdy pre:where(.svelte-7x3xdy) code:where(.svelte-7x3xdy){color:#1f2937!important;opacity:.9}.dark .typing-solution-code.svelte-7x3xdy pre:where(.svelte-7x3xdy) code:where(.svelte-7x3xdy){color:#f3f4f6!important}.solution-banner.svelte-7x3xdy{position:absolute;top:.5rem;right:.5rem;z-index:10;display:flex;align-items:center;gap:.5rem;border-radius:.5rem;--tw-bg-opacity: 1;background-color:rgb(34 197 94 / var(--tw-bg-opacity, 1));padding:.25rem .75rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1));--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.editor-controls.svelte-7x3xdy{display:flex;gap:.75rem;border-top-width:1px;border-color:var(--color-border);padding:.75rem 1rem;flex-shrink:0}.btn-solution-active.svelte-7x3xdy{--tw-bg-opacity: 1;background-color:rgb(34 197 94 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.btn-solution-active.svelte-7x3xdy:hover{--tw-bg-opacity: 1;background-color:rgb(22 163 74 / var(--tw-bg-opacity, 1))}.btn-solution-active.svelte-7x3xdy{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity, 1))}.challenges-section.svelte-7x3xdy{border-top-width:1px;border-color:var(--color-border);padding:1rem;max-height:200px;overflow-y:auto;background-color:#f9fafb}.dark .challenges-section.svelte-7x3xdy{background-color:#11182780}.challenge-card.svelte-7x3xdy{border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));padding:.75rem}.challenge-card.svelte-7x3xdy:is(.dark:where(.svelte-7x3xdy) :where(.svelte-7x3xdy)){--tw-border-opacity: 1;border-color:rgb(55 65 81 / var(--tw-border-opacity, 1))}.challenge-card.svelte-7x3xdy{background-color:#fff}.dark .challenge-card.svelte-7x3xdy{background-color:#1f2937}.tutorial-right.svelte-7x3xdy{display:flex;width:640px;flex-direction:column}.preview-canvas.svelte-7x3xdy{padding:1rem;height:calc(100% - 256px);overflow:auto;display:flex;align-items:center;justify-content:center;background-color:#f9fafb}.dark .preview-canvas.svelte-7x3xdy{background-color:#11182780}.preview-console.svelte-7x3xdy{border-top-width:1px;border-color:var(--color-border);height:256px;flex-shrink:0}@media (max-width: 1024px){.tutorial-main.svelte-7x3xdy{flex-direction:column}.tutorial-left.svelte-7x3xdy{height:24rem;border-right-width:0px;border-bottom-width:1px}.tutorial-right.svelte-7x3xdy{width:100%}}