*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;background:#121212;color:#e0e0e0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;min-height:100vh}.settings-card{border:1px solid #4a6a8a;border-radius:8px;margin-bottom:.75rem;background:#181830;transition:opacity .2s,border-color .2s}.settings-card.disabled-card{opacity:.45;border-color:#2a2a35}.settings-card.disabled-card .settings-card-header:hover{background:#182838}.settings-card-header{display:flex;align-items:center;padding:.65rem .85rem;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;transition:background .12s;background:#1f5080}.settings-card-header:hover{background:#2a6090}.settings-card.disabled-card .settings-card-header{background:#1a2a38}.settings-card-title{display:flex;align-items:center;gap:.5rem;flex:1;min-width:0}.settings-card-chevron{font-size:.7rem;color:#668;width:1rem;text-align:center;flex-shrink:0}.settings-card-name{font-weight:600;font-size:.95rem;color:#e8ecf4;white-space:nowrap}.settings-card.disabled-card .settings-card-name{color:#89a}.experimental-banner{font-size:.78rem;color:#f5c542;background:#3a2e10;border:1px solid #f5c54266;border-radius:6px;padding:6px 10px;margin-bottom:10px;line-height:1.4}.settings-card-subtitle{font-size:.78rem;color:#0a1a2a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.settings-card.disabled-card .settings-card-subtitle{color:#998}.source-badge{font-size:.68rem;font-weight:700;letter-spacing:.04em;border-radius:3px;padding:.1rem .35rem;white-space:nowrap;flex-shrink:0}.source-badge.source-rx{color:#8cf;background:#1a2a3a;border:1px solid #2a4a6a}.source-badge.source-tx{color:#fc8;background:#3a2a1a;border:1px solid #6a4a2a}.source-badge.source-both{color:#afa;background:#1a2a1a;border:1px solid #4a6a4a}.connectivity-badge{padding:0;margin-right:.5rem;white-space:nowrap;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;line-height:0;background:transparent;border:none;height:0;overflow:visible}.connectivity-badge.connected{color:#4a8}.connectivity-badge.disconnected{color:#888;opacity:.75}.connectivity-badge svg{display:block;width:28px;height:28px}.toggle-switch{position:relative;display:inline-flex;width:40px;height:22px;flex-shrink:0;cursor:pointer;margin:0}.toggle-switch input{opacity:0;width:0;height:0;position:absolute}.toggle-slider{position:absolute;inset:0;background:#333;border-radius:11px;transition:background .2s}.toggle-slider:before{content:"";position:absolute;width:18px;height:18px;left:2px;bottom:2px;background:#888;border-radius:50%;transition:transform .2s,background .2s}.toggle-switch input:checked+.toggle-slider{background:#2a6}.toggle-switch input:checked+.toggle-slider:before{transform:translate(18px);background:#fff}.toggle-switch input:disabled+.toggle-slider{opacity:.4;cursor:not-allowed}.settings-card-body{padding:.5rem .85rem .75rem;border-top:1px solid #333}.settings-card-body label{display:flex;align-items:center;gap:.4rem;font-size:.85rem;color:#bbb;flex-wrap:wrap}.settings-card-body>label,.settings-card-body>.pilot-settings,.settings-card-body>.calibration-row,.settings-card-body>.cw-hint,.settings-card-body>.cw-auto-info,.settings-card-body>.opto-wiring-hint,.settings-card-body>.serial-port-row,.settings-card-body>.conflict-warning,.settings-card-body>.keyer-hint,.settings-card-body>.wpm-pill,.settings-card-body>.test-btn{margin-top:.55rem;padding-top:.55rem;border-top:1px solid #2a2a3a}.settings-card-body>:first-child{margin-top:0;padding-top:0;border-top:none}.card-section-divider{display:flex;align-items:center;gap:.6rem;margin-top:.75rem;padding-top:.75rem;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#88a}.card-section-divider:before,.card-section-divider:after{content:"";flex:1;border-top:1px solid #3a3a5a}.card-section-divider+label,.card-section-divider+.keyer-hint,.card-section-divider+.cw-hint,.card-section-divider+.conflict-warning{border-top:none}.wpm-pill{display:inline-flex;align-items:center;gap:.3rem;background:#1a2a1a;border:1px solid #2a4a2a;border-radius:4px;padding:.15rem .5rem;white-space:nowrap}.wpm-pill-label{font-size:.7rem;color:#8ab;text-transform:uppercase;letter-spacing:.4px}.wpm-pill-value{font-variant-numeric:tabular-nums;font-size:.95rem;font-weight:600;color:#0f0;min-width:2em;text-align:center;position:relative;top:-.04em}.wpm-pill-interactive{gap:.15rem;padding:.1rem .25rem}.wpm-btn{background:#2a3a2a;color:#8cf;border:1px solid #446;border-radius:3px;width:1.1rem;height:1.1rem;font-size:.7rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;line-height:1;min-height:auto}.wpm-btn:hover{background:#3a5a3a}.settings-card-body select,.settings-card-body input[type=number]{background:#222;color:#ddd;border:1px solid #555;border-radius:3px;padding:.2rem .4rem;font-size:.85rem}.settings-card-body select{max-width:260px;flex:1}.settings-card-body input[type=range]{flex:1;min-width:80px;accent-color:#8cf}.settings-card-body input[type=checkbox]{accent-color:#8cf;width:16px;height:16px}.calibration-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin:.5rem 0 .25rem;padding:.5rem;background:#1a1a28;border:1px solid #335;border-radius:4px}.calibration-label{font-size:.8rem;color:#8cf;font-weight:600}.calibration-row button{font-size:.78rem;padding:.25rem .6rem;background:#2a2a4a;border-color:#557}.calibration-row button:hover:not(:disabled){background:#3a3a5a}.calibration-row button:disabled{opacity:.4;cursor:not-allowed}.calibration-values{font-size:.78rem;font-family:Courier New,monospace;color:#adf}.conflict-warning{background:#a33;color:#fff;padding:.55rem 1rem;border-radius:4px;font-weight:600;font-size:.9rem;margin-bottom:.5rem}.key-capture{font-family:Courier New,monospace;font-size:.85rem;padding:.25rem .6rem;background:#282840;color:#adf;border:1px dashed #669;border-radius:3px;cursor:pointer;min-width:80px;text-align:center}.key-capture:focus{border-color:#8cf;outline:2px solid #8cf4;background:#303050}.key-capture-clear{font-size:1rem;padding:.15rem .45rem;background:transparent;color:#f66;border:1px solid #664444;border-radius:3px;cursor:pointer;margin-left:.25rem;line-height:1}.key-capture-clear:hover{background:#422;border-color:#f66}.pilot-settings{margin:.4rem 0;padding:.5rem .7rem;background:#161630;border:1px solid #335;border-radius:4px}.pilot-settings label{margin-bottom:.35rem}.pilot-wiring-hint{font-size:.75rem;color:#8ab;line-height:1.4;margin-top:.35rem;padding:.3rem .5rem;background:#1a1a30;border-left:3px solid #468;border-radius:2px}.opto-wiring-hint{font-size:.75rem;color:#8ab;line-height:1.4;margin-top:.35rem;padding:.3rem .5rem;background:#1a1a30;border-left:3px solid #864;border-radius:2px}.test-btn{padding:.3rem .8rem;font-size:.8rem;background:#335;color:#cdf;border:1px solid #556;border-radius:4px;cursor:pointer;margin-top:.25rem}.test-btn:hover:not(:disabled){background:#446}.test-btn:disabled{opacity:.4;cursor:default}.serial-port-row{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.serial-status{font-size:.8rem;color:#889}.serial-status.connected{color:#0f0}.serial-input-signals{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.4rem .5rem;background:#12122a;border-radius:4px;border:1px solid #2a2a4a}.signal-label{font-size:.78rem;color:#8ab;margin-right:.2rem}.signal-led{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;font-family:monospace;font-weight:600;padding:.15rem .5rem;border-radius:3px;border:1px solid #333;transition:background .1s,color .1s,box-shadow .1s}.signal-led.led-off{background:#1a1a2e;color:#556}.signal-led.led-on{background:#0a3a0a;color:#0f0;border-color:#0a0;box-shadow:0 0 6px #00ff004d}.signal-hint{font-size:.7rem;color:#667;font-style:italic}.signal-mode-toggle{font-size:.75rem;color:#8ab;display:inline-flex;align-items:center;gap:.3rem;cursor:pointer}.signal-mode-toggle input{width:14px;height:14px}.signal-mode-toggle input[type=number]{width:60px;height:auto;padding:.15rem .3rem;font-size:.75rem;background:#1a1a2e;color:#cde;border:1px solid #333;border-radius:3px;text-align:center}.cw-hint{font-size:.75rem;color:#8ab;line-height:1.4;margin-top:.35rem;padding:.3rem .5rem;background:#1a1a30;border-left:3px solid #486;border-radius:2px}.cw-auto-info{font-size:.75rem;color:#acd;padding:.25rem .5rem;background:#1a2a30;border-radius:3px;font-family:monospace}.prosign-example{font-size:.85em;color:#8ab;font-family:monospace;font-weight:600}.prosign-table{width:100%;border-collapse:collapse;margin:.5rem 0;font-size:.85rem}.prosign-table th{text-align:left;padding:.4rem .5rem;background:#1a2a38;border:1px solid #334;color:#8cf;font-weight:600;font-size:.8rem}.prosign-table td{padding:.35rem .5rem;border:1px solid #334;color:#abc}.prosign-table tr:nth-child(2n){background:#1a1a28}.prosign-table tr:nth-child(odd){background:#181824}.prosign-table code{font-family:monospace;color:#8cf;background:#1a2a38;padding:.1rem .3rem;border-radius:2px;font-size:.9em}.keyer-hint{font-size:.72rem;color:#789;line-height:1.35;margin-top:.3rem;padding:.25rem .4rem;background:#161625;border-left:3px solid #446;border-radius:2px}.checkbox-label{display:flex;align-items:center;gap:.4rem;cursor:pointer}.card-color-row{display:flex;align-items:center;gap:.6rem}.card-color-picker{width:36px;height:30px;padding:0;border:1px solid #444;border-radius:4px;cursor:pointer;background:transparent}.card-color-clear{background:transparent;color:#888;border:1px solid #444;border-radius:4px;cursor:pointer;font-size:.8rem;padding:.15rem .4rem;line-height:1}.card-color-clear:hover{color:#ccc;border-color:#666}.card-color-preview{font-size:.85rem;font-weight:600}.required-mark{color:#e55;margin-left:.15em}.field-invalid{color:#e55}.field-invalid input[type=text],.field-invalid input[type=password]{border-color:#c44}.settings-card-body button{cursor:pointer;padding:.35rem .8rem;font-size:.85rem;background:#333;color:#ddd;border:1px solid #555;border-radius:4px;transition:background .12s}.settings-card-body button:hover{background:#444}label{-webkit-user-select:none;user-select:none}select{max-width:300px}@media (max-width: 768px){.settings-card-body select{max-width:100%}.calibration-row{flex-direction:column;align-items:stretch;gap:.35rem}.calibration-row button{width:100%}}@media (max-width: 480px){.settings-card-header{padding:.55rem .65rem}.settings-card-body{padding:.4rem .65rem .6rem}.settings-card-name{font-size:.85rem}.settings-card-subtitle{font-size:.7rem}.serial-port-row{flex-direction:column;align-items:stretch}.serial-port-row button,.serial-port-row .test-btn{width:100%}.pilot-wiring-hint,.opto-wiring-hint,.cw-hint,.keyer-hint{font-size:.72rem}.settings-card-body select,.settings-card-body input[type=number]{font-size:.8rem;max-width:100%}}@media (pointer: coarse){.settings-card-body button{min-height:40px;padding:.4rem .9rem}.test-btn{min-height:36px}.settings-card-header{min-height:48px}.toggle-switch{width:48px;height:26px}.toggle-slider{border-radius:13px}.toggle-slider:before{width:22px;height:22px}.toggle-switch input:checked+.toggle-slider:before{transform:translate(22px)}.settings-card-body input[type=checkbox]{width:20px;height:20px}.settings-card-body select,.settings-card-body input[type=number]{min-height:36px;font-size:.88rem}.key-capture{min-height:40px;min-width:100px}}.midi-mapping-list{display:flex;flex-direction:column;gap:.4rem;margin-top:.5rem}.midi-mapping-row{display:flex;align-items:center;gap:.35rem;padding:.35rem .5rem;background:#1a1a28;border:1px solid #335;border-radius:4px}.midi-mapping-row-disabled{opacity:.5}.midi-mapping-enable{flex-shrink:0;display:flex;align-items:center}.midi-mapping-name{font-size:.82rem;font-weight:600;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:6rem}.midi-mapping-mode{font-size:.82rem;font-weight:600;color:#8af;min-width:3.2rem;cursor:pointer}.midi-mapping-value{font-family:monospace;font-size:.85rem;color:#ddd;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.source-badge-sm{font-size:.65rem;padding:.05rem .3rem;cursor:pointer}.midi-mapping-reverse{font-size:.85rem;color:#aaa;cursor:pointer}.midi-mapping-spacer{flex:1}.midi-mapping-btn{background:none;border:none;cursor:pointer;font-size:.95rem;padding:.25rem .35rem;border-radius:3px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.midi-mapping-btn svg{display:block}.midi-mapping-btn-edit{color:#aaa}.midi-mapping-btn-edit:hover{color:#fff;background:#333}.midi-mapping-add-btn{margin-top:.5rem;background:#2a2a3e;color:#8af;border:1px dashed #446;border-radius:4px;padding:.35rem .8rem;font-size:.85rem;cursor:pointer;transition:background .15s}.midi-mapping-add-btn:hover{background:#333}.midi-mapping-connected-icon{display:inline-flex;align-items:center;justify-content:center;margin-left:.15rem;flex-shrink:0;height:0;overflow:visible;line-height:0}.midi-output-note-row{display:flex;align-items:center;gap:.4rem;margin-bottom:.5rem;flex-wrap:wrap}.midi-output-note-label{min-width:90px;font-size:.88rem;color:#ccc}.midi-note-select{width:60px;padding:.25rem .3rem;background:#222;color:#eee;border:1px solid #555;border-radius:4px;font-size:.85rem}.midi-octave-select{width:52px;padding:.25rem .3rem;background:#222;color:#eee;border:1px solid #555;border-radius:4px;font-size:.85rem}.midi-raw-input{width:65px;padding:.25rem .3rem;background:#222;color:#eee;border:1px solid #555;border-radius:4px;font-size:.85rem}.midi-mode-toggle{background:transparent;border:1px solid #555;color:#8cf;border-radius:4px;padding:.2rem .45rem;cursor:pointer;font-size:.85rem;line-height:1}.midi-mode-toggle:hover{background:#333}.midi-note-preview{font-size:.8rem;color:#888;margin-left:.2rem}.midi-mapping-connected-icon{display:inline-flex;align-items:center;justify-content:center;margin-left:.15rem;transition:color .15s;height:0;overflow:visible;line-height:0}.midi-mapping-connected-icon.connected{color:#4a8}.midi-mapping-connected-icon.disconnected{color:#556}.midi-mapping-connected-icon svg{display:block;width:28px;height:28px}.prosign-actions-list{display:flex;flex-direction:column;gap:.4rem;margin-top:.5rem}.prosign-action-row{display:flex;align-items:center;gap:.6rem;padding:.35rem .5rem;background:#1a1a28;border:1px solid #335;border-radius:4px}.prosign-action-enable{flex-shrink:0;display:flex;align-items:center}.prosign-action-name{font-family:monospace;font-size:.9rem;color:#fc0;min-width:3.6rem;flex-shrink:0}.prosign-action-select{background:#222;color:#ddd;border:1px solid #555;border-radius:3px;padding:.2rem .4rem;font-size:.85rem;flex:1;max-width:180px}.prosign-action-select:disabled{opacity:.4;cursor:not-allowed}.emoji-list{display:flex;flex-direction:column;gap:.4rem;margin-top:.5rem}.emoji-row{display:flex;align-items:center;gap:.3rem;padding:.35rem .5rem;background:#1a1a28;border:1px solid #335;border-radius:4px}.emoji-row-disabled{opacity:.5}.emoji-enable{flex-shrink:0;display:flex;align-items:center}.emoji-match-text{font-family:monospace;font-size:.9rem;color:#fc0;min-width:3rem;cursor:pointer}.emoji-emoji-text{font-size:1.3rem;min-width:1.6rem;cursor:pointer;text-align:center}.emoji-meaning-text{font-size:.8rem;color:#889;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:12rem}.emoji-meaning-input{background:#222;color:#ddd;border:1px solid #555;border-radius:3px;padding:.2rem .4rem;font-size:.8rem;width:8rem}.emoji-row-spacer{flex:1}.emoji-match-input{background:#222;color:#ddd;border:1px solid #555;border-radius:3px;padding:.2rem .4rem;font-size:.85rem;font-family:monospace;width:6rem}.emoji-emoji-input{background:#222;color:#ddd;border:1px solid #555;border-radius:3px;padding:.2rem .4rem;font-size:1.1rem;width:3rem;text-align:center}.emoji-emoji-input-group{display:inline-flex;align-items:center;gap:.25rem}.emoji-btn{background:none;border:none;cursor:pointer;font-size:.95rem;padding:.25rem .35rem;border-radius:3px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.emoji-btn svg{display:block}.emoji-btn-save{color:#4caf50}.emoji-btn-save:hover{background:#2a3a2a}.emoji-btn-cancel{color:#f44}.emoji-btn-cancel:hover{background:#3a2a2a}.emoji-btn-edit{color:#aaa}.emoji-btn-edit:hover{color:#fff;background:#333}.emoji-btn-delete{color:#a66}.emoji-btn-delete:hover{color:#f44;background:#3a2a2a}.emoji-btn-picker{color:#aaa}.emoji-btn-picker:hover{color:#fc0;background:#333}.emoji-error{color:#f44;font-size:.8rem;padding-left:2.5rem;margin-top:-.2rem}.emoji-add-btn{margin-top:.5rem;background:#2a2a3e;color:#8af;border:1px dashed #446;border-radius:4px;padding:.35rem .8rem;font-size:.85rem;cursor:pointer;transition:background .15s}.emoji-add-btn:hover{background:#333}
