/* Native HTML diagrams; shared with the printed reference pages. */
.reference-sheet{border:1px solid #626565;background:#0c0d0d;padding:32px!important;margin:0 0 36px;scroll-margin-top:140px}.sheet-top{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #565959;padding-bottom:15px;font:9px/1.4 var(--mono);letter-spacing:.06em;color:#a8aaaa}.reference-sheet>.eyebrow{margin:25px 0 9px}.reference-sheet h2{font-size:clamp(36px,4vw,54px);font-weight:800;letter-spacing:-2px;line-height:1.02;margin:0 0 18px}.reference-sheet .sheet-intro{font-size:13px;line-height:1.6;margin:0 0 20px}.key-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.key-card{border:1px solid #3d4040;padding:17px 15px;background:#121414}.key-heading{display:flex;gap:10px;align-items:baseline}.key-heading>span{font:10px var(--mono);color:#888}.key-card h3{font-size:12px!important;line-height:1.3;letter-spacing:.03em;margin:0!important;font-weight:800}.key-combo{display:flex;gap:6px;align-items:center;flex-wrap:wrap;min-height:48px;margin:12px 0 6px}.key-combo kbd{border:1px solid #858787;border-bottom-width:3px;border-radius:4px;padding:8px;font:700 11px/1.2 Arial,Helvetica,sans-serif;color:#f4f4f4;background:#1a1c1c;white-space:nowrap}.key-combo .encoder-key{border-radius:18px;padding:7px 11px}.key-combo kbd small{font:8px/1.1 var(--mono);display:block;text-align:center;margin-top:4px;color:#ccc}.key-combo>b{font:12px var(--mono);color:#aaa}.key-card p{font-size:12px!important;line-height:1.55!important;margin:7px 0 0!important;color:#b4b6b6}.play-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid #eee;margin-top:20px;padding-top:15px;gap:14px}.play-strip strong{font-size:10px;display:block;line-height:1.3}.play-strip span{font-size:11px;line-height:1.5;color:#bbb;display:block;margin-top:6px}.reference-sheet .sheet-foot{font-size:10px!important;line-height:1.6!important;color:#a5a8a8;margin:18px 0 0}.sheet-link{display:inline-block;font:9px var(--mono);margin-top:18px}.project-node{border:2px solid #eee;padding:20px;display:grid;gap:6px;margin-top:23px}.project-node>span,.track-node>div>span,.role-grid article>span,.map-bottom article>span{font:9px var(--mono);letter-spacing:.08em;color:#aaa}.project-node strong{font-size:26px;line-height:1.2;letter-spacing:-.7px}.project-node small{font-size:12px;color:#b8bbbb}.map-arrow{text-align:center;font:9px/1.6 var(--mono);padding:13px 0;color:#aaa}.track-node{border:1px solid #888;padding:15px;display:grid;grid-template-columns:1fr 1.1fr;gap:14px;align-items:center}.track-node strong{font-size:18px;line-height:1.3;display:block;margin-top:5px;letter-spacing:-.3px}.track-cells{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}.track-cells span{border:1px solid #5e6161;text-align:center;font:9px/1 var(--mono);padding:7px 1px}.track-cells span:first-child{background:#eee;color:#111;border-color:#eee}.role-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.role-grid article{border-top:3px solid #ddd;padding:14px 12px;background:#151717}.role-grid h3{font-size:20px!important;letter-spacing:-.6px;margin:8px 0!important;line-height:1.1}.role-grid p,.role-sub,.map-bottom p{font-size:11px!important;line-height:1.6!important;margin:0!important;color:#b2b5b5}.role-sub{border-top:1px solid #444;padding-top:10px;margin-top:12px!important}.role-sub b{color:#eee}.song-path{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:10px;border:1px solid #777;padding:14px}.song-path div{display:grid;gap:5px}.song-path b{font-size:12px}.song-path span{font-size:10px;color:#aaa}.song-path i{font-size:20px;font-style:normal}.map-bottom{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:20px 0}.map-bottom h3{font-size:17px!important;line-height:1.2;margin:7px 0!important;letter-spacing:-.4px}.save-pair{display:grid;grid-template-columns:1fr 1fr;background:#eee;color:#111;padding:15px;gap:15px}.save-pair b{font-size:11px;display:block;line-height:1.3}.save-pair span{font-size:11px;line-height:1.5;display:block;margin-top:5px}.ref-standalone{max-width:900px;margin:auto;padding:30px 20px}.ref-standalone .reference-sheet{margin:20px 0}.ref-toolbar{display:flex;gap:20px;align-items:center;font:11px var(--mono)}.ref-toolbar button{padding:9px 15px;background:#eee;color:#111;border:0}.ref-standalone .sheet-link{display:none}
@media(max-width:600px){.reference-sheet{padding:22px 16px!important}.reference-sheet h2{font-size:37px}.sheet-top{font-size:7px}.key-grid{grid-template-columns:1fr}.key-card{padding:15px}.key-combo kbd{font-size:12px}.role-grid{grid-template-columns:1fr}.track-node{grid-template-columns:1fr}.role-grid article{padding:16px}.role-grid h3{font-size:23px!important}.role-grid p,.role-sub,.map-bottom p{font-size:13px!important}.play-strip{grid-template-columns:1fr;gap:13px}.play-strip>div{display:grid;grid-template-columns:120px 1fr;align-items:baseline;gap:10px}.play-strip span{margin:0}.map-bottom,.save-pair{grid-template-columns:1fr}.song-path{gap:6px;padding:12px 8px}.song-path b{font-size:10px}.song-path span{font-size:9px}.ref-standalone{padding:20px 12px}}
@media print{.ref-toolbar,.sheet-link{display:none!important}.reference-sheet{background:#fff!important;color:#111;border-color:#333;break-before:page;break-after:page;padding:10mm!important;margin:0!important;break-inside:avoid}.reference-sheet h2{font-size:29pt!important;color:#111;letter-spacing:-1.3px}.reference-sheet>.eyebrow{margin:6mm 0 2mm}.reference-sheet .sheet-intro{font-size:9pt}.sheet-top{font-size:6pt;color:#444}.key-grid{grid-template-columns:1fr 1fr!important;gap:2mm}.key-card{padding:3mm;background:#fff;border-color:#888}.key-card h3{font-size:8pt!important;color:#111}.key-card p{font-size:7.5pt!important;line-height:1.4!important;color:#333}.key-combo{min-height:10mm;margin:2mm 0}.key-combo kbd{color:#111;background:#fff;border-color:#555;font-size:8pt;padding:2mm}.key-combo kbd small{color:#333}.key-combo>b,.key-heading>span{color:#555}.play-strip{grid-template-columns:repeat(3,1fr)!important;border-color:#111;gap:3mm;padding-top:3mm;margin-top:4mm}.play-strip strong{font-size:7pt}.play-strip span{font-size:7pt;color:#333}.reference-sheet .sheet-foot{font-size:7pt!important;color:#333}.project-node{border-color:#111;padding:3mm;margin-top:4mm}.project-node strong{font-size:18pt}.project-node small{font-size:8pt;color:#333}.map-arrow{font-size:7pt;padding:2mm 0;color:#333}.track-node{grid-template-columns:1fr 1.1fr;padding:3mm}.track-node strong{font-size:12pt}.track-cells span{color:#111;font-size:7pt;padding:2mm 0}.track-cells span:first-child{background:#111;color:#fff}.role-grid{grid-template-columns:repeat(3,1fr)!important;gap:2mm}.role-grid article{background:#fff;padding:3mm;border-color:#111}.role-grid h3{font-size:12pt!important;color:#111}.role-grid p,.role-sub,.map-bottom p{font-size:7.5pt!important;color:#333}.role-sub b{color:#111}.project-node>span,.track-node>div>span,.role-grid article>span,.map-bottom article>span{font-size:6.5pt;color:#444}.song-path{padding:3mm;gap:2mm}.song-path b{font-size:8pt}.song-path span{font-size:7pt;color:#333}.map-bottom{grid-template-columns:1fr 1fr!important;gap:4mm;padding:4mm 0}.map-bottom h3{font-size:11pt!important;color:#111}.save-pair{grid-template-columns:1fr 1fr!important;background:#eee;padding:3mm;gap:3mm}.save-pair b,.save-pair span{font-size:7.5pt;color:#111}.ref-standalone{padding:0;max-width:none}}
@media print{@page{size:A4;margin:10mm}.ref-standalone .reference-sheet{break-before:auto;break-after:auto}.ref-standalone>.attribution{font-size:7pt;line-height:1.4;margin:3mm 0 0;color:#444}}
