styles.css

body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;margin:0;background:#f9fafb;color:#111}
.popup-container{width:480px;padding:16px}
h1{font-size:16px;margin:0 0 2px}
.subtitle{font-size:12px;color:#666;margin:0 0 14px}
.binding-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.key-input{width:130px;font-size:12px;font-family:monospace;padding:5px 8px;border:1px solid #ccc;border-radius:6px;background:#fff;cursor:pointer;flex-shrink:0}
.key-input.recording{border-color:#3b82f6;background:#eff6ff;outline:2px solid #93c5fd}
.text-input{flex:1;font-size:12px;padding:5px 8px;border:1px solid #ccc;border-radius:6px;background:#fff}
.delete-btn{background:none;border:none;color:#ef4444;cursor:pointer;font-size:14px;padding:2px 6px;border-radius:4px;flex-shrink:0}
.delete-btn:hover{background:#fee2e2}
#add-btn{margin-top:4px;font-size:12px;padding:6px 12px;border:1px dashed #aaa;border-radius:6px;background:#fff;cursor:pointer;color:#555;width:100%}
#add-btn:hover{background:#f3f4f6}
.footer{display:flex;align-items:center;gap:10px;margin-top:12px}
button.primary{font-size:13px;padding:7px 16px;background:#3b82f6;color:white;border:none;border-radius:6px;cursor:pointer}
button.primary:hover{background:#2563eb}
#status{font-size:12px;color:#16a34a}
#sk-toast{position:fixed;bottom:80px;right:20px;background:#1e293b;color:#fff;padding:10px 16px;border-radius:8px;font-size:13px;font-family:-apple-system,sans-serif;z-index:99999;box-shadow:0 4px 12px rgba(0,0,0,.3);animation:sk-fadein .2s ease}
@keyframes sk-fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}