body.sys[data-screen=open],body.sys[data-screen=chord],body.sys[data-screen=paths]{--line:var(--os)}
body.sys[data-screen=hq]{--line:var(--hq)}body.sys[data-screen=rx]{--line:var(--rx)}body.sys[data-screen=ai]{--line:var(--ai)}
body.sys[data-screen=rx] #line i{transition-duration:1.8s}
.screen[data-key=hq]{--k:var(--hq)}.screen[data-key=rx]{--k:var(--rx)}.screen[data-key=ai]{--k:var(--ai)}
.screen[data-key=ai]{--kt:var(--ai-text)}.screen[data-key=hq]{--kt:var(--hq)}.screen[data-key=rx]{--kt:var(--rx)}
.screen[data-key=rx] .rv{transition-duration:1.8s}
.kicker{font:600 14px var(--font-head);letter-spacing:.14em;text-transform:uppercase;color:var(--kt,var(--os));margin-bottom:14px}
.kwm{height:clamp(44px,7vw,86px);width:auto;display:block;margin-bottom:22px}
.pts{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:16px;max-width:46em}
.pts li{background:var(--surface);border-left:3px solid var(--k);border-radius:12px;padding:16px 22px}
.pts b{font:700 1.1rem var(--font-head);color:var(--kt)}.pts span{color:var(--text);display:block;margin-top:2px}
.note{color:var(--muted);font-style:italic;margin-top:20px}
.nodes{display:flex;gap:16px;flex-wrap:wrap;margin:8px 0 0}
.node{width:190px;background:var(--surface);border:2px solid #3a3f44;border-radius:16px;padding:18px;transition:border-color .5s,box-shadow .5s}
.node b{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;border:2px solid #3a3f44;font:700 1.2rem var(--font-head);margin-bottom:10px;transition:.5s}
.node h4{margin:0 0 4px;font:700 1.05rem var(--font-head)}.node p{margin:0;color:var(--muted);font-size:15px;line-height:1.45}
.node.lit{border-color:var(--hq);box-shadow:0 0 22px -4px var(--hq)}.node.lit b{border-color:var(--hq);color:var(--hq)}
.closeline{margin-top:30px;font:600 clamp(1.15rem,2vw,1.5rem) var(--font-head);color:var(--kt,var(--os))}
.chordmark{width:min(260px,60vw);margin:10px 0 26px;filter:drop-shadow(0 0 34px rgba(222,194,126,.35))}
.keys{position:fixed;right:calc(var(--pad) / 2);top:50%;transform:translateY(-50%);z-index:12;display:grid;gap:14px}
.keys a{display:flex;align-items:center;gap:10px;justify-content:flex-end;text-decoration:none;color:var(--muted);font:600 12px var(--font-head)}
.keys a i{width:12px;height:12px;border-radius:50%;border:2px solid var(--c);background:transparent;transition:background .4s,box-shadow .4s}
.keys a span{opacity:0;transition:opacity .3s}.keys a:hover span,.keys a:focus-visible span,.keys a[aria-current=true] span{opacity:1}
.keys a[aria-current=true] i{background:var(--c);box-shadow:0 0 12px var(--c)}
.keys a.hq{--c:var(--hq)}.keys a.rx{--c:var(--rx)}.keys a.ai{--c:var(--ai)}
@media(max-width:900px){.keys{display:none}.node{width:100%}}