.sv-tutorial-gallery{color:var(--sv-home-text,#f7fafa)}.sv-tutorial-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;display:grid}.sv-tutorial-card{isolation:isolate;min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:16px;align-self:start;padding:0;position:relative}.sv-tutorial-card:before{content:"";z-index:-1;border-radius:inherit;opacity:0;pointer-events:none;background:#252729;transition:opacity .15s;position:absolute;inset:-4px;box-shadow:inset 0 0 0 1px #ffffff1a}.sv-tutorial-card:hover:before{opacity:1}.sv-tutorial-card:focus-visible{outline:2px solid var(--sv-product-chrome-focus,#d1fe17);outline-offset:3px}.sv-tutorial-cover{aspect-ratio:275.2/154.112;background:#222426;border-radius:12px;display:block;position:relative;overflow:hidden}.sv-tutorial-cover img{object-fit:cover;width:100%;height:100%;display:block}.sv-tutorial-cover-placeholder{color:#d1fe17;background:radial-gradient(circle at 68% 28%,#d1fe1733,#0000 32%),linear-gradient(145deg,#2a2d31,#191b1e);place-items:center;width:100%;height:100%;display:grid}.sv-tutorial-cover-label{box-sizing:border-box;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;white-space:nowrap;opacity:0;pointer-events:none;background:#0003;border-radius:99px;align-items:center;height:32px;padding:6px 12px;font-size:14px;transition:opacity .15s;display:flex;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.sv-tutorial-card:hover .sv-tutorial-cover-label{opacity:1}.sv-tutorial-copy{gap:4px;min-width:0;padding:8px;display:grid}.sv-tutorial-card{text-decoration:none;display:block}.sv-tutorial-copy h2,.sv-tutorial-copy h3{text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:14px;font-weight:400;line-height:24px;overflow:hidden}.sv-tutorial-copy>span{min-width:0;color:var(--sv-home-text-muted,#9e9e9e);text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:17px;display:block;overflow:hidden}.sv-tutorial-status{min-height:240px;color:var(--sv-home-text-muted,#9e9e9e);justify-content:center;align-items:center;gap:12px;font-size:14px;display:flex}.sv-tutorial-status button{color:var(--sv-home-text,#f7fafa);cursor:pointer;background:#292b2d;border:1px solid #ffffff1a;border-radius:8px;padding:6px 12px}.sv-tutorial-status button:hover{border-color:#d1fe1780}.sv-product-route-shell .sv-home.sv-tutorials-page{box-sizing:border-box;height:100dvh;min-height:0;padding-top:var(--sv-browse-top,72px);overflow:hidden}.sv-product-route-shell .sv-home.sv-tutorials-page .sv-home-content{grid-template-rows:auto minmax(0,1fr);height:100%;min-height:0;margin:0 auto;padding:0;display:grid}.sv-product-route-shell .sv-home.sv-tutorials-page .sv-browse-controls{position:relative;top:auto}.sv-tutorial-scroll-body{overscroll-behavior:contain;scrollbar-width:thin;min-height:0;margin:-4px -4px 0;padding:4px 4px 68px;overflow:auto}.sv-tutorials-title{margin:0 0 20px;padding-bottom:10px;font-size:18px;font-weight:600;line-height:25px;display:table;position:relative}.sv-tutorials-title:after{content:"";background:currentColor;width:30px;height:2px;position:absolute;bottom:0;left:calc(50% - 15px)}.sv-product-route-shell[data-theme=light] .sv-tutorial-card:before{background:#f5f5f5;box-shadow:inset 0 0 0 1px #e5e5e5}.sv-product-route-shell[data-theme=light] .sv-tutorial-status button{background:#f4f4f4;border-color:#e2e2e2}@media (width<=1100px){.sv-tutorial-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=700px){.sv-tutorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=480px){.sv-tutorial-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.sv-tutorial-card:before,.sv-tutorial-cover-label{transition:none}}
