.kkb-panel{--_gap:var(--kkb-gap,4px);--_key-size:var(--kkb-key-size,2.2rem);--_key-font:var(--kkb-key-font-size,1.1rem);gap:var(--_gap);flex-direction:column;display:flex}@media (pointer:coarse){.kkb-panel{--_key-size:var(--kkb-key-size,44px);--_key-font:var(--kkb-key-font-size,1.3rem)}}.kkb-row{gap:var(--_gap);flex-wrap:wrap;display:flex}.kkb-panel button{min-width:var(--_key-size);min-height:var(--_key-size);font-size:var(--_key-font);cursor:pointer;background:var(--kkb-key-bg,ButtonFace);color:var(--kkb-key-color,ButtonText);border:1px solid var(--kkb-key-border,color-mix(in srgb, ButtonText 40%, transparent));border-radius:var(--kkb-key-radius,4px)}.kkb-controls button[aria-pressed=true]{background:var(--kkb-pressed-bg,#cbdcee);color:#000}.kkb-panel button:focus-visible{outline:2px solid var(--kkb-focus-color,#1a56a0);outline-offset:2px}@media (width<=480px){.kkb-panel button{flex:auto}}.kkb-docked{background:var(--kkb-surface-bg,Canvas);box-sizing:border-box;padding:6px;box-shadow:0 -2px 8px #0003}.kkb-floating{background:var(--kkb-surface-bg,Canvas);border-radius:8px;padding:6px;box-shadow:0 2px 12px #00000040}
