.tutorial-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}.tutorial-heading .button{gap:9px;min-height:44px;font-size:14px;padding:10px 20px}.tutorial-heading .icon{width:19px;height:19px}.browser-lessons{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap}.browser-lessons button{display:flex;align-items:center;gap:9px;padding:12px 20px;border:1px solid var(--line);background:var(--paper);border-radius:8px;font-size:13px;color:var(--ink)}.browser-lessons img{width:24px;height:24px;object-fit:contain}.browser-lessons [aria-pressed=true],.lesson-filters [aria-pressed=true]{color:var(--accent);border-color:#ffc8b8;background:#fff1eb}.lesson-workspace{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px;align-items:start}.lesson-viewer{min-width:0;background:var(--paper);border:1px solid var(--line);border-radius:12px;overflow:hidden}.lesson-heading{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;gap:16px}.lesson-heading p{font-size:11px;color:var(--muted);margin-bottom:4px}.lesson-heading h2{font-size:19px;line-height:1.5;letter-spacing:0}.lesson-medium{font-size:11px;color:var(--muted);white-space:nowrap}.lesson-screen{background:#17191e;aspect-ratio:16/9}.lesson-screen video{display:block;width:100%;height:100%;object-fit:contain}.lesson-caption{font-size:12px;color:var(--muted);padding:14px 22px;line-height:1.8}.lesson-bottom{display:flex;justify-content:space-between;align-items:center;padding:12px 22px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.lesson-bottom button,.install-followthrough button,#lesson-retry{border:0;background:none;color:var(--accent);font:inherit;padding:5px 0}.lesson-bottom button:disabled{color:var(--muted);opacity:.5;cursor:default}.lesson-sidebar{min-width:0}.lesson-sidebar>h2{font-size:14px;letter-spacing:0;margin:4px 0 14px}.lesson-list{display:flex;flex-direction:column;gap:6px;max-height:520px;overflow:auto}.lesson-list button{display:flex;align-items:center;gap:12px;width:100%;padding:13px 12px;border:1px solid transparent;background:transparent;border-radius:7px;text-align:left;font-size:13px;line-height:1.5;color:var(--ink)}.lesson-list button>span:first-child{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.lesson-list button[aria-pressed=true]{background:#fff1eb;border-color:#ffdfd4;color:var(--accent)}.lesson-list button:hover{background:#fff1eb}.lesson-empty{font-size:13px;color:var(--muted);padding:20px 0}.tutorial-search{display:flex;align-items:center;gap:16px;margin-bottom:16px}.tutorial-search label{font-size:13px;color:var(--muted)}.tutorial-search input{width:min(380px,100%);padding:11px 14px;border:1px solid var(--line);border-radius:8px;background:var(--paper);font:inherit;font-size:13px;color:var(--ink)}.tutorial-search input:focus{outline:2px solid #ffbba8;outline-offset:2px}.lesson-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}.lesson-filters button{border:1px solid var(--line);border-radius:7px;background:var(--paper);padding:9px 14px;font:inherit;font-size:12px;color:var(--muted)}.install-followthrough{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:28px;padding:24px 0;border-top:1px solid var(--line)}.install-followthrough>div>span{color:var(--accent);font-size:12px}.install-followthrough h2{font-size:15px;letter-spacing:0;margin:6px 0}.install-followthrough p,.install-followthrough button{font-size:12px;line-height:1.8;color:var(--muted)}.install-followthrough button{color:var(--accent);margin-top:6px}#lesson-error{font-size:13px;padding:14px 22px;background:#fff1eb}#lesson-error a{color:var(--accent)}
@media(max-width:767px){.tutorial-heading{gap:12px;align-items:flex-start;flex-direction:column;margin-bottom:20px}.tutorial-heading .info-heading{padding-bottom:0}.browser-lessons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}.browser-lessons button{justify-content:center;padding:10px 6px;font-size:11px;gap:6px}.browser-lessons img{width:20px;height:20px}.lesson-workspace{grid-template-columns:1fr;gap:20px}.lesson-heading{padding:14px 16px}.lesson-heading h2{font-size:16px}.lesson-caption,.lesson-bottom{padding:12px 16px}.lesson-sidebar>h2{margin-top:0}.lesson-list{max-height:320px}.lesson-list button{min-height:44px}.tutorial-search{align-items:flex-start;flex-direction:column;gap:8px}.tutorial-search input{width:100%}.lesson-filters{gap:6px}.lesson-filters button{font-size:11px;padding:9px 11px}.install-followthrough{grid-template-columns:1fr;gap:18px;margin-top:22px;padding:20px 0}.install-followthrough h2{display:inline-block;margin:0 0 5px 10px}.lesson-medium{display:none}}
