.tutorial-hero{min-height:780px;padding:78px 0;display:grid;grid-template-columns:.85fr 1.15fr;gap:62px;align-items:center}.tutorial-copy h1{font-size:clamp(54px,5.8vw,86px);line-height:.95;letter-spacing:-.06em;margin:23px 0 25px}.tutorial-copy h1 span{color:#8d82f2}.tutorial-copy>p{max-width:585px;color:#aaa7b2;font-size:17px;line-height:1.72}.lesson-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:25px}.lesson-tags span{font-size:9px;color:#88848f;border:1px solid #292831;border-radius:99px;padding:7px 11px}.walkthrough{border:1px solid #302e39;border-radius:25px;background:linear-gradient(145deg,#111116,#070709);padding:25px;box-shadow:0 45px 95px rgba(0,0,0,.62)}.walk-head{display:flex;justify-content:space-between;align-items:start;padding-bottom:18px;border-bottom:1px solid #27262e}.walk-head div{display:flex;flex-direction:column}.walk-head span,.walk-head b{font-size:9px;color:#7d7985;letter-spacing:.1em}.walk-head strong{font-size:18px;margin-top:5px}.walk-head b{color:#4bd99f}.walk-progress{display:flex;align-items:center;margin:22px 0}.walk-progress button{width:31px;height:31px;border-radius:50%;border:1px solid #393642;background:#121116;color:#77727f}.walk-progress button.active{background:#7669df;color:#fff;border-color:#9589ff}.walk-progress i{flex:1;height:1px;background:#302e37}.walk-screen{min-height:275px;border:1px solid #292731;border-radius:16px;background:#0c0c10;display:flex;flex-direction:column;align-items:center;text-align:center;padding:31px}.walk-icon{width:62px;height:62px;display:grid;place-items:center;border-radius:18px;background:rgba(108,89,224,.12);border:1px solid #3b3650;color:#a99fff;font-size:28px}.walk-screen>span{font-size:9px;color:#8e83f0;margin-top:20px}.walk-screen h3{font-size:25px;margin:7px 0 9px}.walk-screen>p{max-width:370px;color:#8c8993;font-size:12px}.walk-example{width:100%;margin-top:auto;display:flex;justify-content:space-between;padding:12px;border-top:1px solid #27252d;font-size:10px}.walk-example span{color:#77737e}.walk-actions{display:flex;justify-content:space-between;align-items:center;margin-top:12px}.walk-actions button{border:1px solid #2c2a33;background:#111116;color:#aaa6b0;border-radius:9px;padding:10px 13px}.walk-actions button:disabled{opacity:.35}.walk-actions span{font-size:10px;color:#77737e}.walk-note{font-size:9px;color:#6f6b75;margin:13px 0 0}.quick-answer{border-block:1px solid #1a191f;background:#070709}.quick-answer .shell{display:grid;grid-template-columns:.3fr 1.7fr;gap:55px;padding-block:45px}.quick-answer strong{font-size:9px;color:#9489f8}.quick-answer p{font-size:18px;line-height:1.65;margin:0;color:#d3d0d9}.steps-timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.steps-timeline article{min-height:270px;padding:22px;border:1px solid var(--line);border-radius:17px;background:#0b0b0e}.steps-timeline>article>span{font-size:10px;color:#8d81ed}.steps-timeline h3{font-size:20px;margin:60px 0 10px}.steps-timeline p{font-size:12px;color:#898690}.term-section,.mistake-section{background:#08080b;border-block:1px solid #19181e}.term-grid,.mistake-grid,.guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.term-grid article,.mistake-grid article{padding:24px;border:1px solid #292730;border-radius:18px;background:#0d0d11}.term-grid span{font-size:9px;color:#85818d}.term-grid strong{font-size:25px;display:block;margin:35px 0 14px}.term-grid p,.mistake-grid p{font-size:12px;color:#898690}.practice-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:75px}.practice-layout>div p{color:#97939e;line-height:1.7}.practice-layout ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.practice-layout li{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}.practice-layout b{font-size:12px}.practice-layout span{font-size:11px;color:#85818d}.mistake-grid article{min-height:250px}.mistake-grid b{font-size:10px;color:#887ce8}.mistake-grid h3{font-size:20px;margin:48px 0 12px}.guide-grid a{min-height:290px;padding:23px;border:1px solid var(--line);border-radius:18px;background:#0c0c10;text-decoration:none;display:flex;flex-direction:column}.guide-grid span{font-size:10px;color:#8f83ef}.guide-grid h3{font-size:22px;margin:50px 0 11px}.guide-grid p{font-size:12px;color:#898690}.guide-grid b{font-size:11px;margin-top:auto}.source-panel{border:1px solid var(--line);border-radius:20px;padding:28px;background:#08080b}.source-panel p,.source-panel li{color:#94919b}.source-panel a{color:#c7c0ff}.reviewed{font-size:10px;color:#88848f}.article-shell{padding-top:70px}.article-header{max-width:950px;padding:55px 0 70px}.article-header>a{font-size:11px;color:#9189df}.article-header .eyebrow{display:block;margin-top:52px}.article-header h1{font-size:clamp(49px,6vw,82px);line-height:.98;letter-spacing:-.055em;margin:19px 0 25px}.article-header>p{max-width:760px;font-size:19px;line-height:1.65;color:#aaa7b2}.article-meta{display:flex;gap:20px;flex-wrap:wrap;margin-top:27px;color:#77737e;font-size:10px}.article-grid{display:grid;grid-template-columns:230px minmax(0,760px);gap:80px;align-items:start;padding-bottom:110px}.article-grid aside{position:sticky;top:100px;display:flex;flex-direction:column;gap:13px;padding:20px;border:1px solid var(--line);border-radius:15px}.article-grid aside strong{font-size:10px;color:#958af5}.article-grid aside a{font-size:11px;text-decoration:none;color:#9c98a3}.article-grid aside .button{margin-top:8px;color:#08080a}.article-body section{padding:0 0 48px;margin-bottom:48px;border-bottom:1px solid var(--line)}.section-number{display:block;font-size:9px;color:#8b80ed;margin-bottom:10px}.article-body h2{font-size:34px;letter-spacing:-.035em;margin:0 0 20px}.article-body p,.article-body li{color:#a29fa9;font-size:16px;line-height:1.78}.article-body li+li{margin-top:10px}.lesson{margin:27px 0;padding:21px;border:1px solid #34313e;border-radius:14px;background:rgba(105,87,220,.08)}.lesson strong{color:#bbb2ff}.lesson p{margin-bottom:0}.source-note{padding:25px!important;border:1px solid var(--line)!important;border-radius:16px;background:#09090c}.source-note p{font-size:13px}
@media(max-width:1050px){.tutorial-hero{grid-template-columns:1fr;gap:50px}.steps-timeline{grid-template-columns:1fr 1fr}.term-grid,.mistake-grid,.guide-grid{grid-template-columns:1fr 1fr}.article-grid{grid-template-columns:190px minmax(0,1fr);gap:40px}}
@media(max-width:760px){.practice-layout{grid-template-columns:1fr;gap:35px}.article-grid{grid-template-columns:1fr}.article-grid aside{position:static;display:grid;grid-template-columns:1fr 1fr}.article-grid aside strong,.article-grid aside .button{grid-column:1/-1}.article-shell{padding-top:20px}.article-header{padding-top:35px}}
@media(max-width:620px){.tutorial-hero{padding:55px 0}.tutorial-copy h1{font-size:49px}.walkthrough{padding:18px}.walk-head{gap:12px}.walk-head b{text-align:right}.quick-answer .shell{grid-template-columns:1fr;gap:15px}.quick-answer p{font-size:16px}.steps-timeline,.term-grid,.mistake-grid,.guide-grid{grid-template-columns:1fr}.article-header h1{font-size:46px}.article-header>p{font-size:16px}.article-grid aside{grid-template-columns:1fr}.article-grid aside strong,.article-grid aside .button{grid-column:auto}.article-body h2{font-size:29px}}
.walk-screen h2{font-size:25px;margin:7px 0 9px}.walk-example span{color:#827e89}