.TutorialDetail-module__R4A76W__page{margin-top:var(--header-height);min-height:100vh}.TutorialDetail-module__R4A76W__heroBanner{background:var(--gradient-primary);color:#fff;padding:4rem 2rem 3rem;position:relative;overflow:hidden}.TutorialDetail-module__R4A76W__heroBanner:before{content:"";opacity:.12;clip-path:polygon(25% 0,100% 0,100% 100%,0 100%);background:url(/images/pattern-blue.png) 50%/cover no-repeat;width:55%;height:100%;position:absolute;top:0;right:0}.TutorialDetail-module__R4A76W__heroBannerInner{z-index:1;max-width:900px;margin:0 auto;position:relative}.TutorialDetail-module__R4A76W__breadcrumb{opacity:.85;align-items:center;gap:.5rem;margin-bottom:2rem;font-size:.9rem;display:flex}.TutorialDetail-module__R4A76W__breadcrumb a{color:#ffffffd9;transition:color var(--transition-fast)}.TutorialDetail-module__R4A76W__breadcrumb a:hover{color:#fff}.TutorialDetail-module__R4A76W__breadcrumbSeparator{opacity:.5}.TutorialDetail-module__R4A76W__metaTags{flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.TutorialDetail-module__R4A76W__category{color:#fff;border-radius:var(--radius-pill);text-transform:uppercase;letter-spacing:.03em;background:#7dc57ee6;padding:.35rem 1rem;font-size:.8rem;font-weight:600}.TutorialDetail-module__R4A76W__difficulty{color:#fff;border-radius:var(--radius-pill);background:#ffffff26;border:1px solid #ffffff40;padding:.35rem 1rem;font-size:.8rem;font-weight:600}.TutorialDetail-module__R4A76W__readTimeBadge{color:#fffc;font-size:.85rem}.TutorialDetail-module__R4A76W__heroTitle{font-family:var(--font-heading,"DM Serif Display"),serif;color:#fff;letter-spacing:0;text-wrap:balance;max-width:840px;margin-bottom:1.25rem;font-size:3rem;font-weight:700;line-height:1.08}.TutorialDetail-module__R4A76W__heroDescription{color:#ffffffe6;max-width:700px;font-size:1.15rem;line-height:1.7}.TutorialDetail-module__R4A76W__authorBar{border-top:1px solid #ffffff26;align-items:center;gap:1rem;margin-top:2rem;padding-top:1.5rem;display:flex}.TutorialDetail-module__R4A76W__authorAvatar{background:linear-gradient(135deg,var(--color-light-green),var(--color-maya-blue));color:#fff;border:2px solid #ffffff4d;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.2rem;font-weight:700;display:flex;overflow:hidden}.TutorialDetail-module__R4A76W__authorAvatarImg{object-fit:cover;width:100%;height:100%}.TutorialDetail-module__R4A76W__authorInfo{flex-direction:column;gap:.15rem;display:flex}.TutorialDetail-module__R4A76W__authorName{color:#fff;font-size:.95rem;font-weight:600}.TutorialDetail-module__R4A76W__authorDate{color:#ffffffb3;font-size:.85rem}.TutorialDetail-module__R4A76W__container{max-width:1200px;margin:0 auto;padding:3rem 2rem 4rem}.TutorialDetail-module__R4A76W__contentLayout{grid-template-columns:1fr 280px;gap:2.5rem;display:grid;position:relative}.TutorialDetail-module__R4A76W__article{background:var(--color-bg-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);z-index:2;align-self:start;min-width:0;margin-top:-2rem;padding:3rem 3.5rem;position:relative}.TutorialDetail-module__R4A76W__tocSidebar{z-index:2;align-self:stretch;margin-top:-2rem;position:relative}.TutorialDetail-module__R4A76W__stickyWrapper{top:calc(var(--header-height) + var(--toc-height) + 2rem);max-height:calc(100vh - var(--header-height) - var(--toc-height) - 4rem);scrollbar-width:thin;scrollbar-color:#0000001f transparent;flex-direction:column;display:flex;position:sticky;overflow-y:auto}.TutorialDetail-module__R4A76W__stickyWrapper::-webkit-scrollbar{width:4px}.TutorialDetail-module__R4A76W__stickyWrapper::-webkit-scrollbar-track{background:0 0}.TutorialDetail-module__R4A76W__stickyWrapper::-webkit-scrollbar-thumb{background:#0000001f;border-radius:4px}.TutorialDetail-module__R4A76W__stickyWrapper::-webkit-scrollbar-thumb:hover{background:#00000040}.TutorialDetail-module__R4A76W__content{color:var(--color-text);max-width:720px;font-size:1.05rem;line-height:1.85}.TutorialDetail-module__R4A76W__downloadCta{border:1px solid var(--color-border);border-left:4px solid var(--color-light-green);border-radius:0 var(--radius-md)var(--radius-md)0;background:linear-gradient(135deg,#1714490a,#5559a70f);align-items:center;gap:1rem;margin-bottom:2.5rem;padding:1.25rem 1.5rem;display:flex}.TutorialDetail-module__R4A76W__downloadIcon{flex-shrink:0;font-size:1.5rem}.TutorialDetail-module__R4A76W__downloadText{color:var(--color-text-light);flex:1;font-size:.95rem}.TutorialDetail-module__R4A76W__downloadText strong{color:var(--color-text);margin-bottom:.15rem;display:block}.TutorialDetail-module__R4A76W__downloadButton{background:var(--color-light-green);color:#fff;border-radius:var(--radius-md);white-space:nowrap;cursor:pointer;transition:background var(--transition-fast),transform var(--transition-fast);border:none;padding:.6rem 1.25rem;font-size:.85rem;font-weight:600;display:inline-block}.TutorialDetail-module__R4A76W__downloadButton:hover{background:var(--color-light-green-hover);transform:translateY(-1px)}.TutorialDetail-module__R4A76W__sidebarCard{background:var(--color-bg-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);margin-bottom:1.5rem;padding:1.5rem}.TutorialDetail-module__R4A76W__sidebarCardTitle{text-transform:uppercase;letter-spacing:.05em;color:var(--color-federal-blue);margin-bottom:1rem;font-family:Verdana,Geneva,sans-serif;font-size:.8rem;font-weight:700}.TutorialDetail-module__R4A76W__sidebarDownloadBtn{background:var(--color-light-green);color:#fff;text-align:center;border-radius:var(--radius-md);width:100%;transition:all var(--transition-fast);cursor:pointer;border:none;margin-bottom:.75rem;padding:.85rem 1rem;font-size:.85rem;font-weight:600;text-decoration:none;display:block}.TutorialDetail-module__R4A76W__sidebarDownloadBtn:last-child{margin-bottom:0}.TutorialDetail-module__R4A76W__sidebarDownloadBtn:hover{background:var(--color-light-green-hover);transform:translateY(-1px);box-shadow:0 4px 12px #7dc57e4d}.TutorialDetail-module__R4A76W__navigation{border-top:2px solid var(--color-border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-top:3rem;padding-top:2rem;display:flex}.TutorialDetail-module__R4A76W__backButton{background:var(--color-federal-blue);color:#fff;border-radius:var(--radius-md);transition:background var(--transition-fast),transform var(--transition-fast);align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;display:inline-flex}.TutorialDetail-module__R4A76W__backButton:hover{background:var(--color-majorelle-blue);transform:translateY(-2px)}.TutorialDetail-module__R4A76W__shareButtons{color:var(--color-text-light);align-items:center;gap:.75rem;font-size:.9rem;display:flex}.TutorialDetail-module__R4A76W__authorCard{border:1px solid var(--color-border);border-radius:var(--radius-lg);background:linear-gradient(135deg,#17144908,#5559a70d);align-items:center;gap:1.5rem;margin-top:3rem;padding:2rem;display:flex}.TutorialDetail-module__R4A76W__authorCardAvatar{background:linear-gradient(135deg,var(--color-federal-blue),var(--color-majorelle-blue));color:#fff;border:3px solid var(--color-border);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:80px;height:80px;font-size:2rem;font-weight:700;display:flex;overflow:hidden}.TutorialDetail-module__R4A76W__authorCardAvatarImg{object-fit:cover;width:100%;height:100%}.TutorialDetail-module__R4A76W__authorCardInfo h3{color:var(--color-federal-blue);margin-bottom:.25rem;font-size:1.1rem}.TutorialDetail-module__R4A76W__authorCardInfo p{color:var(--color-text-light);font-size:.9rem;line-height:1.5}.TutorialDetail-module__R4A76W__authorCardLink{color:var(--color-majorelle-blue);transition:color var(--transition-fast);margin-top:.5rem;font-size:.85rem;font-weight:600;display:inline-block}.TutorialDetail-module__R4A76W__authorCardLink:hover{color:var(--color-federal-blue)}.TutorialDetail-module__R4A76W__related{max-width:1200px;margin:0 auto;padding:0 2rem 4rem}.TutorialDetail-module__R4A76W__relatedTitle{color:var(--color-federal-blue);margin-bottom:1.5rem;font-size:1.5rem;font-weight:700}.TutorialDetail-module__R4A76W__relatedGrid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;display:grid}.TutorialDetail-module__R4A76W__relatedCard{background:var(--color-bg-light);border-radius:var(--radius-lg);border:1px solid var(--color-border);transition:transform var(--transition-base),box-shadow var(--transition-base);flex-direction:column;gap:.5rem;padding:1.5rem;text-decoration:none;display:flex}.TutorialDetail-module__R4A76W__relatedCard:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-3px)}.TutorialDetail-module__R4A76W__relatedCard h3{color:var(--color-federal-blue);font-size:1rem;line-height:1.35}.TutorialDetail-module__R4A76W__relatedCard p{color:var(--color-text-light);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.85rem;line-height:1.5;display:-webkit-box;overflow:hidden}.TutorialDetail-module__R4A76W__relatedCategory{text-transform:uppercase;letter-spacing:.04em;color:var(--color-light-green);border-radius:var(--radius-pill);background:#7dc57e1a;align-self:flex-start;padding:.2rem .6rem;font-size:.7rem;font-weight:600;display:inline-block}.TutorialDetail-module__R4A76W__relatedMeta{color:var(--color-text-light);margin-top:auto;font-size:.78rem}@media (max-width:1100px){.TutorialDetail-module__R4A76W__contentLayout{grid-template-columns:1fr}.TutorialDetail-module__R4A76W__tocSidebar{order:-1;margin-top:0;margin-bottom:1rem}.TutorialDetail-module__R4A76W__stickyWrapper{max-height:none;position:relative;top:0;overflow-y:visible}}@media (max-width:768px){.TutorialDetail-module__R4A76W__heroBanner{padding:3rem 1.5rem 2.5rem}.TutorialDetail-module__R4A76W__heroTitle{font-size:2.35rem;line-height:1.12}.TutorialDetail-module__R4A76W__container{padding:2rem 1rem 3rem}.TutorialDetail-module__R4A76W__article{margin-top:-1.5rem;padding:2rem 1.5rem}.TutorialDetail-module__R4A76W__downloadCta{text-align:left;flex-direction:column;align-items:flex-start}.TutorialDetail-module__R4A76W__authorCard{text-align:center;flex-direction:column}.TutorialDetail-module__R4A76W__navigation{flex-direction:column;align-items:flex-start}}@media (max-width:480px){.TutorialDetail-module__R4A76W__heroTitle{font-size:2rem}}