*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif}body{max-width:1000px;margin:2rem auto;padding:0 1rem;line-height:1.6}.container,h1,h2{margin-bottom:1.5rem}.container{background:#f5f5f5;padding:2rem;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.1)}h1,h2{color:#333;text-align:center}h2{font-size:1.3rem;text-align:left;border-bottom:1px solid #ddd;padding-bottom:.5rem}.btn{padding:.8rem 1.5rem;border:0;border-radius:4px;cursor:pointer;font-size:1rem;margin:.5rem;transition:background .3s}.btn-connect{background:#2196f3;color:#fff}.btn-disconnect{background:#f44336;color:#fff}.btn-send,.btn-set{background:#4caf50;color:#fff}.btn:disabled{background:#ccc;cursor:not-allowed}.input-group{margin:1.5rem 0}label{display:block;margin-bottom:.5rem;font-weight:700;color:#555}input[type=text]{padding:.8rem;width:100%;border:1px solid #ddd;border-radius:4px;font-size:1rem;letter-spacing:1px}.input-hint{font-size:.85rem;color:#666;margin-top:.3rem}.device-list,.log-box{background:#fff;border:1px solid #ddd;border-radius:4px;overflow-y:auto}.log-box{margin-top:1.5rem;padding:1rem;height:200px;font-family:monospace;font-size:.9rem}.device-list{margin-top:1rem;max-height:250px}.device-item{padding:1rem;border-bottom:1px solid #eee;cursor:pointer;transition:background .2s}.device-item:hover{background:#f9f9f9}.device-item.active{background:#e3f2fd;border-left:3px solid #2196f3}.device-info{font-size:.9rem;color:#555;margin-top:.3rem}.log-success{color:#4caf50}.log-error{color:#f44336}.log-info{color:#2196f3}.invalid{border-color:#f44336!important}.flex-group{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}