.tutorial-shell{min-height:100vh}
.tutorial-content{position:relative;z-index:1;width:min(1120px,calc(100% - 40px));margin:0 auto;padding:58px 0 90px}
.tutorial-coming-soon{display:flex;min-height:calc(100vh - 150px);flex-direction:column;align-items:flex-start;justify-content:center}
.tutorial-coming-soon h1{max-width:900px;margin:10px 0 30px;font-size:clamp(52px,8vw,96px);letter-spacing:-.065em;line-height:.94}
.tutorial-hero{max-width:850px;padding:48px 0 70px}
.tutorial-hero h1{max-width:780px;margin:10px 0 18px;font-size:clamp(52px,8vw,96px);letter-spacing:-.065em;line-height:.94}
.tutorial-hero>p:last-of-type{max-width:720px;color:#a5b5b8;font-size:clamp(16px,2vw,20px);line-height:1.65}
.tutorial-hero-actions,.tutorial-finish>div{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.tutorial-step{display:grid;grid-template-columns:72px minmax(0,1fr) minmax(280px,.72fr);gap:30px;align-items:start;padding:38px 0;border-top:1px solid rgba(123,244,207,.2)}
.tutorial-step-number{color:#53696d;font:900 13px/1 monospace;letter-spacing:.12em;padding-top:7px}
.tutorial-step h2{margin:7px 0 12px;font-size:clamp(28px,4vw,46px);letter-spacing:-.04em}
.tutorial-step p:not(.auth-kicker){max-width:610px;margin:0;color:#9cafb2;font-size:15px;line-height:1.72}
.tutorial-demo{display:grid;gap:8px;min-height:150px;padding:22px;border:1px solid rgba(123,244,207,.23);background:linear-gradient(145deg,rgba(16,33,37,.94),rgba(8,18,21,.96))}
.tutorial-demo-label{color:#7bf4cf;font:900 10px/1.2 monospace;letter-spacing:.12em}
.tutorial-demo strong{align-self:end;color:#effffc;font-size:18px;line-height:1.3}
.tutorial-demo small{color:#83979a;font-size:12px;line-height:1.55}
.tutorial-stage-demo{align-content:center;grid-template-columns:1fr 1fr;gap:13px;color:#dcebea;font:800 12px/1.3 Arial,Helvetica,sans-serif}
.tutorial-rules-link{display:inline-block;margin-top:16px;color:#7bf4cf;font:900 11px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.08em;text-decoration:none}
.tutorial-rules-link:hover,.tutorial-rules-link:focus-visible{color:#fff;text-decoration:underline;text-underline-offset:4px}
.tutorial-finish{margin-top:46px;padding:44px;border:1px solid rgba(123,244,207,.28);background:radial-gradient(circle at 88% 20%,rgba(62,218,193,.12),transparent 25rem),#0a171a}
.tutorial-finish h2{max-width:720px;margin:9px 0 0;font-size:clamp(34px,5vw,58px);letter-spacing:-.05em}
.tutorial-finish>p:not(.auth-kicker){max-width:720px;color:#9cafb2;line-height:1.7}.shortcut-group{padding:40px 0;border-top:1px solid rgba(123,244,207,.2)}.shortcut-group>header{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}.shortcut-group h2{margin:7px 0 0;font-size:clamp(32px,5vw,52px);letter-spacing:-.045em}.shortcut-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.shortcut-grid article{min-height:190px;padding:22px;border:1px solid rgba(123,244,207,.2);background:linear-gradient(145deg,rgba(16,33,37,.94),rgba(8,18,21,.96))}.shortcut-grid article>div{display:flex;min-height:38px;align-items:center;gap:8px;color:#72888c;font:800 11px/1.3 Arial,Helvetica,sans-serif;text-transform:uppercase}.shortcut-grid kbd{display:inline-flex;min-width:34px;min-height:32px;align-items:center;justify-content:center;padding:6px 9px;border:1px solid rgba(123,244,207,.4);border-bottom-width:3px;background:#071013;color:#7bf4cf;font:900 12px/1 monospace;box-shadow:0 6px 16px rgba(0,0,0,.22)}.shortcut-grid h3{margin:20px 0 8px;color:#effffc;font-size:20px}.shortcut-grid p{margin:0;color:#879a9d;font-size:13px;line-height:1.55}
@media(max-width:820px){.tutorial-content{padding-top:34px}.tutorial-hero{padding:35px 0 52px}.tutorial-step{grid-template-columns:42px 1fr}.tutorial-demo{grid-column:2}.tutorial-finish{padding:30px}}
@media(max-width:900px){.shortcut-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.tutorial-content{width:min(100% - 28px,1120px)}.tutorial-hero h1{font-size:48px}.tutorial-step{grid-template-columns:1fr;gap:15px;padding:30px 0}.tutorial-step-number{padding:0}.tutorial-demo{grid-column:auto;min-height:130px}.tutorial-stage-demo{grid-template-columns:1fr}.tutorial-finish{padding:24px}.tutorial-hero-actions .button,.tutorial-finish .button{width:100%;justify-content:center}.shortcut-grid{grid-template-columns:1fr}.shortcut-grid article{min-height:160px}.shortcut-group>header{align-items:start;flex-direction:column}}
