.tutorial-main{max-width:940px}.tutorial-heading{padding:28px 0 26px}.back-link{display:inline-flex;align-items:center;gap:3px;min-height:40px;color:var(--muted);font-size:13px;font-weight:600;margin-bottom:8px}.back-link svg{width:17px;height:17px}.tutorial-heading h1{font-size:32px;font-weight:780;line-height:1.3}.guide-layout{display:grid;grid-template-columns:minmax(0,390px) minmax(0,1fr);gap:22px;align-items:start}.video-section{min-width:0;background:#fff;border-radius:26px;padding:20px}.video-heading{display:flex;align-items:center;gap:9px;margin-bottom:16px}.video-heading h2{font-size:19px;line-height:1.4;font-weight:730}.player-wrap{width:min(100%,350px);margin-inline:auto;aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:#222930}.player-wrap video{display:block;width:100%;height:100%;object-fit:contain}.player-wrap video:focus-visible{outline:3px solid #7c96f5;outline-offset:-4px}.quick-steps{background:#fff;padding:26px 28px;border-radius:26px}.steps-heading{display:block}.steps-heading h2{font-size:21px;font-weight:750;line-height:1.4}.steps-heading>a{display:flex;align-items:center;gap:5px;min-height:44px;color:var(--accent);font-size:13px;font-weight:650}.steps-heading svg,.setup-steps svg{width:16px;height:16px}.setup-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:21px 0 25px;padding:0;list-style:none}.setup-steps li{min-width:0}.setup-steps li>span{display:grid;place-items:center;width:27px;height:27px;background:#eef2f9;color:#617087;border-radius:50%;font-size:12px;font-weight:700;margin-bottom:12px}.setup-steps strong{display:block;font-size:15px;line-height:1.5;font-weight:680;letter-spacing:-.025em}.setup-steps p{font-size:13px;line-height:1.6;margin-top:6px;color:var(--muted)}.setup-steps a{display:inline-flex;align-items:center;gap:4px;color:var(--accent);font-size:13px;font-weight:650;min-height:36px;margin-top:2px}.steps-bottom{display:flex;align-items:stretch;flex-direction:column;gap:16px}.steps-bottom>p{font-size:12px;line-height:1.6;color:var(--muted)}.steps-bottom .button{min-height:46px;font-size:14px;padding:11px 18px;flex:none}.music-credits{margin-top:22px;font-size:12px;line-height:1.7;color:var(--muted)}.music-credits summary{cursor:pointer;min-height:44px;width:fit-content;padding:11px 0}.music-credits a{text-decoration:underline;text-underline-offset:3px}.music-credits p+p{margin-top:5px}.tutorial-main .footer{margin-top:25px}.nav .nav-cta{display:block}
@media(max-width:760px){.guide-layout{grid-template-columns:1fr;max-width:500px;margin-inline:auto}.setup-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}.video-heading{gap:7px}.video-heading h2{font-size:16px}.video-section{padding:16px}.steps-bottom{align-items:flex-start;flex-direction:column}.steps-bottom .button{width:100%}}
@media(max-width:560px){html{scroll-padding-top:80px}.wrap{width:calc(100% - 32px)}.tutorial-heading{padding:17px 3px 20px}.tutorial-heading h1{font-size:28px}.back-link{margin-bottom:3px}.guide-layout{gap:18px}.video-section{padding:18px;border-radius:24px}.video-heading{margin-bottom:14px}.video-heading h2{font-size:19px}.player-wrap{width:min(100%,calc(68svh * .5625));min-width:min(100%,230px);border-radius:16px}.quick-steps{padding:22px;border-radius:24px}.steps-heading{display:block}.steps-heading h2{font-size:21px}.steps-heading>a{width:fit-content;margin-top:3px}.setup-steps{gap:22px 17px;margin-top:15px}.setup-steps li>span{margin-bottom:9px}.setup-steps strong{font-size:14px}.setup-steps p{font-size:12px}.tutorial-main .footer{padding-bottom:max(30px,env(safe-area-inset-bottom));font-size:11px}.nav>a{padding:11px 10px}.nav .nav-cta{padding:11px 14px}.header-inner{gap:10px}}
@media(max-width:360px){.nav>a:first-child{display:none}.quick-steps{padding:20px}.steps-heading h2{font-size:20px}.setup-steps{grid-template-columns:1fr}.setup-steps li{display:flex;gap:12px}.setup-steps li>span{flex:none;margin:0}.setup-steps strong{font-size:15px}.setup-steps p{font-size:13px}}
.keyword-route{margin:0 0 22px;padding:17px 19px;border-radius:16px;background:var(--soft)}.keyword-route strong{font-size:15px;color:#344e95;font-weight:700}.keyword-route p{margin-top:6px;color:#476098;font-size:14px;line-height:1.6}.keyword-route b{font-weight:700}.keyword-route>span{display:block;margin-top:5px;font-size:12px;color:#62769e;line-height:1.6}.back-link:hover,.steps-heading>a:hover,.setup-steps a:hover{color:var(--accent-dark)}
@media(max-width:560px){.keyword-route{padding:16px}.keyword-route p{font-size:13px}.keyword-route>span{font-size:11px}}