/* long-press: haptic pulse + keycap strip (round 7) */
.lp-pulse{animation:lpp .26s ease-out}
@keyframes lpp{0%{transform:scale(1)}40%{transform:scale(.955)}100%{transform:scale(1)}}
.lpk{position:fixed;z-index:200;padding:6px 7px 5px;background:var(--card,#0b0b0b);border:1px solid var(--line2,#2a2a2a);border-radius:12px;box-shadow:0 10px 30px #000c;opacity:0;transform:scale(.88);transition:opacity .12s,transform .15s cubic-bezier(.2,.9,.3,1.3);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation}
.lpk.on{opacity:1;transform:scale(1)}
.lpk .kr{display:flex;gap:7px}
.lpk .kc{display:flex;flex-direction:column;align-items:center;gap:3px;width:32px;padding:0}
.lpk .kc b{width:30px;height:30px;border-radius:7px;background:var(--key,#161616);border:1px solid var(--key-line,#333);display:grid;place-items:center;box-shadow:inset 0 -2px 0 #0006;color:var(--key-ink,#fff);font-weight:200}
.lpk .kc svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
/* headers and keycaps stay readable, with a minimum size */
.lpk .kc span{font-size:max(8px,8.5px);color:var(--dim);letter-spacing:.03em;line-height:1;white-space:nowrap;min-height:9px}
.lpk .kc.dg b{color:var(--red)}
.lpk .kc.on b{border-color:var(--red);color:var(--red)}
.lpk .kc:active b{background:var(--ink,#fff);color:var(--bg,#000);border-color:var(--ink,#fff)}
.lpk .kc.dg:active b{background:var(--red);color:#000;border-color:var(--red)}
.lpk .kdot{width:12px;height:12px;border-radius:50%;background:conic-gradient(#ff452b,#ffb02e,#3ad07a,#4aa8ff,#fff,#ff452b)}
.lpk .ksw{width:14px;height:14px;border-radius:50%;background:var(--c);border:1px solid #444}
.lpk .kp{position:absolute;left:var(--px);width:8px;height:8px;background:var(--card,#0b0b0b);transform:translateX(-50%) rotate(45deg)}
.lpk[data-dir=up] .kp{bottom:-5px;border-right:1px solid var(--line2,#2a2a2a);border-bottom:1px solid var(--line2,#2a2a2a)}
.lpk[data-dir=down] .kp{top:-5px;border-left:1px solid var(--line2,#2a2a2a);border-top:1px solid var(--line2,#2a2a2a)}
