.tutorial-shell{max-width:1280px;margin:auto;padding:0 44px}.tutorial-hero{padding:72px 0 65px;border-bottom:1px solid var(--ink)}.tutorial-hero h1{font:400 clamp(3.3rem,8vw,7rem) 'Newsreader',Georgia,serif;line-height:.92;letter-spacing:-.06em;margin:20px 0}.tutorial-hero .lede{max-width:650px;color:#414940;font-size:1.15rem;line-height:1.65}.map{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line);padding:24px 0 35px;gap:12px}.map a{display:grid;grid-template-columns:34px 1fr;text-decoration:none;border-top:1px solid var(--line);padding:12px 0;column-gap:8px}.map a:hover{color:var(--accent)}.map span{font:.72rem 'DM Mono',monospace;color:var(--muted)}.map strong{font:400 1.3rem 'Newsreader',Georgia,serif}.map small{grid-column:2;color:var(--muted);line-height:1.45;margin-top:3px}.chapter{display:grid;grid-template-columns:180px minmax(0,850px);gap:35px;border-bottom:1px solid var(--line);padding:58px 0}.chapter-label{font:.7rem 'DM Mono',monospace;color:var(--green);letter-spacing:.06em}.chapter-copy h2{font:400 2.65rem 'Newsreader',Georgia,serif;letter-spacing:-.04em;margin:0 0 13px}.chapter-copy>p{color:#414940;line-height:1.75;max-width:760px}.chapter code,.annotation code{font-family:'DM Mono',monospace;color:#a8482c;font-size:.88em}.pipeline{display:grid;grid-template-columns:1fr 22px 1fr 22px 1fr 22px 1fr;align-items:center;margin:28px 0 19px}.pipeline div{background:var(--sheet);border:1px solid var(--line);padding:16px 10px;min-height:80px}.pipeline b,.pipeline span{display:block}.pipeline b{font:.76rem 'DM Mono',monospace;text-transform:uppercase}.pipeline span{font-size:.77rem;color:var(--muted);margin-top:8px}.pipeline i{text-align:center;color:var(--accent);font-size:1.2rem}.annotation{border-left:2px solid var(--accent);padding:8px 14px;background:var(--sheet);font-size:.85rem;line-height:1.6;color:#505850}.lab-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.controls,.readout,.target-lab,.choreo-lab,.sound-lab,.network-lab{background:var(--sheet);border:1px solid var(--line);padding:18px}.controls label,.sound-lab label,.network-lab label,.pose-sliders label{display:grid;grid-template-columns:125px 1fr 54px;align-items:center;gap:9px;font:.74rem 'DM Mono',monospace;margin:14px 0}.controls output,.sound-lab output,.network-lab output{color:var(--accent);text-align:right}.readout p{margin:0 0 14px}.readout p span{display:block;font:.68rem 'DM Mono',monospace;text-transform:uppercase;color:var(--muted)}.readout p strong{display:block;font:.9rem 'DM Mono',monospace;margin-top:6px;word-break:break-word}.mini-scene{height:135px;background:#e6e9e1;position:relative;border:1px solid var(--line);overflow:hidden}.mini-scene:after{content:'';position:absolute;left:50%;top:0;bottom:0;border-left:1px dashed #b5bbb1}.mini-scene i{position:absolute;width:14px;height:14px;border-radius:50%;transform:translate(-50%,-50%);top:55%;transition:left .15s,top .15s}.mini-scene #head-dot{background:var(--green);width:10px;height:10px;top:50%}.mini-scene #hand-dot{background:var(--accent)}.mini-scene em{font:.63rem 'DM Mono',monospace;color:var(--muted);position:absolute;bottom:8px;left:9px}.target-lab>label{display:grid;grid-template-columns:125px 1fr 60px;gap:10px;align-items:center;font:.74rem 'DM Mono',monospace}.target-lab output{color:var(--accent);text-align:right}.target-track{height:28px;background:#dfe2db;margin:28px 0 16px;position:relative;border-left:3px solid var(--green);border-right:3px solid var(--green)}.target-track i{position:absolute;left:13%;top:50%;width:17px;height:17px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%);transition:left .15s}.target-track b{position:absolute;left:47%;top:-7px;height:40px;border-left:1px solid var(--ink)}.target-track span{position:absolute;top:32px;font:.62rem 'DM Mono',monospace;color:var(--muted)}.target-track span:last-child{right:0}.target-lab>strong{font:.8rem 'DM Mono',monospace;color:var(--green)}.target-lab>p{margin:8px 0 0;font-size:.88rem}.formula{display:flex;justify-content:space-between;gap:15px;background:#e6e9e1;padding:13px 15px;margin:18px 0;font-size:.78rem}.formula span{color:var(--muted)}.choreo-lab{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.pose-sliders button,.sound-lab button,.network-lab button{border:1px solid var(--ink);background:transparent;padding:10px 12px;cursor:pointer;font:.72rem 'DM Mono',monospace;margin:5px 5px 0 0}.pose-sliders .button-strong,.sound-lab .button-strong{background:var(--ink);color:var(--sheet)}pre{background:#282e29;color:#eef0e7;min-height:130px;margin:0;padding:15px;font:.78rem 'DM Mono',monospace;line-height:1.65;overflow:auto}.sound-lab{margin:20px 0}.beat-strip{height:32px;display:grid;grid-template-columns:repeat(8,1fr);gap:3px;margin-top:19px}.beat-strip i{background:#d2d7ce}.beat-strip i.active{background:var(--accent)}.network-lab{max-width:620px;margin:20px 0}.network-row{display:grid;grid-template-columns:110px 70px 1fr;align-items:center;gap:10px;margin:15px 0;font:.75rem 'DM Mono',monospace}.network-row b{color:var(--green)}.network-row i{height:10px;background:var(--accent);display:block;transform-origin:left;transition:width .25s}.network-row.remote i{background:#66849a}.network-lab>label{grid-template-columns:125px 1fr 55px}.site-footer{margin-top:0}@media(max-width:750px){.tutorial-shell{padding:0 20px}.map{grid-template-columns:1fr 1fr}.chapter{grid-template-columns:1fr;gap:14px;padding:43px 0}.pipeline{grid-template-columns:1fr;gap:5px}.pipeline i{transform:rotate(90deg)}.lab-grid,.choreo-lab{grid-template-columns:1fr}.chapter-copy h2{font-size:2.2rem}}@media(max-width:500px){.map{grid-template-columns:1fr}.controls label,.sound-lab label,.network-lab label,.pose-sliders label{grid-template-columns:105px 1fr 50px}.formula{display:block}.formula span{display:block;margin-top:8px}}
