.tutorial-hero{padding:72px 0 50px;background:linear-gradient(180deg,#fff7f0 0%,#fff 100%)}.tutorial-hero .title{font-size:clamp(2rem,4vw,3.7rem);line-height:1.08;margin-bottom:18px}.tutorial-hero p{font-size:1.08rem;max-width:780px}.tutorial-breadcrumb{margin-bottom:18px}.tutorial-breadcrumb ol{list-style:none;display:flex;gap:9px;flex-wrap:wrap;padding:0;margin:0;color:#666}.tutorial-breadcrumb li+li:before{content:"/";margin-right:9px;color:#aaa}.tutorial-section{padding:58px 0}.tutorial-section.alt{background:#fafafa}.tutorial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.tutorial-card{height:100%;border:1px solid #ececec;border-radius:14px;padding:24px;background:#fff;box-shadow:0 10px 35px rgba(20,20,20,.04)}.tutorial-card h3{font-size:1.25rem;margin-bottom:10px}.tutorial-card p{margin-bottom:16px;color:#5c5c5c}.tutorial-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:13px}.tutorial-pill{font-size:.78rem;border-radius:999px;padding:5px 10px;background:#fff1e8;color:#a74700}.tutorial-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:42px}.tutorial-sidebar{position:sticky;top:110px;align-self:start;border:1px solid #ececec;border-radius:14px;padding:20px;background:#fff}.tutorial-sidebar ul{list-style:none;padding:0;margin:0}.tutorial-sidebar li{border-bottom:1px solid #f1f1f1}.tutorial-sidebar li:last-child{border-bottom:0}.tutorial-sidebar a{display:block;padding:10px 4px}.tutorial-content h2{margin-top:34px}.tutorial-content h3{margin-top:28px}.tutorial-code{background:#171717;color:#f8f8f2;border-radius:12px;padding:18px;overflow:auto;font-size:.93rem;line-height:1.6}.tutorial-note{border-left:4px solid #f28c28;background:#fff7ef;padding:16px 18px;border-radius:8px;margin:20px 0}.tutorial-practice{border:1px dashed #d9a56f;background:#fffdf9;padding:20px;border-radius:12px;margin-top:24px}.tutorial-list{padding-left:20px}.tutorial-next{display:flex;justify-content:space-between;gap:16px;margin-top:36px;padding-top:22px;border-top:1px solid #eee}.tutorial-roadmap{columns:3;column-gap:30px}.tutorial-roadmap li{break-inside:avoid;margin:0 0 9px}.tutorial-search{max-width:620px;margin-top:24px}.tutorial-search input{width:100%;height:52px;border:1px solid #ddd;border-radius:10px;padding:0 16px}.tutorial-empty{display:none}.tutorial-source-note{font-size:.9rem;color:#6d6d6d;margin-top:18px}.tutorial-course-cta{border-radius:14px;padding:24px;background:#191919;color:#fff;margin-top:34px}.tutorial-course-cta h3,.tutorial-course-cta p{color:#fff}.tutorial-course-cta a{color:#fff;text-decoration:underline}@media(max-width:991px){.tutorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tutorial-layout{grid-template-columns:1fr}.tutorial-sidebar{position:static}.tutorial-roadmap{columns:2}}@media(max-width:575px){.tutorial-hero{padding:48px 0 34px}.tutorial-section{padding:42px 0}.tutorial-grid{grid-template-columns:1fr}.tutorial-roadmap{columns:1}.tutorial-next{flex-direction:column}}