.filter-bar{display:flex;align-items:center;gap:18px;margin:20px 0}.filter-bar label{margin:0}.filter-bar select{max-width:240px}.video-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.video-card{padding:0 0 22px;overflow:hidden}.video-card>h3,.video-card>p,.video-card>small,.video-card>.source-link,.video-card>.actions,.video-card>button{margin-left:24px;margin-right:24px}.video-card>small{display:block;margin-top:20px}.video-cover{position:relative}.video-cover canvas{width:100%;display:block}.video-kind{position:absolute;left:18px;bottom:18px;padding:4px 12px;background:#fffdf2;border-radius:20px;font-size:11px}.video-card iframe{width:100%;height:280px;border:0;margin-top:16px}.source-link{display:inline-block;font-size:13px;margin-bottom:18px}.demo-note{background:#ebeade;border-left:3px solid #b79061;padding:14px 18px;margin:24px 0;font-size:12px;color:#716853}.tutorial-card canvas{width:100%;border-radius:8px;margin-bottom:15px}.tutorial-detail{margin-top:30px;background:#fffef9;border:1px solid var(--line);border-radius:12px;padding:30px;scroll-margin-top:20px}.tutorial-detail>small{color:var(--accent)}.materials{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.materials span{background:#ebeee1;padding:6px 12px;border-radius:20px;font-size:12px}.tutorial-steps{display:grid;gap:14px;margin-top:20px}.tutorial-step{display:grid;grid-template-columns:60px 1fr;border:1px solid var(--line);border-radius:10px;padding:20px;gap:12px}.step-number{font:30px Georgia,serif;color:#ac744e}.tutorial-step h3{margin:0;font-size:16px}.tutorial-step p{font-size:14px;color:#667469}.progress-label{color:var(--green);font-size:13px}.poster-panel{margin-top:24px}.poster-layout{display:grid;grid-template-columns:1fr 1fr;gap:30px}.poster-layout canvas{width:100%;max-width:440px;height:auto;box-shadow:0 10px 30px #23362c1a}.poster-layout button{margin-top:24px}.video-card .actions button{font-size:12px;padding:8px 12px}@media(max-width:800px){.video-grid,.poster-layout{grid-template-columns:1fr}}@media print{.sidebar,header,.hero,footer,#notice,#tutorialCards,.section-title,#videos,#studio,#library,#history,#posterPanel,.tutorial-detail .actions{display:none!important}main{margin:0;padding:0}.tutorial-detail{border:0;padding:0}.tutorial-step{break-inside:avoid}details{display:block}.tutorial-detail small{display:block}}
