.tutorial-snippet{margin-bottom:16px;margin-top:16px}.tutorial-snippet .editor{border-top-left-radius:8px;border-top-right-radius:8px;border-width:1px 1px 0;overflow-y:auto;--tw-border-opacity:1;border-color:hsl(var(--twc-borderColor-200)/var(--twc-borderColor-200-opacity,var(--tw-border-opacity)));--tw-bg-opacity:1;background-color:hsl(var(--twc-editorBg)/var(--twc-editorBg-opacity,var(--tw-bg-opacity)));padding:16px}.tutorial-snippet .editor .cm-gutters{display:none}.tutorial-snippet .editor .cm-content{font-family:JetBrains Mono,monospace;font-size:13px;font-weight:400;line-height:20px}@media(min-width:960px){.tutorial-snippet .editor .cm-content{font-size:14px;line-height:21px}}.tutorial-snippet .editor .cm-content .cm-activeLine{--tw-bg-opacity:1;background-color:hsl(var(--twc-editorBg)/var(--twc-editorBg-opacity,var(--tw-bg-opacity)))}.tutorial-snippet .btns{border-bottom-left-radius:8px;border-bottom-right-radius:8px;border-width:1px;display:flex;justify-content:space-between;width:100%;--tw-border-opacity:1;border-color:hsl(var(--twc-borderColor-300)/var(--twc-borderColor-300-opacity,var(--tw-border-opacity)));--tw-bg-opacity:1;background-color:hsl(var(--twc-neutral-100)/var(--twc-neutral-100-opacity,var(--tw-bg-opacity)));padding:16px}.tutorial-snippet .btns .left{align-items:center;display:flex;gap:12px}.tutorial-snippet .explanation{border-bottom-left-radius:8px;border-bottom-right-radius:8px;border-width:1px;display:flex;flex-direction:column;gap:20px;--tw-border-opacity:1;border-color:hsl(var(--twc-borderColor-300)/var(--twc-borderColor-300-opacity,var(--tw-border-opacity)));--tw-bg-opacity:1;background-color:hsl(var(--twc-neutral-100)/var(--twc-neutral-100-opacity,var(--tw-bg-opacity)));padding:16px}.tutorial-snippet .explanation .top{align-items:center;display:flex;justify-content:space-between;width:100%}.tutorial-snippet .explanation .top .explanation-open-left{align-items:center;display:flex;gap:8px}.tutorial-snippet .explanation .feedback{align-items:center;display:flex;justify-content:space-between;margin-top:auto;width:100%}.tutorial-snippet .explanation .feedback .text{font-family:YekanBakh,Arial,Helvetica,sans-serif;font-size:14px;font-weight:500;line-height:22px}@media(min-width:960px){.tutorial-snippet .explanation .feedback .text{font-size:16px;line-height:26px}}.tutorial-snippet .explanation .feedback .text{--tw-text-opacity:1;color:hsl(var(--twc-textColor-400)/var(--twc-textColor-400-opacity,var(--tw-text-opacity)))}.tutorial-snippet .output{border-width:1px;--tw-border-opacity:1;border-color:hsl(var(--twc-borderColor-300)/var(--twc-borderColor-300-opacity,var(--tw-border-opacity)));--tw-bg-opacity:1;background-color:hsl(var(--twc-neutral)/var(--twc-neutral-opacity,var(--tw-bg-opacity)));padding:16px}.tutorial-snippet .output pre{font-size:.875rem;line-height:1.25rem;overflow-x:auto;width:100%}.tutorial-snippet .output--with-explanation{border-width:1px 1px 0;--tw-border-opacity:1;border-color:hsl(var(--twc-borderColor-300)/var(--twc-borderColor-300-opacity,var(--tw-border-opacity)))}.tutorial-snippet .output--without-explanation{border-bottom-left-radius:8px;border-bottom-right-radius:8px;border-width:1px;--tw-border-opacity:1;border-color:hsl(var(--twc-borderColor-300)/var(--twc-borderColor-300-opacity,var(--tw-border-opacity)))}.tutorial-snippet .output .header{align-items:center;display:flex;justify-content:space-between}.tutorial-snippet .output .header .title{font-family:YekanBakh,Arial,Helvetica,sans-serif;font-size:14px;font-weight:500;line-height:22px}@media(min-width:960px){.tutorial-snippet .output .header .title{font-size:16px;line-height:26px}}.tutorial-snippet .output .header .title{--tw-text-opacity:1;color:hsl(var(--twc-textColor-600)/var(--twc-textColor-600-opacity,var(--tw-text-opacity)))}.tutorial-snippet .output .content{margin-top:20px}.tutorial-snippet .output .content .terminal-output{text-align:left}.tutorial-snippet--mobile{border-radius:8px;border-width:1px;margin-bottom:12px;margin-top:12px;overflow:hidden;--tw-border-opacity:1;border-color:hsl(var(--twc-borderColor-300)/var(--twc-borderColor-300-opacity,var(--tw-border-opacity)));--tw-bg-opacity:1;background-color:hsl(var(--twc-bgColor-100)/var(--twc-bgColor-100-opacity,var(--tw-bg-opacity)))}.tutorial-snippet--mobile .editor{border-radius:0;border-width:0 0 1px;--tw-border-opacity:1;border-color:hsl(var(--twc-borderColor-300)/var(--twc-borderColor-300-opacity,var(--tw-border-opacity)));padding:16px}.tutorial-snippet--mobile .editor .cm-content{font-family:JetBrains Mono,monospace;font-size:13px;font-weight:400;line-height:20px}@media(min-width:960px){.tutorial-snippet--mobile .editor .cm-content{font-size:14px;line-height:21px}}.tutorial-snippet--mobile .editor .cm-content{font-size:.75rem;line-height:1rem}.tutorial-snippet--mobile .btns{border-radius:0;border-width:0;--tw-bg-opacity:1;background-color:hsl(var(--twc-neutral-100)/var(--twc-neutral-100-opacity,var(--tw-bg-opacity)));padding:16px}.tutorial-snippet--mobile .btns .left{flex-wrap:wrap;justify-content:flex-end}.tutorial-snippet--mobile .explanation{border-radius:0;border-width:0}.tutorial-snippet--mobile .explanation .feedback,.tutorial-snippet--mobile .explanation .top{align-items:center;display:flex;justify-content:space-between}.tutorial-snippet--mobile .explanation .feedback{width:100%}.tutorial-snippet--mobile .output .content{margin-top:12px;min-width:0}.tutorial-snippet--mobile .output .content .terminal-output{direction:ltr;font-family:monospace;font-size:.75rem;line-height:1.25rem;overflow-wrap:break-word;text-align:left;white-space:pre-wrap}
