.visual-manual { margin-top:34px; }
.visual-manual h2 { margin-bottom:16px; }
.visual-manual figure { margin:0; padding:18px; background:var(--surface); border:1px solid var(--border); border-radius:10px; }
.visual-manual img { display:block; width:100%; height:auto; border:1px solid var(--border); border-radius:8px; background:var(--bg); }
.visual-manual figcaption { margin-top:14px; color:var(--text-dim); font-size:14px; line-height:1.7; }
.manual-shot { position:relative; }
.manual-mark { position:absolute; left:var(--x); top:var(--y); width:var(--w); height:var(--h); border:2px solid var(--blue); border-radius:8px; background:rgba(84,176,247,.08); box-shadow:0 0 0 2px rgba(15,17,21,.72); pointer-events:none; }
.manual-mark b { position:absolute; left:-12px; top:-12px; width:25px; height:25px; display:flex; align-items:center; justify-content:center; border-radius:9999px; background:var(--blue); color:#fff; font-size:12px; font-weight:600; box-shadow:0 0 0 3px var(--bg); }
.manual-notes { margin:10px 0 0; padding:0; list-style:none; display:grid; gap:5px; }
.manual-notes li { color:var(--text-dim); }
.manual-notes b { display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; margin-right:7px; border-radius:9999px; background:var(--blue); color:#fff; font-size:11px; }
@media (max-width:700px) { .visual-manual figure { padding:10px; } .visual-manual figcaption { font-size:13px; } }
