@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight:initial;--tw-border-style:solid;--tw-leading:initial}}}.tutorials-page{max-width:var(--site-max-width);padding-inline:calc(var(--spacing,.25rem)*8);padding-top:calc(var(--spacing,.25rem)*32);padding-bottom:calc(var(--spacing,.25rem)*24);margin-inline:auto}@media (max-width:767px){.tutorials-page{padding-inline:calc(var(--spacing,.25rem)*0);padding-top:calc(var(--spacing,.25rem)*8);padding-bottom:calc(var(--spacing,.25rem)*0)}}.tutorials-empty{padding-block:calc(var(--spacing,.25rem)*32);text-align:center}.tutorials-empty h1{margin-bottom:calc(var(--spacing,.25rem)*4);font-size:var(--text-5xl,3rem);line-height:var(--tw-leading,var(--text-5xl--line-height,1));--tw-font-weight:500;font-weight:500}.tutorials-empty p{font-size:var(--text-xl,1.25rem);line-height:var(--tw-leading,var(--text-xl--line-height,calc(1.75/1.25)));opacity:.6}.tutorials-eyebrow{font-size:var(--text-base,1rem);line-height:var(--tw-leading,var(--text-base--line-height,calc(1.5/1)));--tw-font-weight:500;text-transform:uppercase;opacity:.5;grid-column:1/-1;font-weight:500;display:block}.tutorials-layout{gap:calc(var(--spacing,.25rem)*6);padding:calc(var(--spacing,.25rem)*8);padding-bottom:unset;grid-template-columns:1fr 2fr;display:grid}@media (max-width:1023px){.tutorials-layout{gap:calc(var(--spacing,.25rem)*4);background:var(--color-base-black);color:var(--color-offwhite);border-radius:15px;grid-template-columns:repeat(1,minmax(0,1fr))}}@media (max-width:767px){.tutorials-layout{padding-bottom:calc(var(--spacing,.25rem)*16);border-radius:0}}.detail-description-toggle{display:none}.tutorials-sidebar{padding:calc(var(--spacing,.25rem)*3);background:var(--color-base-black);color:var(--color-offwhite);border-radius:8px;max-height:760px;overflow-y:auto}@media (max-width:1023px){.tutorials-sidebar{max-height:none}}.sidebar-list{margin:calc(var(--spacing,.25rem)*0);padding:calc(var(--spacing,.25rem)*0);flex-direction:column;list-style-type:none;display:flex}.sidebar-list li{border-bottom-style:var(--tw-border-style);border-color:#ffffff1a;border-bottom-width:1px;list-style:none}@supports (color:color-mix(in lab, red, red)){.sidebar-list li{border-color:color-mix(in oklab,var(--color-white,#fff)10%,transparent)}}.sidebar-list li:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.sidebar-item{cursor:pointer;align-items:flex-start;gap:calc(var(--spacing,.25rem)*4);border-style:var(--tw-border-style);width:100%;padding:calc(var(--spacing,.25rem)*4);text-align:left;color:inherit;background:0 0;border-width:0;transition:background .15s;display:flex}.sidebar-item:hover{background:#ffffff0a}.sidebar-item.active{background:#ffffff0f}.sidebar-item .sidebar-index{width:calc(var(--spacing,.25rem)*8);padding-top:calc(var(--spacing,.25rem)*1);font-size:var(--text-base,1rem);line-height:var(--tw-leading,var(--text-base--line-height,calc(1.5/1)));--tw-font-weight:500;opacity:.5;flex-shrink:0;font-weight:500}.sidebar-item .sidebar-thumb{border-radius:var(--radius-md,.375rem);aspect-ratio:4/3;background:#ffffff0f;flex-shrink:0;width:120px;position:relative;overflow:hidden}.sidebar-item .sidebar-thumb img{object-fit:cover;width:100%;height:100%}.sidebar-item .sidebar-thumb .thumb-placeholder{background:#ffffff0a;width:100%;height:100%}.sidebar-item .sidebar-thumb .sidebar-duration{bottom:calc(var(--spacing,.25rem)*1);left:calc(var(--spacing,.25rem)*1);padding-inline:calc(var(--spacing,.25rem)*1.5);padding-block:calc(var(--spacing,.25rem)*.5);--tw-font-weight:500;color:#fff;background:#000000b3;border-radius:.25rem;font-size:11px;font-weight:500;position:absolute}.sidebar-item .sidebar-meta{min-width:calc(var(--spacing,.25rem)*0);gap:calc(var(--spacing,.25rem)*2);flex-direction:column;flex:1;display:flex}.sidebar-item .sidebar-meta .sidebar-title{font-size:var(--text-xl,1.25rem);line-height:var(--tw-leading,var(--text-xl--line-height,calc(1.75/1.25)));--tw-leading:var(--leading-snug,1.375);line-height:var(--leading-snug,1.375);--tw-font-weight:500;font-weight:500;display:block}.sidebar-item .sidebar-meta .sidebar-description{font-size:var(--text-lg,1.125rem);line-height:var(--tw-leading,var(--text-lg--line-height,calc(1.75/1.125)));--tw-leading:var(--leading-snug,1.375);line-height:var(--leading-snug,1.375);opacity:.6}.sidebar-item .sidebar-meta .sidebar-description p{margin:calc(var(--spacing,.25rem)*0)}.sidebar-item .sidebar-meta .sidebar-description a{text-decoration-line:underline}.tutorials-main{min-width:calc(var(--spacing,.25rem)*0);gap:calc(var(--spacing,.25rem)*6);flex-direction:column;display:flex}.tutorials-main .video-wrapper{border-radius:var(--radius-2xl,1rem);aspect-ratio:16/9;background:var(--color-base-black);width:100%;scroll-margin-top:180px;position:relative;overflow:hidden}@media (min-width:1024px){.tutorials-main .video-wrapper{border:15px solid var(--color-base-black)}}.tutorials-main .video-wrapper iframe{inset:calc(var(--spacing,.25rem)*0);border-style:var(--tw-border-style);border-width:0;width:100%;height:100%;position:absolute}.detail-grid{gap:calc(var(--spacing,.25rem)*6);grid-template-columns:4fr 1fr;display:grid}@media (max-width:767px){.detail-grid{grid-template-columns:repeat(1,minmax(0,1fr))}}.detail-body{border-radius:var(--radius-2xl,1rem);padding:calc(var(--spacing,.25rem)*8);background:var(--color-base-black);color:var(--color-offwhite)}.detail-heading{margin-bottom:calc(var(--spacing,.25rem)*4);align-items:center;gap:calc(var(--spacing,.25rem)*4);display:flex}.detail-heading .detail-index{padding-top:calc(var(--spacing,.25rem)*1);font-size:var(--text-base,1rem);line-height:var(--tw-leading,var(--text-base--line-height,calc(1.5/1)));--tw-font-weight:500;opacity:.6;font-weight:500}.detail-heading h2{font-size:var(--text-3xl,1.875rem);line-height:var(--tw-leading,var(--text-3xl--line-height,calc(2.25/1.875)));--tw-leading:var(--leading-tight,1.25);line-height:var(--leading-tight,1.25);--tw-font-weight:500;font-weight:500}@media (max-width:767px){.detail-heading h2{font-size:var(--text-2xl,1.5rem);line-height:var(--tw-leading,var(--text-2xl--line-height,calc(2/1.5)))}}.detail-description{padding-left:calc(var(--spacing,.25rem)*10);font-size:var(--text-xl,1.25rem);line-height:var(--tw-leading,var(--text-xl--line-height,calc(1.75/1.25)));--tw-leading:var(--leading-relaxed,1.625);line-height:var(--leading-relaxed,1.625);opacity:.5}.detail-description p{margin:calc(var(--spacing,.25rem)*0)}.detail-description a{text-decoration-line:underline}@media (max-width:767px){.detail-description{padding-left:calc(var(--spacing,.25rem)*0)}}.detail-meta{margin:calc(var(--spacing,.25rem)*0);gap:calc(var(--spacing,.25rem)*4);border-radius:var(--radius-2xl,1rem);padding:calc(var(--spacing,.25rem)*6);background:var(--color-base-black);color:#fff9;flex-direction:column;list-style-type:none;display:flex}.detail-meta li{align-items:flex-start;gap:calc(var(--spacing,.25rem)*3);font-size:var(--text-base,1rem);line-height:var(--tw-leading,var(--text-base--line-height,calc(1.5/1)));--tw-leading:var(--leading-snug,1.375);line-height:var(--leading-snug,1.375);list-style:none;display:flex}.detail-meta img{margin-top:calc(var(--spacing,.25rem)*.5);height:calc(var(--spacing,.25rem)*4);width:calc(var(--spacing,.25rem)*4);object-fit:contain;opacity:.6;flex-shrink:0}@media (max-width:1023px){.tutorials-eyebrow{opacity:.8}.tutorials-main{display:contents}.tutorials-eyebrow{order:1}.tutorials-main .video-wrapper{order:2}.detail-grid{order:3}.tutorials-sidebar{order:4}.tutorials-sidebar,.detail-body,.detail-meta{background:0 0;border-radius:0;padding:0}.tutorials-sidebar{max-height:none;overflow:visible}.detail-grid{gap:calc(var(--spacing,.25rem)*3);grid-template-columns:repeat(1,minmax(0,1fr))}.detail-body{display:contents}.detail-heading{margin-bottom:calc(var(--spacing,.25rem)*0);padding-bottom:calc(var(--spacing,.25rem)*4);order:1}.detail-heading h2{font-size:var(--text-2xl,1.5rem);line-height:var(--tw-leading,var(--text-2xl--line-height,calc(2/1.5)))}.detail-heading .detail-index{display:none}.detail-meta{order:2}.detail-description{order:3}.detail-meta{column-gap:calc(var(--spacing,.25rem)*6);row-gap:calc(var(--spacing,.25rem)*2);padding-inline:calc(var(--spacing,.25rem)*0);padding-top:calc(var(--spacing,.25rem)*4);padding-bottom:calc(var(--spacing,.25rem)*6);border-top:1px solid #ffffff1f;grid-template-columns:max-content max-content;display:grid}.detail-meta li:nth-child(n+3){grid-column:1/-1}.detail-meta li{font-size:var(--text-lg,1.125rem);line-height:var(--tw-leading,var(--text-lg--line-height,calc(1.75/1.125)))}.detail-description{padding-right:calc(var(--spacing,.25rem)*10);padding-bottom:calc(var(--spacing,.25rem)*4);padding-left:calc(var(--spacing,.25rem)*0);font-size:var(--text-lg,1.125rem);line-height:var(--tw-leading,var(--text-lg--line-height,calc(1.75/1.125)));border-bottom:1px solid #ffffff1f;position:relative}.detail-description:not(.expanded) .detail-description-content{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.detail-description-toggle{top:calc(var(--spacing,.25rem)*0);right:calc(var(--spacing,.25rem)*0);height:calc(var(--spacing,.25rem)*7);width:calc(var(--spacing,.25rem)*7);cursor:pointer;border-style:var(--tw-border-style);padding:calc(var(--spacing,.25rem)*0);color:var(--color-offwhite);background:#ffffff1f;border-width:0;border-radius:3.40282e38px;justify-content:center;align-items:center;transition:background .15s;display:inline-flex;position:absolute}.detail-description-toggle:hover{background:#fff3}.sidebar-item{gap:calc(var(--spacing,.25rem)*3);padding:calc(var(--spacing,.25rem)*0);padding-block:calc(var(--spacing,.25rem)*3)}.sidebar-item:hover,.sidebar-item.active{background:0 0}.sidebar-item .sidebar-index{display:none}.sidebar-item .sidebar-thumb{width:140px}.sidebar-item .sidebar-meta .sidebar-title{font-size:var(--text-xl,1.25rem);line-height:var(--tw-leading,var(--text-xl--line-height,calc(1.75/1.25)))}.sidebar-item .sidebar-meta .sidebar-description{font-size:var(--text-lg,1.125rem);line-height:var(--tw-leading,var(--text-lg--line-height,calc(1.75/1.125)));-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}