:root{--tm-ink:#102740;--tm-copy:#4f6272;--tm-line:#dce3e5;--tm-paper:#fbfaf5;--tm-teal:#087c78;--tm-yellow:#f5bf18}
.tutorial-manual{color:var(--tm-ink);background:var(--tm-paper)}
.tutorial-hero{padding:clamp(76px,10vw,132px) 0;color:#fff;background:linear-gradient(125deg,#102740,#123c4b 62%,#0b6b68)}
.tutorial-hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:clamp(50px,8vw,110px);align-items:end}
.tutorial-hero .sf-kicker{color:#75e0d7}.tutorial-hero h1{max-width:920px;margin:12px 0 24px;font-size:clamp(48px,6.5vw,92px);line-height:.98;letter-spacing:-.055em}.tutorial-hero-lede{max-width:780px;color:#c7d5dc;font-size:clamp(18px,2vw,22px);line-height:1.65}.tutorial-hero .sf-actions{margin-top:34px}.tutorial-hero .sf-button-secondary,.tutorial-complete .sf-button-secondary{color:#fff!important;border-color:rgba(255,255,255,.45)!important;background:transparent!important}
.tutorial-hero-summary{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.2);border-radius:16px;background:rgba(4,19,29,.28);overflow:hidden}.tutorial-hero-summary div{min-height:145px;padding:28px;border-right:1px solid rgba(255,255,255,.16);border-bottom:1px solid rgba(255,255,255,.16)}.tutorial-hero-summary div:nth-child(2n){border-right:0}.tutorial-hero-summary div:nth-last-child(-n+2){border-bottom:0}.tutorial-hero-summary strong,.tutorial-hero-summary span{display:block}.tutorial-hero-summary strong{color:var(--tm-yellow);font-size:52px}.tutorial-hero-summary span{margin-top:12px;color:#d4e0e5;font-size:12px;line-height:1.4;letter-spacing:.08em;text-transform:uppercase}
.tutorial-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:clamp(52px,7vw,104px);align-items:start;padding-top:72px;padding-bottom:130px}.tutorial-sidebar{position:sticky;top:88px;max-height:calc(100dvh - 112px);overflow:auto;border:1px solid var(--tm-line);border-radius:14px;background:#fff;scrollbar-width:thin}.tutorial-sidebar-head{position:sticky;top:0;z-index:2;padding:19px 20px 16px;border-bottom:1px solid var(--tm-line);background:var(--tm-ink)}.tutorial-sidebar-head span,.tutorial-sidebar-head strong{display:block}.tutorial-sidebar-head span{color:#75e0d7;font-size:10px;font-weight:900;letter-spacing:.15em}.tutorial-sidebar-head strong{margin-top:7px;overflow:hidden;color:#fff;font-size:14px;text-overflow:ellipsis;white-space:nowrap}
.tutorial-toc{display:grid;padding:8px 0 14px}.tutorial-toc a{position:relative;color:#526573;text-decoration:none;transition:.18s}.tutorial-toc a:hover{color:var(--tm-teal);background:#f1f7f5}.tutorial-toc-chapter{display:grid;grid-template-columns:28px 1fr;gap:7px;margin-top:7px;padding:12px 18px;font-size:13px;font-weight:900}.tutorial-toc-chapter span{color:var(--tm-teal);font-size:10px}.tutorial-toc-sub{padding:7px 18px 7px 53px;font-size:12px;line-height:1.35}.tutorial-toc a.is-current-chapter{color:var(--tm-ink)}.tutorial-toc a.is-active{color:var(--tm-teal);background:#e8f3f0}.tutorial-toc a.is-active:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--tm-yellow)}.tutorial-progress{position:sticky;bottom:0;height:5px;background:#dfe8e6}.tutorial-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--tm-teal),var(--tm-yellow))}
.tutorial-content{min-width:0;max-width:940px}.tutorial-content [id]{scroll-margin-top:112px}.tutorial-introduction{padding:clamp(36px,5vw,58px);border:1px solid var(--tm-line);border-radius:18px;background:#fff}.tutorial-introduction h2{max-width:760px;margin:10px 0 20px;font-size:clamp(36px,5vw,58px);line-height:1.02;letter-spacing:-.045em}.tutorial-introduction>p:last-of-type{color:var(--tm-copy);font-size:18px;line-height:1.7}
.tutorial-requirements{display:grid;gap:1px;margin-top:34px;overflow:hidden;border:1px solid var(--tm-line);border-radius:10px;background:var(--tm-line)}.tutorial-requirements div{display:grid;grid-template-columns:110px 1fr;gap:18px;padding:18px;background:#f8faf8}.tutorial-requirements span,.tutorial-card-grid span{color:var(--tm-teal);font-size:10px;font-weight:900;letter-spacing:.12em}.tutorial-requirements strong{font-size:14px;line-height:1.45}
.tutorial-chapter{padding-top:116px}.tutorial-chapter-head{padding-bottom:42px;border-bottom:2px solid var(--tm-ink)}.tutorial-chapter-head>span{color:var(--tm-teal);font-size:11px;font-weight:900;letter-spacing:.15em}.tutorial-chapter-head h2{max-width:850px;margin:14px 0 20px;font-size:clamp(42px,5.5vw,68px);line-height:1;letter-spacing:-.05em}.tutorial-chapter-head p{max-width:790px;margin:0;color:var(--tm-copy);font-size:18px;line-height:1.7}
.tutorial-step{display:grid;grid-template-columns:72px minmax(0,1fr);gap:28px;padding-top:68px}.tutorial-step-number{padding-top:7px;color:var(--tm-teal);font-size:13px;font-weight:900;letter-spacing:.1em}.tutorial-step h3{margin:0 0 18px;font-size:clamp(28px,3.2vw,42px);line-height:1.08;letter-spacing:-.035em}.tutorial-step p,.tutorial-step li{color:var(--tm-copy);font-size:16px;line-height:1.75}
.tutorial-actions,.tutorial-checklist{display:grid;gap:12px;margin:28px 0 0;padding:0;list-style:none}.tutorial-actions{counter-reset:action}.tutorial-actions li,.tutorial-checklist li{position:relative;margin:0;padding:16px 18px 16px 52px;border:1px solid var(--tm-line);border-radius:9px;background:#fff}.tutorial-actions li:before{counter-increment:action;content:counter(action)}.tutorial-checklist li:before{content:"✓"}.tutorial-actions li:before,.tutorial-checklist li:before{position:absolute;left:17px;top:17px;display:grid;place-items:center;width:22px;height:22px;color:#fff;font-size:10px;font-weight:900;border-radius:50%;background:var(--tm-teal)}
.tutorial-note{margin-top:28px;padding:22px 24px;border-left:5px solid var(--tm-yellow);background:#fff8dd}.tutorial-note strong{font-size:12px;letter-spacing:.08em;text-transform:uppercase}.tutorial-note p{margin:8px 0 0;color:#5e5b4d}
.tutorial-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:28px}.tutorial-card-grid.tutorial-four{grid-template-columns:1fr 1fr}.tutorial-card-grid article,.tutorial-two-up>div{padding:24px;border:1px solid var(--tm-line);border-radius:11px;background:#fff}.tutorial-card-grid h4{margin:24px 0 10px;font-size:18px}.tutorial-card-grid p,.tutorial-two-up p{margin:0;color:var(--tm-copy);font-size:13px;line-height:1.6}
.tutorial-figure{margin:56px 0 12px 100px;padding:12px;border:1px solid var(--tm-line);border-radius:14px;background:#fff;box-shadow:0 20px 55px rgba(16,39,64,.08)}.tutorial-figure img{display:block;width:100%;height:auto;border:1px solid #e3e8e9;border-radius:8px}.tutorial-figure figcaption{display:grid;gap:5px;padding:18px 8px 8px}.tutorial-figure figcaption span{color:var(--tm-teal);font-size:10px;font-weight:900;letter-spacing:.12em}.tutorial-figure figcaption strong{font-size:14px;line-height:1.45}.tutorial-figure figcaption small{color:#70818d}
.tutorial-formula{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:28px;padding:24px;color:#fff;border-radius:11px;background:var(--tm-ink)}.tutorial-formula span{font-size:11px;font-weight:900;letter-spacing:.1em}.tutorial-formula i{color:var(--tm-yellow);font-style:normal;font-weight:900}.tutorial-step blockquote{margin:18px 0 0;padding:28px;color:var(--tm-ink);font-size:19px;font-weight:700;line-height:1.6;border:1px solid #9ed4cd;border-radius:11px;background:#eaf7f4}.tutorial-two-up{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.tutorial-two-up strong{display:block;margin-bottom:8px}
.tutorial-table-wrap{margin-top:30px;overflow-x:auto;border:1px solid var(--tm-line);border-radius:10px;background:#fff}.tutorial-table-wrap table{width:100%;min-width:680px;border-collapse:collapse}.tutorial-table-wrap th,.tutorial-table-wrap td{padding:16px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--tm-line)}.tutorial-table-wrap th{color:#fff;font-size:11px;letter-spacing:.07em;background:var(--tm-ink)}.tutorial-table-wrap td{color:var(--tm-copy);font-size:13px;line-height:1.55}.tutorial-table-wrap tr:last-child td{border-bottom:0}
.tutorial-template{display:grid;gap:1px;margin-top:28px;overflow:hidden;border:1px solid var(--tm-line);border-radius:11px;background:var(--tm-line)}.tutorial-template div{display:grid;grid-template-columns:48px 180px 1fr;gap:16px;align-items:center;padding:18px;background:#fff}.tutorial-template span{color:var(--tm-teal);font-size:11px;font-weight:900}.tutorial-template p{margin:0;font-size:13px;line-height:1.5}
.tutorial-priority{display:grid;grid-template-columns:repeat(4,1fr);margin-top:28px;overflow:hidden;border:1px solid var(--tm-line);border-radius:11px}.tutorial-priority div{min-height:180px;padding:24px;border-right:1px solid var(--tm-line);background:#fff}.tutorial-priority div:last-child{border-right:0}.tutorial-priority strong,.tutorial-priority span{display:block}.tutorial-priority strong{color:var(--tm-yellow);font-size:38px}.tutorial-priority span{margin-top:24px;color:var(--tm-copy);font-size:13px;line-height:1.55}
.tutorial-routine{display:grid;grid-template-columns:repeat(5,1fr);margin-top:30px;overflow:hidden;border:1px solid var(--tm-line);border-radius:11px}.tutorial-routine article{min-height:250px;padding:22px;border-right:1px solid var(--tm-line);background:#fff}.tutorial-routine article:last-child{border-right:0}.tutorial-routine span{color:var(--tm-teal);font-size:10px;font-weight:900}.tutorial-routine strong{display:block;margin-top:48px;font-size:17px;line-height:1.25}.tutorial-routine p{font-size:12px;line-height:1.55}
.tutorial-complete{margin-top:50px;padding:clamp(34px,5vw,58px);color:#fff;text-align:center;border-radius:16px;background:linear-gradient(125deg,#102740,#0b6b68)}.tutorial-complete .sf-kicker{color:#75e0d7}.tutorial-complete h3{max-width:680px;margin:12px auto 18px;font-size:clamp(34px,4.5vw,54px)}.tutorial-complete>p:not(.sf-kicker){color:#c7d5dc}.tutorial-complete .sf-actions{justify-content:center;margin-top:28px}
@media(max-width:1080px){.tutorial-hero-grid{grid-template-columns:1fr}.tutorial-hero-summary{max-width:700px}.tutorial-layout{grid-template-columns:230px minmax(0,1fr);gap:42px}.tutorial-routine{grid-template-columns:1fr 1fr}.tutorial-routine article{min-height:190px;border-bottom:1px solid var(--tm-line)}.tutorial-routine article:nth-child(2n){border-right:0}}
@media(max-width:820px){.tutorial-layout{display:block;padding-top:0}.tutorial-sidebar{position:sticky;top:0;z-index:50;max-height:none;margin:0 calc(50% - 50vw) 52px;overflow:hidden;border-width:0 0 1px;border-radius:0}.tutorial-sidebar-head{display:flex;align-items:center;justify-content:space-between;padding:10px 18px}.tutorial-sidebar-head strong{max-width:65%;margin:0}.tutorial-toc{display:flex;overflow-x:auto;padding:0;scrollbar-width:none}.tutorial-toc a{flex:0 0 auto;white-space:nowrap}.tutorial-toc-chapter{display:block;margin:0;padding:13px 16px}.tutorial-toc-chapter span{margin-right:7px}.tutorial-toc-sub{padding:13px 16px}.tutorial-toc a.is-active:before{inset:auto 0 0;width:auto;height:4px}.tutorial-progress{height:4px}.tutorial-content [id]{scroll-margin-top:116px}.tutorial-figure{margin-left:0}.tutorial-priority{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.tutorial-hero{padding:68px 0}.tutorial-hero h1{font-size:clamp(43px,13vw,62px)}.tutorial-hero-summary div{min-height:125px;padding:20px}.tutorial-introduction{padding:28px 22px}.tutorial-requirements div{grid-template-columns:1fr;gap:7px}.tutorial-chapter{padding-top:86px}.tutorial-step{display:block;padding-top:54px}.tutorial-step-number{display:block;margin-bottom:12px}.tutorial-card-grid,.tutorial-card-grid.tutorial-four,.tutorial-two-up{grid-template-columns:1fr}.tutorial-template div{grid-template-columns:38px 1fr}.tutorial-template p{grid-column:2}.tutorial-formula{flex-wrap:wrap}.tutorial-priority,.tutorial-routine{grid-template-columns:1fr}.tutorial-priority div,.tutorial-routine article{min-height:0;border-right:0;border-bottom:1px solid var(--tm-line)}}