.page-bind-generator .bg-section{margin-bottom:3rem}.page-bind-generator .bg-presets{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:1.5rem;display:flex}.page-bind-generator .bg-keyboard{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.6rem;margin-bottom:1.5rem;display:grid}.page-bind-generator .bg-key{background:var(--bg2);border:1px solid var(--border);border-radius:2px;padding:.75rem;transition:border-color .12s,transform .12s}.page-bind-generator .bg-key:hover{border-color:var(--accent);transform:translateY(-2px)}.page-bind-generator .bg-key-label{font-family:var(--font-display);color:var(--text2);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.4rem;font-size:.82rem;font-weight:700}.page-bind-generator .bg-key-select{background:var(--bg3);width:100%;color:var(--text);border:1px solid var(--border);border-radius:4px;padding:.35rem;font-family:inherit;font-size:.82rem}.page-bind-generator .bg-output-section{margin-top:1.5rem}.page-bind-generator .bg-output{background:var(--bg3);border:1px solid var(--border);color:var(--accent);white-space:pre;border-radius:3px;max-height:300px;margin:.75rem 0;padding:1rem;font-family:Courier New,monospace;font-size:.85rem;overflow:auto}.page-bind-generator .bg-actions{gap:.75rem;display:flex}.page-bind-generator .bg-jt-options{flex-wrap:wrap;gap:2rem;margin-bottom:1rem;display:flex}.page-bind-generator .bg-util-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem;display:grid}.page-bind-generator .bg-util-card{background:var(--bg2);border:1px solid var(--border);border-top:3px solid var(--accent);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);border-radius:2px;padding:1.25rem;transition:border-color .12s,transform .12s}.page-bind-generator .bg-util-card:hover{border-color:var(--accent);transform:translateY(-2px)}.page-bind-generator .bg-util-card h3{margin:0 0 .3rem;font-size:1rem}.page-bind-generator .bg-util-card p{color:var(--text2);margin:0 0 .75rem;font-size:.85rem}.page-bind-generator .bg-util-output{background:var(--bg3);border:1px solid var(--border);color:var(--accent);white-space:pre-wrap;word-break:break-all;border-radius:4px;margin:.5rem 0;padding:.5rem;font-family:Courier New,monospace;font-size:.78rem}@media (max-width:768px){.page-bind-generator .bg-keyboard{grid-template-columns:repeat(2,1fr)}.page-bind-generator .bg-util-grid{grid-template-columns:1fr}.page-bind-generator .bg-jt-options{flex-direction:column;gap:.75rem}}.page-bind-generator .bg-kbd{flex-direction:column;gap:.35rem;margin:1rem 0;padding-bottom:.3rem;display:flex;overflow-x:auto}.page-bind-generator .bg-kbd-row{flex-wrap:nowrap;gap:.35rem;display:flex}.page-bind-generator .bg-kbd-key{background:var(--bg2,#12161d);border:1px solid var(--border,#2a3342);min-width:2.4rem;color:var(--text,#f2f5fa);cursor:pointer;white-space:nowrap;border-radius:6px;padding:.45rem .5rem;font-size:.74rem;font-weight:600;position:relative}.page-bind-generator .bg-kbd-key:hover{border-color:var(--accent,#f5c518)}.page-bind-generator .bg-kbd-key.selected{border-color:var(--accent,#f5c518);background:#f5c5181f}.page-bind-generator .bg-kbd-key.bound{background:#35c46a1a;border-color:#35c46a}.page-bind-generator .bg-kbd-key.bound.selected{border-color:var(--accent,#f5c518)}.page-bind-generator .bg-kbd-key.caution:after{content:"";opacity:.7;background:#f5c518;border-radius:50%;width:5px;height:5px;position:absolute;top:3px;right:3px}.page-bind-generator .bg-kbd-count{color:#08110b;text-align:center;background:#35c46a;border-radius:50%;width:15px;height:15px;font-size:.62rem;font-weight:800;line-height:15px;position:absolute;bottom:-5px;right:-5px}.page-bind-generator .bg-picker{border:1px solid var(--border,#2a3342);background:var(--bg2,#12161d);border-radius:8px;margin:.8rem 0;padding:.9rem 1rem}.page-bind-generator .bg-picker-head{align-items:center;gap:.8rem;margin-bottom:.6rem;display:flex}.page-bind-generator .bg-picker-head strong{color:var(--accent,#f5c518);font-size:1rem}.page-bind-generator .bg-picker-head span{color:var(--text2,#8a94a6);font-size:.82rem}.page-bind-generator .bg-picker-cat{margin:.45rem 0}.page-bind-generator .bg-picker-cat-label{text-transform:uppercase;letter-spacing:.05em;color:var(--text2,#8a94a6);margin-bottom:.3rem;font-size:.72rem;display:block}.page-bind-generator .bg-picker-items{flex-wrap:wrap;gap:.4rem;display:flex}.page-bind-generator .bg-item{background:var(--bg,#0b0e13);border:1px solid var(--border,#2a3342);color:var(--text,#f2f5fa);cursor:pointer;border-radius:6px;flex-direction:column;align-items:flex-start;padding:.35rem .6rem;font-size:.78rem;display:flex}.page-bind-generator .bg-item.on{background:#35c46a1f;border-color:#35c46a}.page-bind-generator .bg-item-meta{color:var(--text2,#8a94a6);font-size:.68rem}.page-bind-generator .bg-item-meta.side-t{color:#e0a44c}.page-bind-generator .bg-item-meta.side-ct{color:#6ba3e8}.page-bind-generator .bg-totals{color:var(--text2,#8a94a6);font-size:.85rem}.page-bind-generator .bg-totals span{font-size:.75rem}.page-bind-generator .bg-nade-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.3rem .9rem;margin-bottom:.8rem;display:grid}
